# 仪表板组件-饼图

饼图是以扇形区域大小表示每一个数值相对于总数值的占比。比如展示不同价格档次的销售数量占比:

饼图

示例地址:饼图 (opens new window)

# 使用饼图组件

饼图的指标上至少取1个度量,如销售数量;取一个维度到颜色进行分组,如价格档次等。饼图中要绘制的数值大小不能含有负值。

操作步骤

饼图

  1. 双击或拖入度量【销售数量】到指标
  2. 双击或拖入维度【价格档次】到颜色

通过上述2个步骤,即可展示不同价格档次的服装销量占比。

# 属性介绍

# 布局

样式>系列>布局>处,可对饼图的内外半径、起始角度、增长方向进行设置。

设置起始角度及增长方向

  • 内半径:设置饼图当前系列的内半径,默认为0%,最大值为99%
  • 外半径:设置饼图当前系列的外半径,默认为0%,最大值为100%
  • 起始角度:设置饼图的起始角度,默认为90度
  • 顺时针增长:设置饼图中扇形数据是否顺时针增长,默认勾选
  • 通过半径展示数据大小:设置饼图是否通过半径展示数据大小。默认不勾选,勾选后出现属性通过圆心角展示数据百分比,该属性可设置饼图当前系列是否通过圆心角展示数据百分比。这两个属性可实现玫瑰图的效果

# 更多效果

可以通过自定义饼图的取数和样式来实现不同效果的饼图。

玫瑰图 断开环形饼图 多系列饼图 圆角饼图

玫瑰图

断开环形饼图

多系列饼图

圆角饼图

# 玫瑰图

玫瑰图通过半径大小和圆心角的占比来展示数据的大小和占比。

玫瑰图

实现方式

玫瑰图有2种形式:

  1. 样式>系列>布局,勾选通过半径展示数据大小
  2. 样式>系列>布局,勾选通过圆角展示数据百分比

TIP

  • 通过半径展示数据大小:各个区域的圆心角角度一致,半径长度不一致
  • 通过圆角展示数据百分比:各个区域的圆心角不一致,只有先勾选通过半径展示数据大小才可实现通过圆角展示数据百分比

玫瑰图实现

# 断开环形饼图

断开环形饼图可以通过设置边框线的颜色与背景色一致,来实现断开环形饼图的效果。

断开环形饼图

实现方式

  1. 样式>系列>布局,设置内半径和外半径属性达到控制圆环的宽度,实现环形效果
  2. 样式>系列>边框,选择边框线,颜色设置为白色,对边框线的粗细进行调节,可调节断开区域的大小

通过以上2个步骤,即可实现按价格档次维度展示销售数量的占比。

断开环形饼图实现方式

# 多系列饼图

多系列饼图通过控制多个系列的外半径以及填充颜色的不同,来实现对应的效果。

多系列饼图

实现方式

  1. 数据>指标处引入两个度量,在数据>标记区,拖入维度设置多系列的颜色填充,并在标签处拖入所需要的标签字段
  2. 样式>系列>布局>外半径,设置内部系列的外半径小于外部系列的外半径,以便区别不同系列。当外部系列的内半径大于内部系列的外半径时为同心环效果
内层系列设置 内层系列设置 内层系列设置(同心环)

内层

外层

同心环

TIP

添加多个指标时,数据>指标处下方指标的效果会叠加在上方指标效果上,因此建议将上方的字段当做外部系列,下方的字段当做内部系列,以防止遮挡。

# 圆角饼图

可以通过设置饼图的圆角属性,来实现圆角饼图的效果。

圆角饼图

实现方式

  1. 样式>系列>边框,选择边框线,颜色设置为白色,对边框线的粗细进行调节,可调节断开区域的大小
  2. 样式>系列>圆角,设置圆角数值,可调节圆角大小

通过以上2个步骤,即可实现圆角饼图的效果。

实现方式

是否有帮助?
0条评论
评论