润乾集算报表生成SVG统计图的示例

SVG作为一种矢量图形,具有任意缩放而不失真、可以被高质量打印、文件较小、交互性强等特性,成为当前一种主流的图片格式。润乾集算报表中已经封装了SVG生成类库,可以生成SVG格式的统计图,方便用户在PC或移动端查看报表统计图。

本文通过一个示例说明集算报表生成SVG统计图的过程。

连接数据源

打开集算报表设计器,菜单栏选择工具-数据源,在弹出的数据源编辑窗口中新建数据源或连接现有数据源,这里使用默认的demo数据源。

wKioL1PPTwjjNsG7AABUmEf7vVQ092.jpg

新建报表

菜单栏选择文件-新建报表,点击生成空白报表,新建一个空白报表。

设置数据集

菜单栏选择报表-数据集,数据集类型选择“SQL检索,在弹出的SQL编辑器窗口中,选择语法页,输入查询SQL语句,也可以通过其他标签页通过可视化界面进行字段选择、检索条件设置等。

wKioL1PPTwiSxpU9AAERyHNcilE627.jpg

编辑报表模板和表达式

在新建的报表模板中设置报表样式以及表达式:

wKiom1PPTe6w-nUdAABMsxkWXQ0304.jpg

根据学生成绩表,按照班级和科目分组,统计各个班级每个科目的平局成绩。预览结果:

wKiom1PPTe-CbnBXAABqiq_LoKI923.jpg

生成SVG统计图

在上述模板中追加行,并设置合并格,右键A5格,选择“统计图,统计图类型选择柱形图,分别设置分类轴和系列,如下图:

wKioL1PPTwrjLo8NAAF3mnINYCY997.jpg

切换到“图形特性选项卡,在图形格式中选择“SVG”格式,如下图:

wKioL1PPTwuhFlfeAAGttig1uvg322.jpg

设置完成后,报表模板及其表达式如下:

wKiom1PPTfHC-q6BAADJf6u4K44633.jpg

设置A3A4A5的左主格为A2,跟随A2扩展,并设置第一行和第二行隐藏,即可显示每个班级的各个科目平均成绩SVG格式统计图。

展现报表

在报表设计器中,选择工具栏中的预览报表wKioL1PPUAzTOaeXAAAGGaaQu70524.jpg,即可在设计器中查看报表展现结果。

wKioL1PPTwyTMDXYAADF7vaN25M912.jpg

此外,集算报表设计器内置了Tomcat,允许用户将报表发布到web端查看页面效果,点击工具栏右上角的IE图标wKioL1PPUB_jg6T1AAAGssSUJwQ269.jpg,设置报表主目录(可采用默认),完成报表发布。

wKiom1PPTfKylnSTAACXIQwxD_Q016.jpg

另外,报表也可以在移动端浏览:

wKiom1PPTfOwj1kLAAEgJtWareQ145.jpg


你可能感兴趣的:(svg,统计图,集算报表)