js统计图表FineReport中图表排序的具体实现
FineReport中图表排序主要分为单系列(分类)图表排序和多系列分类图表排序两种,图表排序的实现和数据类排序的原理类似,以图表所代表的的数据大小为根本依据,在此基础上延展开来一系列的排序标准。以下主要是实现这两类图表特效的制作方法:
单系列(分类)图表排序
单系列(分类)图表排序适用于使用图表时,图表能够根据数据的大小进行显示。单系列(分类)图表排序则制作以柱形图为例,希望所有柱子能够根据数据的大小从高到低或者从低到高进行排序,如下图所示,此时要如何实现呢?
单系列图表排序效果实现思路
图表的默认是根据系列进行排序显示的。
若图表数据源是来自单个数据集,那么可以直接使用数据集中的排序进行排序,然后设置图表数据源为数据集数据;若图表数据源是通过单元格计算出来的,则可以使用扩展后排序进行排序,然后设置图表数据源为单元格数据即可。
单系列图表排序详细步骤
下面我们以一个简单的示例分别介绍下如何实现上图效果。
1、图表数据源为数据集数据
打开模板:%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Advanced\Chart\Logchart.cpt
修改数据集
将原来的数据集修改为按照成本价进行降序排序,则SQL语句为:SELECT * FROM [产品] where 类别ID= 1 order by 成本价 desc
效果查看
点击分页预览,可以看到柱子从高到低进行降序排序了,如上效果图。
2、 图表数据源为单元格数据
打开模板
打开模板:%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Advanced\Chart\Logchart.cpt。
修改模板
按照下图将对应的数据列拖入到单元格中
排序设置
右击A2单元格,选择扩展属性,在单元格属性面板中设置扩展后排序为降序,并在公式中输入B2。
数据集设置
按照下图设置数据集:
隐藏单元格
将单元格中的数据隐藏起来,选中第一行和第二行,右击,选择隐藏行即可。
效果查看
点击分页预览,可以看到柱子从高到低进行降序排序了。其他的图表类型,如条形图和饼图,做类似设置可达到同样的图表排序。
多系列分类图表排序
如下图,数据库中有一张表,每个分类下面的系列均已经按照特定的顺序(系列汇总,即各个系列的流量总和降序排列)排列好,并且有些分类下的数据缺省。
用上述表中数据制作一个数据集数据源柱形图,如下图,会看到图例的排序与数据库中数据不一致,数据库中每个分类下的系列排序是一样的(缺省系列不参与排序),而图表中图例顺序却是按照从数据库中读取系列(port)字段的顺序排序的,如果第一个分类下的系列名称不缺省,那么图表图例顺序会显示正常(直接从第一个读到最后一个,显示完全),如果第一个分类下面的系列数据有缺省,所以图例排序会先显示该分类下有的系列,缺省的系列会显示在后面,就会打乱原来的顺序:
那么该如何实现,在系列缺省的状况下还保持图表图例顺序与数据库中顺序一致呢?
多系列分类图表排序实现思路
使用单元格作为图表的数据源,在单元格中将数据重新排序,即形成一个交叉报表,横向和纵向表头分别是分类和系列,缺省的地方会自动显示为空,然后将系列重新排序即可。
实现示例
1 、单元格数据
如下图,将数据列拖曳至单元格中,形成交叉报表,并计算每个系列下的汇总流量值。要手动设置C15,也就是sum函数所在单元格的左父格,设为A15。
2、 单元格重新排序
选中图表系列所在单元格,也就是A15,在单元格属性表-扩展属性>扩展后中,选择降序排序,公式为=C15,如下图:
点击分页预览,会发现交叉表中系列名称又重新弄排好序了,如下图:
3、图表数据源
单元格数据制作好了,下面将单元格数据与图表进行绑定,也就是重新添加图表数据源,选中图表,在图表属性表-数据一栏中,数据来源选择单元格数据源。
点击分页预览,即可看到多系列分类图表排序效果。