最近有个页面展示的需求,公司采购的有帆软FineReport,于是用这个绘制,记录下来,方便备查。

第一步、页面布局

绘制表格。新建数据查询,调整表格布局并进行数据绑定,效果如下图所示。
在这里插入图片描述
绘制折线图。在A1单元格右键–> 单元格元素,选择 插入图表,在下拉列表中选择 折线图(新特性),选择喜欢的样式。
在这里插入图片描述
选中区域,与报表的表格等宽,合并单元格即可,效果如下所示。
在这里插入图片描述

第二步、数据绑定

数据编辑栏,数据来源-单元格数据,来源=A17,即按照时间来统计,折线图从下面的报表中取值,这里统计三个指标,即三个系列,设置对应的关系,效果如下图所示。
在这里插入图片描述
样式编辑栏标题页签,设置标题名,字体样式等,注意要勾选 标题可见。
在这里插入图片描述
坐标轴页签下,默认有 X轴 和 Y轴,坐标轴可以手动增加。
在这里插入图片描述
设置完成后,初步预览样式如下图所示。注:数据为展示效果模拟的测试数据。
在这里插入图片描述

第三步、调整样式

1)图上三个指标只有一个Y轴,页面显示的效果不明显,起始的坐标是负数开头的,要以0开头。
操作:在Y轴的值定义,勾选自定义最小值为0,同时设置轴线的样式。
在这里插入图片描述
展示效果如下图所示。
在这里插入图片描述
三个指标数据差别较大,页面显示的不美观,再加一条Y轴看看效果。
在这里插入图片描述
同时在 系列页签中设置堆积与坐标轴关系,Y轴2对应2,效果如下图所示。
在这里插入图片描述
页面渲染如下图所示。
在这里插入图片描述
2)最下面的指标(独立访问用户数)还是挺低,再加一条Y坐标轴,同时给各自加上单位。
操作:在Y轴的值定义,勾选自定义最小值为0,同时设置轴线的样式。
在这里插入图片描述
同时在 系列页签 中设置堆积与坐标轴关系,Y轴3对应3,效果如下图所示。
在这里插入图片描述
Y轴添加单位,选择 数字,手动输入 万
在这里插入图片描述
展示效果如下图所示。
在这里插入图片描述

参考文档

【1】https://help.fanruan.com/finereport/doc-view-1681.html

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐