页面树结构

版本比较

标识

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

...

饼图的不同风格效果如图:

漏斗图的不同风格效果如图:

圆心位置

说明

用于设置饼图类型组件的圆心位置,圆心位置默认处于区域中心,即 用于设置饼图类型组件、油量图类型组件的圆心位置,圆心位置默认处于区域中心,即 x 50%,y 50%。

效果设置圆心位置的x值为70%,图形从中心往右偏移20%,如图:

  • 设置饼图的圆心位置:x值为70%,图形从中心往右偏移20%,如图:

Image Modified

  • 设置油量图的圆心位置:x值为35%,图形从中心往左偏移15%,如图:

Image Added

边框

说明

组件支持设置线条、图片、圆角角度设置组件边框,支持设置线条边框、图片边框、圆角角度。

...

使用“刻度样式”设置项对油量图进行设置,效果如下图所示:

...

刻度数据格式

说明

设置表盘刻度的分割线线长、刻度数、样式。

  1. 刻度线长:设置刻度线的长度。
  2. 刻度数:设置表盘划分的区域数量。
  3. 样式:设置刻度线的样式、大小和颜色。

Image Removed

效果

设置分割线的刻度数为5,图中红色线即为分割线,可看到表盘被等分为5份

Image Removed

圆心位置

说明

对组件圆心位置进行调整(默认为 x:50%,y:50%)

Image Removed

效果

...

Image Removed

...

设置油量图表盘刻度的数据格式。

Image Added

效果

Image Added

刻度值

说明

设置油量图表盘刻度的最小值、最大值

Image Added

效果

设置刻度最小值为1000,最大值为当前指标数据的1.5倍。

Image Added

分割线

说明

设置表盘刻度的分割线线长、刻度数、样式。

  • 刻度线长:设置刻度线的长度。
  • 刻度数:设置表盘划分的区域数量。
  • 样式:设置刻度线的样式、大小和颜色。

效果

设置分割线的刻度数为5,图中红色线即为分割线,可看到表盘被等分为5份。

Image Added

进度

说明

对油量图系列组件的进度情况进行样式设置,包括是否显示进度,颜色以及内容。对油量图系列组件(包括环形进度图)的进度情况进行样式设置,包括是否显示进度,颜色以及内容。

Image RemovedImage Added进度内容分为百分比和指标值:

进度内容分为百分比和指标值,进度情况与目标值相关,目标值的说明可参考下方的 目标值 :

  • 百分比:可选择公式进行百分比计算以及设置小数位数

Image Removed

公式包括如下两种:

Image Removed

  • 指标值:当前指标的数据。
  • 百分比:可选择公式进行百分比计算以及设置小数位数,其中公式“(指标值/目标值)*100%”一般适用于正向指标(如收入类),公式“(2-指标值/目标值)*100%”一般适用于反向指标(如成本费用类)。

Image Added

效果

当前进度为5.6%:62%,如图:

...

Image Added

...

...

目标值

...

目标值
目标值

说明

用于设置图形的目标值:用于设置油量图系列组件、水球图和进度图的目标值:

Image RemovedImage Added

配置项功能
默认
  • 与指标的字段值等值
注意

默认时,目标值为1,即目标值跟度量值一样(百分比会显示100%)


自定义

用于自定义图形的目标值,显示各度量的目标值编辑框,点击编辑框展开公式编辑框

目标值的字段选择可选择标记区中的所有度量字段:选择某个度量字段后,将该度量字段插入至下方公式编辑框中。

...

以水球图为例:当前库存量为3119,左图设置目标值为默认,右图设置目标值为5000。

指标值

说明

用于设置水球图的指标值。

Image RemovedImage Added

各配置项如下:

用于设置指标值的计算方式。

配置项

功能

位置

用于设置指标值显示的位置,默认居中显示。

  • 居上:指标值在水球图上方显示。
  • 居中:指标值在水球图内部中央位置显示。
  • 居下:指标值在水球图下方显示。
数值

用于设置指标值的展现形式,默认以百分比的形式展示。

  • 百分比,展示度量字段的实际数值与目标值的比值,其计算方式为【实际值/目标值×100%】;
  • 指标值,展示实际的计算结果或实际值;
小数位数

用于设置指标值显示的小数位数。默认值为2,即保留两位小数,取值区间为[0, 5]。

注意

当数值选择“百分比”时显示该选项.


公式

用于设置指标值的计算方式,其中公式“(指标值/目标值)*100%”一般适用于正向指标(如收入类),公式“(2-指标值/目标值)*100%”一般适用于反向指标(如成本费用类)。

效果

设置指标值的字体为楷体、大小为28、颜色为#4A90E2、位置居下、保留一位小数。实现效果如下:

Image Added

间距

说明

用于一个组件中多个水球图之间的间隔距离,支持输入0-1000之间的数值。

通过在水球图的 指标 区中添加多个度量字段,可实现在一个组件中显示多个水球图的效果,间距效果只有含多个水球图时才能看到效果。

效果

设置指标值的字体为楷体,大小为28,颜色为#4A90E2;位置居下;保留一位小数。实现效果如下:关闭动画效果前后对比如下:

Image RemovedImage Added

动画

说明

用于开启关闭水球图的动画效果

  • 显示。开启动画效果。显示:开启动画效果。
  • 不显示。关闭动画效果,波浪层显示为平静波浪。隐藏:关闭动画效果,波浪层显示为平静波浪。

...

Image Added

效果

关闭动画效果前后对比如下:

水球背景

说明

用于修改水球图内部的背景颜色,默认为透明背景。

...