图表自定义标记点样式

1.1 应用场景

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

1.2 实现思路

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

1.3 应用实例

复用组件下载后可直接在设计器内安装复用，即可实现图表自定义标记点样式效果，无需进行代码编辑；

更多图表自定义标记点样式组件的示例，可参见 帆软市场-组件 / 设计器→在线组件库，组件复用相关文档请参见：组件复用 。

组件下载链接	描述	效果图
标记点条件显示-深色	1）该组件适用于深色酷炫风格模板 2）面积图中标记最大最小值显示出总趋势的变化，适用于表现趋势和关系

2.1 设计模板

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

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

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

2.2 准备数据

新建普通报表，添加内置数据集 temperature，如下图所示：

2.3 设置最大最小值

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

2.4 设置图表数据

选中图表，在右侧选择数据，选择对应数据源，绑定对应数据，如下图所示：

2.5 设置图表样式

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

2）在右侧选择样式>坐标轴>Y 轴，勾选自定义最大值，设为 30，如下图所示：

2.6 设置图表特效

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

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

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

2.7 效果预览

1）PC 端

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

2）移动端

2.8 应用拓展

复用组件下载后可直接在设计器内安装复用，即可实现图表自定义标记点样式效果，无需进行代码编辑；

更多图表自定义标记点样式组件的示例，可参见 帆软市场-组件 / 设计器→在线组件库，组件复用相关文档请参见：组件复用 。

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

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