最新历史版本 :图表自定义标记点样式 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 应用场景

图表可自定义标记点的点样式,上传图片替代原先的圆点效果,如下图折线图示例,将标记点的最大值和最小值替换为图片。

1592456878258309.gif

1.2 实现思路

新建普通报表,插入对应图表,制定内置数据集temperature,并将数据绑定图表,图表点击特效设置->条件显示,添加条件属性,并配置对应条件的自定义点样式

2. 示例编辑

2.1 设计模板

新建普通报表,选择一片区域单元格,合并单元格为A1,插入折线图,如下图所示:

1592457282287340.png

注1:根据系列设置常规标记点具体方法请看下面帮助链接,不再赘述,这里详细讲解根据值设置自定义标记点的方法。

注2:根据系列设置常规标记点参见文档:百分比堆积面积图

2.2 准备数据

新建普通报表,添加内置数据集 temperature,如下图所示:
222

2.3 设置最大最小值

在 J1 和 J2 单元格分别输入公式max(temperature.select(XiaMen))min(temperature.select(KunMing)),分别代表系列 1 的最大值和系列 2 的最小值,并将 J 列隐藏。

2.4 设置图表数据

选中图表,在右侧选择数据,选择对应数据源,绑定对应数据,如下图所示:
image.png

2.5 设置图表样式

1)选中图表,在右侧选择样式>系列,配色选择自定义>精确设置,自定义组合色,标记点使用常规圆点,如下图所示:

image.png
2)在右侧选择样式>坐标轴>Y 轴,勾选自定义最大值,设为 30,如下图所示:

image.png

2.6 设置图表特效

1)选中图表,在右侧选择特效>条件显示,点击添加条件,添加条件属性,如下图所示,给 J1 和 J2 的值添加添加自定义标记点:

image.png

2)条件属性1,设置点样式>自定义>雨天图,设置条件为值=J2,即kunming的最小值,如下图所示:

image.png

3)条件属性2,设置点样式>自定义>晴天图,设置条件为值=J1,即xiamen的最大值,如下图所示:

image.png

2.7 效果预览

1)PC 端

保存报表,点击分页预览,模板效果如下所示:

1592456878258309.gif

2)移动端

1592457091933050.gif

3. 模板下载编辑

已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Chart\LineChart\标记点自定义折线图.cpt

点击下载模板:标记点自定义折线图.cpt