页面树结构

版本比较

标识

  • 该行被添加。
  • 该行被删除。
  • 格式已经改变。

概要说明 

油量图是指以油量表的形式展现指标数据。有一个圆形的表盘及相应的刻度,刻度表示数值的范围,有一个指针指向当前数值可直观的表现出某个指标的进度或实际情况。

下图的油量图中,指针所指向的数据代表了产品总体销售情况 

优势 

1)很直观展示某个指标的进度或实际情况。 

2)跟人们的常识结合,使大家马上能理解看什么、怎么看。拟物化的方式使图标变得更友好更人性化,正确使用可以提升用户体验。 

3)仪表盘的圆形结构,可以更有效的利用空间。 

劣势数据场景比较单一。 

数据要求只允许构建一个度量。 

适用场景 

1) 油量图一般用来显示项目的完成进度 

2) 油量图用于关注及监控数据是否在正常范围,通过定义临界点确定预警范围。 

不适用场景:油量图不适合用于比较不同变量或者趋势的分析。 

 

面板
borderColor#FFFFFF
bgColor#F0F0F0
borderWidth1
borderStylesolid

目录

业务情景

实现方案

油量图只支持一种业务情景:只允许对单个业务数据指标考量。

数据考核需求分析效果
情景:公司年底对各个区的销售额指标进行考核,评判是否属于业务优秀的范畴。 

该需求的数据考核分析,有如下要点。

1、通过参数进行“区域”控制

2、只显示销售额的数据标签

 

Image Removed

数据结构

业务情景描述:公司年底对各个区的销售额指标进行考核,评判是否属于业务优秀的范畴。

数据结构 

以上业务情景的数据来源如下

Image RemovedImage Added

以上表结构只显示了油量图业务场景需要的指标数据。

定制要点

实现要点

1、双击或者拖拽“销售额”字段到 标记>标签 

2、拖拽“销售区域”字段到“筛选区”即生成“销售区域

”筛选器,该筛选器需要设置:展示类型为“列表(单选)”详情请参见筛选器展示样式,默认值为“列表选择”中的“华北”,详情请参见 筛选器设置说明

Image Removed

 

”筛选器,该筛选器需要设置:展示类型为“列表(单选)”,详情请参见 筛选器-展示样式 ,默认值为“列表选择”中的“华北”,详情请参见 筛选器-设置说明 。

Image Added

特殊应用

指标卡

油量图可以通过样式设计,实现下图的指标卡效果:

Image RemovedImage Added

实现要点:Image RemovedImage RemovedImage RemovedImage RemovedImage RemovedImage RemovedImage Removed

 步骤 效果

1、选中“油量图”,点击图形右上方的 更多 > 组件样式 ,打开“组件样式”设置窗口。

Image Added

2、隐藏指针。点击 系列 > 指针 ,设置指针的宽度为0。

Image Added
3、隐藏表盘刻度线和主分割线。点击 系列 > 表盘刻度线 ,设置刻度数为0,刻度长度为0,点击 系列 > 表盘主分割线 ,设置刻度数为0Image Added

4、在 系列 > 表盘颜色 中,点击 删除 按钮删除表盘颜色,使表盘只剩一种颜色。

注:表盘的最后一种颜色也是度量值的显示颜色。

Image Added
5、隐藏表盘。设置表盘颜色的结束值为0,度量值的显示颜色通过 颜色 设置。在这里,我们设置度量值的显示颜色为蓝色。Image Added
6、设置标题“销售额”的显示样式和位置。点击 系列 > 标题,我们设置标题的字体大小为36,偏移位置为水平0,垂直-20。Image Added

7、设置度量值的显示样式和位置。点击 标记 > 标签,打开“标签设置”窗口,在这里,我们设置度量值的位置和字体大小如右图。

注:“标签设置”也可以设置度量值颜色,这时,度量值颜色不再受表盘颜色的影响。

Image Added