历史版本12 :图表设置闪烁动画 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 应用场景

有时用户希望某些特殊标记点可以突出显示,例如显示某个系列的最大最小值,通过设置不同颜色以及闪烁动画,使人一眼看出其中的不同。

预期效果如下图所示:

6B194A2C-627A-4ED2-8B0E-78AAB9BC60CE.GIF

1.2 实现思路

在图表「特效>条件显示」中设置条件属性,通过「配色」、「闪烁动画」两个属性实现。

Snag_e68c2d0.png

2. 示例编辑

2.1 准备数据

本例直接使用 折线图 文档中已完成的模板,打开内置模板 %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Chart\LineChart\折线图.cpt  。

Snag_e6c029a.png

2.2 设置条件属性

2.2.1 设置最大值

1)选中图表,点击「单元格元素>特效>条件显示」,添加条件属性,双击名称重命名为「最大值」,点击 Snag_e755c95.png 编辑按钮弹出编辑界面。

2)添加「配色」属性,选择绿色。

3)添加「闪烁动画」 属性,默认运动周期为 2.56 秒。

注:设置运动周期为 0 秒时,无动画效果,不同类型图表的默认运动周期时间不一致 。

4)设置普通条件为:值 等于 公式 =MAX(本年空调月销量统计.select(销量)),设置完成后点击「增加」。

注:公式中 MAX 用于筛选最大值,tablename.select 用于获取「本年空调月销量统计」数据集中的「销量」字段,详情可参见文档 数据集函数 。

如下图所示:

Snag_edb5cf3.png

2.2.2 设置最小值

设置最小值条件属性时,可以直接复制最大值条件属性,再进行修改。

1)选中「最大值」条件属性,点击复制按钮,复制的条件属性名称为「CopyOf最大值」。如下图所示:

Snag_eeb2839.png

2)双击「CopyOf最大值」重命名为「最小值」,点击编辑按钮弹出编辑界面。

3)将「配色」修改为红色。

4)将条件中的公式修改为 =MIN(本年空调月销量统计.select(销量)) ,用 MIN() 筛选最小值。最后必须点击「修改」才能使条件成功修改。

如下图所示:

Snag_ef3bf03.png

2.3 效果预览

2.3.1 PC 端

保存模板,点击「分页预览」,效果如 1.1 节中预期效果所示。

2.3.2 移动端

App 端和 HTML5 端均支持,效果如下图所示:

00E8320F-D00E-45D6-A358-EBEAA0CB2129.GIF

3. 模板下载编辑

已完成模板可参考:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Chart\LineChart\最值闪烁折线图.cpt

点击下载模板:最值闪烁折线图.cpt