目标占比饼图是饼图的一种,与基本饼图相比,目标占比饼图能够同时展示预期目标和当前进度的真实值,以及当前进度占预期目标的百分比值,适用于展示当前任务的完成情况,不支持数据系列的配置。本文档为您介绍目标占比饼图各配置项的含义,帮助您快速准确地使用目标占比饼图组件。

样式

  • 基础属性
    • 图表尺寸:组件的宽度和高度,单位为px。
    • 图表位置:组件在大屏中的位置,通过横纵坐标来定义,单位为px。
    • 其他:组件的旋转角度和透明度。
  • 文本:饼图中上下标签文本的样式。

    • 字体:组件中所有文本的字体系列,默认为微软雅黑
    • 字体颜色:饼图上方和下方标签文本的颜色。
    • 目标文案:饼图下方标签的显示文字。
    • 当前进度文案:饼图上方标签的显示文字。
    • 字号:饼图上方和下方标签文本的大小,取值范围为12到100。
    • 字体粗细:饼图上方和下方标签文本的粗细。
  • 图表

    • 进度环颜色:进度环的颜色,支持颜色填充和渐变填充,可参考颜色选择器说明进行修改。
    • 目标环颜色:目标环(进度环下面的底环)的颜色。
    • 越界环颜色:越界环的颜色,当进度大于目标时,会显示成一圈越界环。



    • 内环颜色:内环的颜色。
    • 环内斜线颜色:环内斜线的颜色。
    • 环内指标颜色:环内指标文本的颜色。
    • 字号:环内指标文本的大小,取值范围为12到100。
    • 字体粗细:环内指标文本的粗细。
    • 圆圈粗细:内环的粗细,单位为px。

    • 边距

      • 上边距:饼图外环与上方标签的距离,单位为px。
      • 下边距:饼图外环与下方标签的距离,单位为px。
  • 动画:组件的动画效果样式,可单击眼睛图标控制动画效果的开启或关闭。

    • 初始动画时长:组件第一次渲染动画的时长,单位为ms。
    • 缓动效果:动画的缓动效果,系统提供多种常见的动画缓动效果供您选择。
    • 更新动画时长:组件数据更新时的动画时长,单位为ms。
    • 更新时从之前位置开始:勾选后,组件数据更新时,从上一个数据的位置开始播放动画;去勾选,组件数据更新时,从初始位置开始播放动画。

数据



上图中的示例JSON代码如下:
[
  {
    "aims": 10000,
    "actual": 11111
  }
]
  • aims:预期的目标值。
  • actual:当前的进度值。
说明 上图中的进度值大于目标值,此时大屏上会显示一圈越界环。

交互

此组件没有交互事件。