【FineReport】大屏操作笔记

整个效果图如下

一、远程文件保存到本地

1.切换远程目录

文件–>切换工作目录，填写主机名、端口号和数据库相关信息就可以实现本地和远程的切换

【例如】

2.本地模板另存为

切换到相应的远程目录，将远程模板打开，再切换到本地目录即可实现远程文件在本地的另存为操作了

二、整体布局

观察整体效果总共分为：上、中、下

上方：两部分构成，标题栏和数字栏
中间：两部分构成，分别是中央的大地图和两侧的6个图表
下方：由三大部分构成：左边的两个饼图、中间的两个tab,右侧的跑马灯效果

1.新建决策报表

2.调整报表块自适应属性

模板——表单报表块自适应属性——编辑全局配置——双向自适应

3.调整布局方式

布局方式设置成绝度布局、适应区域

4.调整像素

根据项目要求调整下方的画布像素

5.拖拽空白快

根据效果图的布局方式进行空白快拖拽，并调整结构

【注意】当拖拽过程中出现红字时无法完成拖拽，可以换一下位置再拖一遍，拖拽成功在画布上进行移动和设置

【注意】为了尺寸精准可以采用两种方式优化：
方式一：设置宽度和长度
方式二：采用复制、粘贴的方式

三、放置背景图片

选中报表块——选择"样式

四、标题板块

1.设置标题连接

函数image

2.设置标题名

拖拽报表块–>覆盖原来报表块

A1输入

五、第二行数字标题

1.填写数字
设置列宽
设置小数
设置单元格对齐（不是上面，是右面）

2.填写名称

设置单元格对齐

注意：对齐方式尽量往中间对齐。

3.添加动态图片

（1）左边添加列–>合并

（2）动态图片

主表拖拽tab块–>插入公式imag

（3）修改动态图片

六、pv/uv环比图

1.设置

使用字段名：线条图

使用字段值：条形图

2.设置样式

去掉展示工具栏：

特效–>交互属性，取消勾选

调整：标题位置

方式一：不用标题，写点点，选择颜色类似于背景色—>建tab块，覆盖显示

方式二

坐标轴

x,y轴

去掉网格线

七、环形图

八、条形图

设置不可见

设置数据、节点名称

传参

右击添加条件属性

九、中心地图

1.GI涂层关掉

2.地图省份轮播效果

body–>右下角事件

setTimeout(function(){
var vanchart = FR.Chart.WebUtils.getChart('chart11').vanCharts.charts[0],
openAutoTooltipCarouselDelay = 7000;
openAutoTooltipCarousel();

function openAutoTooltipCarousel(ele){
var series = vanchart.series; // 获取chart下的所有系列
// 获取系列第一个系列的所有数据点
// 注意，每次只能显示一个数据点提示，如果需要显示多个数据点的提示内容，可以在plotOptions里面开启数据提示共享
var points = series[0].points, 
pointsLen = points.length;
// 默认的提示轮播从第一个点开始
var pointIndex = 0;

window.openAutoTooltipCarouselTimer = setInterval(function (){
// 遍历series下面每个系列的点
// 使用vanchart.showTooltip依次展示不同索引的数据点
vanchart.showTooltip(points[pointIndex]);

pointIndex < pointsLen - 1 ? pointIndex++ : pointIndex = 0;

}, openAutoTooltipCarouselDelay)
}
},7000);

修改只修改chart11(地图是多少就是按照多少)，时间单位为：毫秒

十、饼图

内径占比–圆环

十一、组合图

数据根据图形分开设置

例如：柱形图+折线图

十二、呼吸效果

特效–>条件显示–>条件属性，什么都不填写

十三、跑马灯

两种方式：

方式一：

方式二：