js统计图表FineReport多维度坐标轴图

js统计图表FineReport多维度坐标轴图

1. 描述

多维度坐标轴图是指在图表中展示多个维度,不仅仅局限于2个维度(展示2个维度只能比较一个维度之间的数据),可以在同一张图表中同时比较2个或2个以上的维度的数据,如下图,可比较华东地区各个产品类型的销量情况,也可以比较饮料产品类型在华东华北的销量情况:

js统计图表FineReport多维度坐标轴图

2. 示例

以FRDemo数据库中的销量表为例,实现上图的效果。

2.1 数据准备

新建一个数据集ds1:SELECT * FROM [销量]

2.2 新建图表

合并一片单元格区域,在该区域中添加图表,图表类型选择柱形图,如下图:

js统计图表FineReport多维度坐标轴图

2.3 图表数据

点击图表属性表-数据,数据来源选择数据集数据,数据集选择ds1,分类轴选择产品类型,系列名选择产品,系列值为销量,如下图:

js统计图表FineReport多维度坐标轴图

2.4 维度添加

效果图中显示了多个分类维度,点击分类轴后面的按钮,添加一个分类轴地区,如下图:

js统计图表FineReport多维度坐标轴图

注:分类轴个数最多只能添加到3个,只限于柱形图和折线图,其他类型图表只能单分类轴,并且多分类轴数据只能支持“规整”的数据,以上图为例,每个地区下的产品类型必须保持完全一致,即华东地区下面有A、B、C三个产品类型,那么华北地区下面也只能有这三种产品类型,不能多也不能少。

2.5 图表样式

多维度坐标轴图设置分类轴样式时,只作用于最上层分类维度,其他分类维度采用默认样式(微软雅黑,9号字体),不可更改,如下图,我们修改分类轴名称的颜色,点击图表属性表-样式>坐标轴>分类轴,修改分类轴的显示样式:

js统计图表FineReport多维度坐标轴图

注:同分类轴设置一样,交互属性-超级链接和条件属性中传递的参数也是作用于最上层分类维度。

2.6 效果查看

将鼠标放置在某一个柱子上会显示所有坐标轴的信息,不同分类维度之间的信息用空格隔开,如上效果。模板效果在线查看请点击DemensionalChart.cpt

已完成模板请参照%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Advanced\Chart\DemensionalChart.cpt

3. 总结

多维坐标轴图是通过添加多个分类轴来达到多个维度统计的效果,只有柱形图和折线图才能实现多维度效果,并且多维度坐标轴图不支持数据表和坐标轴缩放,分类轴最多只能添加3个,多维度分类轴数据只能是“规整”的数据。

分类:工作日志 时间:2015-05-12 人气:725
分享到:

相关文章

iOS 开发

Android 开发

Python 开发

JAVA 开发

开发语言

PHP 开发

Ruby 开发

搜索

前端开发

数据库

开发工具

开放平台

Javascript 开发

.NET 开发

云计算

服务器

Copyright (C) codeweblog.com, All Rights Reserved.

CodeWeblog.com 版权所有 闽ICP备15018612号

processed in 0.036 (s). 12 q(s)