Dashboard

阅读（10）点赞（0）标签: html渲染dashboard, 报表组, dashboard,

本章节主要介绍HTML渲染Dashboard布局的报表组的原理、用途、编写方式及属性说明。

原理和用途：

在报表组中添加报表项，对各报表项进行Dashboard布局后在网页上展现。声明式渲染Dashboard采用HTML标签属性驱动模式，在div元素上声明data-report-type="dashboard"并配置相关属性。开发人员无需手动调用润乾报表API，由报表框架自动完成报表组的解析与运算，根据配置将渲染生成的Dashboard HTML输出至客户端浏览器，实现Dashboard布局后的报表组展示。

声明式渲染写法：

在页面中编写如下div元素，即可发布Dashboard报表组（注：声明Dashboard的div容器要显式指定width与height）：

<div id="reportContainer" style="width:100%; height:100vh;"

data-report-type="dashboard"

data-report-groupFileName="Dashboard布局.rpg"

data-report-width="100%"

data-report-height="100%" >

</div>

属性说明：

Dashboard布局后的报表组渲染可用属性见下表：

(属性名大小写敏感，属性值必须放置在双引号内)

属性名	是否必填	属性含义	属性取值	缺省值
浏览式Dashboard布局后的报表组的公共属性
data-report-groupFileName	否	要发布的报表组文件名	报表组文件名	无
data-report-srcType	否	报表组源的类型	见注1	file
data-report-beanName	否	当报表组源类型为bean时，已保存到request中的bean的名称	符合变量命名规则的字符串，与保存报表组源bean时的名称一致，且在整个web应用中应唯一	无
data-report-useCache	否	显示此报表组时是否从缓存系统中取已经计算好的报表	yes或no 如果含有实时报表，应该设为no	yes
data-report-contextName	否	用bean的方式发布报表时，计算出报表bean时用的Context对象，存在session中的名称	存储在session中的名称	无
data-report-timeout	否	从缓存系统中取多少分钟内产生的报表，如果没有此时间内的，则产生一个新报表	整数，表示分钟负数表示不限时间	-1
data-report-params	否	报表组所需要的参数	用户提交的报表组参数值	无
data-report-exceptionPage	否	显示Dashboard报表异常信息的html页面	可以是绝对路径或相对路径名，相对于当前使用的html页面所在路径。如：/demo/error.html或myError.html	无
data-report-needImportEasyui	否	是否需要引入easyui的js和css文件	yes或no	no
data-report-theme	否	编辑控件的外观主题风格	default,black,bootstrap,gray,metro	default
data-report-width	否	dashboard控件的宽	像素或百分比	null
data-report-height	否	dashboard控件的高	像素或百分比	null
data-report-needTitle	否	各面板上是否显示标题栏	yes或no	yes
data-report-needBorder	否	各面板是否显示边框	yes或no	yes
data-report-paramCheck	否	是否对禁用参数值做校验。禁用参数值可通过在WEB-INF\raqsoftConfig.xml中的disallowedParamWordList 属性中配置	yes 或 no	yes
data-report-scrollSheets	否	需要固定表头的报表，用英文逗号分隔，可以是报表标题名或逻辑名。固定表头的报表忽略自适应设置。	报表标题名或逻辑名	null
data-report-pagedSheets	否	指定子报表分页展示。	子报表，比如：item1或者item1, item2	无

注1：

data-report-srcType取值说明：

（1）待发布报表组源为报表文件时，取值为file。

（2）待发布报表组源为经过API处理的报表组设计对象时，取值为bean。

注2：

用于渲染 Dashboard 的外层div容器，需要显式设置容器宽度与高度；若容器未定义宽高，将造成报表渲染异常。data-report-width和data-report-height属性不可赋值为null，否则同样会出现展示异常。

在Dashboard外层div容器已设置宽高的基础上：

（1）如果仅设置data-report-width、data-report-height二者之一，则未设置属性的取值默认按100%处理；

（2）如果同时设置data-report-width和data-report-height，Dashboard会按照这两个属性给定的尺寸，让报表内容自适应该尺寸做等比例缩放展示。

注3：

data-report-paramCheck是否对禁用参数值执行校验。默认值为yes，框架会使用内置检测器进行校验；若不需要对禁用参数值校验，可在Dashboard布局的div属性中配置data-report-paramCheck = "no" 。