附录:实时统计图
自定义统计图,也可称为实时统计图,即可以实时地显示变化中的数据的统计图。
例如下图中的几个统计图的图形会随数据库中数据的变化实时动态刷新。
需要注意:
1. 实时统计图的“实时”,是相对于手动刷新而言的。实际上是定时的刷新,刷新时间间隔可以自行设定。
2. 实时统计图在刷新时,关键在于不是重算整张报表,重新更新整个页面,而是只刷新局部数据(即上面例子中红框中的部分)。在产品中,是应用Ajax技术来实时更新局部数据。
实时统计图实现方式
实现实时统计图,不需要用户自行进行JS开发,仅添加现有的自定义统计图类型到报表单元格中即可。
具体的方式:
1. 进入统计图向导,并选择需要的自定义统计图类型:
2,进入“选风格”tab页,设置实时统计图的属性和数据
属性配置:属性中主要配置实时统计图的一些基本属性,例如:初始分类、系列名称和系列值,图形区域的大小、缩放,标题等,以示例中的柱图为例,其配置可参见下图:
数据配置:配置实时统计图取数和刷新的相关数据属性realTimeDataSource,该属性值的格式为json串。本示例中的json内容具体为:
{type : "RANDOM",interval :3000,settings : { series : [ {min : 0,max : 100, precision : 0 },{ min : 10, max : 50, precision : 2 }]}}
* 本示例中实时统计图采取随机数的取数方式,关于取数方式的介绍和json中各个属性的详细介绍请参见本文的“定义自定义统计图的刷新数据”章节。
3.切换到“选取数”tab页,不需要做什么,直接“确定”就可以完成统计图的添加。
预览报表就可以看到效果:
定义自定义统计图刷新数据
自定义统计图的设计界面中,可配置统计图的数据刷新的相关属性:realTimeDataSource,该属性为json格式。在前一章节介绍过实时统计图的取数方式有两种:随机数模式和数据库模式,在本章节中会对这两种模式的区别和作用做详细的介绍。
随机数模式取数刷新数据:
随机数模式是指实时统计图以随机数据作为数据来源,实现刷新数据时统计图的数据按照配置的随机数属性发生变化,随机数模式的realTimeDataSource属性配置可参考:
{type : "RANDOM",interval :3000,settings : { series : [ {min : 0,max : 100, precision : 0 },{ min : 10, max : 50, precision : 2 }]}}
此时json中各个属性的具体作用说明如下:
realTimeDataSource : {
type : RANDOM, //值为RANDOM或DATABASE。RANDOM表示实时数据采用随机数;DATABASE表示基于数据库取数。
interval : 0, //0表示不自动周期性取数;非0表示自动周期性取数间隔
settings : //随机取数设置
{
series : [ //各系列随机数的生成参数(取值范围和经度),对于多系列统计图,每个系列的取值范围和小数位数可以不同
{
min : 0, //第一个系列随机数最小值
max : 100, //第一个系列随机数最大值
precision : 0 //第一个系列随机数小数位数
},
{
min : 10, //第二个系列随机数最小值
max : 50, //第二个系列随机数最大值
precision : 2 //第二个系列随机数小数位数
}
]
}
}
数据库模式刷新数据:
数据库模式刷新数据是指实时统计图的数据来源为数据库,实时统计图能按照配置的刷新周期定期刷新并展现出数据库中数据发生的变化,做到实时监听数据库中数据变化的效果。此模式时realTimeDataSource 属性仍然为json格式,此时各个json属性的配置方式可参考如下示例:
realTimeDataSource : {
type : "DATABASE",值为DATABASE表示基于数据库取数
interval : 2000, 0表示不自动周期性取数;非0表示自动周期性取数间隔
settings : {SQL:"select * from DEMO_SALESDAY",// //随机取数设置,后面会针对settings的配置单独介绍
details:{
"A5":{"row":3,"type":"sql","col":3},"B2":{"row":-1,"type":"sql","col":-1,"sql":"select * from DEMO_SALESDAY where 订单ID in (100212,100299,100208,100334,100329,100361,100228,100315)"},"E12":{"row":-1,"type":"sql","fields":["订单ID","订购日期"],"col":-1},"C9":{"row":-1,"type":"sql","fields":["销售金额"],"col":-1}
}
settings格式和配置的详细说明如下:
参数:settings
参数设置:
settings.SQL - 默认SQL,例如,select * from DEMO_SALESDAY
settings.details - 取数块信息描述,需用base64转码
settings.details的格式:
{
单元格1:{"row":取数行数(缺少为-1,表示不限制), "col":取数列数(缺少为-1,表示不限制), "type":取数类型, "sql":取数SQL(缺省为settings.SQL), "fields":[取数字段1,取数字段2,...](缺省为所有字段)},
单元格2:{"row":取数行数(缺少为-1,表示不限制), "col":取数列数(缺少为-1,表示不限制), "type":取数类型, "sql":取数SQL(缺省为settings.SQL), "fields":[取数字段1,取数字段2,...](缺省为所有字段)},
...
}
其他说明
js调用入口:实时刷新统计图提供了统计图刷新的js调用入口,用户可通过自定义按钮来调用实时统计图的刷新功能。具体的js方法为:统计图的DIVID.refresh();以本文中的自定义柱图配置为例,示例中配置的divid为"graph33",则用户可通过graph33.refresh()的方法调用实时统计图的刷新功能。可参见如下实例:
点击刷新按钮即可看到数据发生变化:
请注意:实时统计图的功能在V5.0.1.410以后的版本中可以使用。更早版本需使用需升级报表设计模块和展现模块。