历史版本18 :图表切换属性 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

为了实现在同一页面在线切换展示不同图表,可以选择点击按钮(button)来切换查看不同的图表。

2. 示例编辑

2.1 添加图表

2.1.1 添加地图

新建内置数据集,如下图:
image.png

以单元格图表为例,合并一片单元格,点击插入>单元格元素>插入图表,选择地图,如下图:
222

选中图表,在右侧选择类型,修改类型设置如下图:
image.png

选中图表,在右侧选择数据,设置数据如下图:

image.png

2.2.2 设置条形图

在右侧选择类型,点击新增一个图表 2 标签

image.png

选中图表,在右侧选择类型,修改类型设置如下图:
image.png

选中图表,在右侧选择数据,设置数据如下图:

image.png

选中图表,在右侧选择特效,柱形图分类图改用男女头像,分类1和2设置,条件属性1设置如下图:

image.png

条件属性2设置,如下图:

image.png

注:分类序号值应该选择整型

2.2.3 添加饼图

添加图表后,选中图表,在右侧选择类型,修改类型设置如下图:
image.png

选中图表,在右侧选择数据,设置数据如下图:

image.png

选中图表,在右侧选择样式-系列,设置内径,实现环形饼图,如下图:

image.png

2.2.4 添加柱形图

添加图表后,选中图表,在右侧选择类型,修改类型设置如下图:
image.png

选中图表,在右侧选择数据,设置数据如下图:

image.png

选中图表,在右侧选择样式-系列,实现带圆角柱形图,如下图:

image.png

2.2.5 添加气泡图

添加图表后,选中图表,在右侧选择类型,修改类型设置如下图:
image.png

选中图表,在右侧选择数据,设置数据如下图:

image.png

选中图表,在右侧选择样式-系列,实现修改气泡大小,如下图:

image.png

2.2.6 图表切换属性

在右侧选择类型,点击设置按钮,选择切换方式为按钮,同时设置按钮控件的样式和背景,如下图所示:

image.png

注:图表切换只针对设置的图表 index 生效。如只设置了第二个图表自动刷新,则只有第二个图表执行刷新操作。

另:切换按钮上的文字即图表标题,若不想显示,则可将图表标题删除,再设置不显示标题即可。

2.2 效果查看

PC 效果图如下:

222

注:如果图表名称缩略显示了,则鼠标移动到对应的控件位置时,在控件下方居中显示图表名称的数据点提示。

3. 模板下载编辑

已完成模板可参考%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Advanced\Chart\GraphSwitching\按钮式图表切换.cpt

点击下载模板:按钮式图表切换.cpt

4. 注意事项编辑

注:所有添加图表只对关键步骤,进行介绍,普通样式需要根据自己需求进行设置

注:其中条形图特效中的图片可以根据自己需求自定义设置,使用谷歌,百度等搜索适合自己需求的图片