# 饼图
饼图主要用于表现不同类目的数据在总和中的占比。每个的弧度表示数据数量的比例。
# 属性
# 基础
组件标题： 用于在图层中显示组件的名称。1.1+
组件尺寸： 组件的宽度和高度，单位为
px。组件位置： 组件在大屏中的位置，通过横纵坐标来定义，单位为
px。背景颜色： 组件的背景颜色。
系列颜色： 扇区的颜色。默认情况下图表扇区的颜色为主题的颜色。
基础样式 3.0+
边框： 默认边框不开启，点击选中边框选择器，可设置单个边框得显隐、颜色、宽度和类型。
圆角： 设置边框圆角，可分别设置四个方向得圆角大小。
背景： 背景设置得是组件区域内整体的框选背景样式，不单是组件自身的背景样式。可单独设置颜色，也可设设置渐变色，当渐变比例增加到两个以上时，渐变颜色覆盖背景设置的基础颜色。背景可设置背景图片，来源可为素材库或者图片地址，可设置背景图大小及位置。
区域阴影： 设置组件区域阴影颜色、位置、模糊、尺寸以及显示在区域内部或外部。
# 系列
系列名称： 用于提示框的显示。
南丁格尔玫瑰图模式： 是否展示成南丁格尔图，通过半径区分数据大小。
是： 南丁格尔玫瑰图。
否： 普通饼图。
半径： 扇区圆心角展现数据的百分比，半径展现数据的大小。
面积： 所有扇区圆心角相同，仅通过半径展现数据大小。
选择模式： 是否支持多个选中。
圆心坐标： 饼图的中心(圆心)坐标。可为
px和%。饼图半径： 饼图的半径。
内半径： 内半径设大将显示成圆环形。
外半径： 外圈半径。
起始角度： 开始角度。
最小角度： 最小的扇区角度，用于防止某个值过小导致扇区太小影响交互。
普通状态样式：
文本标签： 指饼图图形上的文本标签，可用于说明图形的一些数据信息，例如值、名称等。
显示： 是否显示文本。
内容格式器： 标签内容格式器，支持字符串模板和回调函数两种形式，字符串模板与回调函数返回的字符串均支持用
\n换行。字符串模板变量
{a}: 系列名。{b}: 数据名。{c}: 数据值。{d}: 百分比。示例：
{b}: {d}
回调函数
可用参数为
data。示例：
return data.name;参数
data是 内容格式器需要的单个数据资源。格式如下：{ // 数据名，类目名 name: string, // 传入的原始数据项 data: Object, // 传入的数据值 value: number|Array, // 百分比 percent: number }位置： 标签的位置。
字体颜色： 文本标签字体颜色。
字体大小： 文本标签字体大小。
字体粗细： 文本标签字体粗细。
字体： 文本标签字体样式。
图形样式
渐变色： 是否添加渐变色。
是：
渐变色方向： 渐变色的方向，可为
正下到正上，左下到右上，右上到左下。渐变色范围： 设置渐变色的颜色范围。
否：
- 颜色： 控制扇区的颜色。
描边颜色： 图形描边颜色。
描边线宽： 图形描边宽度。
描边类型： 图形描边类型。
高亮状态样式： 鼠标放到扇区上时高亮的扇区和样式。其属性配置与普通状态样式相同。
数据映射： 配置数据映射对组件数据进行匹配，可对相应数据进行单独的样式配置。组件初始化时不进行数据映射，通过展开栏上的开启/关闭按钮进行配置。3.0+
状态： 可设置多个状态组，每个状态单独设置样式。
警告：
当多个状态中作用范围有重叠时，例如状态 1 作用范围是 TOP 3，状态 2 作用范围是 2,3,4 时，里面的作用范围有重叠，后面的状态样式覆盖前面状态。
作用范围： 设置当前状态的作用范围，包括
TOP条，奇数条，偶数条，指定条，自定义规则。TOP 条： 数据前几条
奇数条： 数据列表中奇数数据
偶数条： 数据列表中偶数数据
指定条： 在输入框中输入数据下标，下标从 0 开始
自定义规则： 通过 return 方式输出一个函数，函数两个参数
data和index。data 值返回字段是数据中拖拽字段，index 是数据返回下标。
作用范围下面属性是当前状态下作用范围中可设置的样式属性，不同得组件显示的样式属性不完全相同，包括
标签，图形，高亮标签，高亮图形，如图：
初始动画： 对组件动画的配置。
开启动画： 组件是否启用动画。
动画时长(ms)： 动画的时长。
缓动效果： 动画的缓动效果。
# 标题
显示标题： 是否显示标题
内容：
- 标题
- 主： 主标题内容。
- 副： 副标题内容。
- 超链接
- 主： 主标题超链接。
- 副： 副标题超链接。
- 标题
位置
- 水平对齐
- 垂直对齐
外观
内边距
主副间隔
主标题文本样式
字体颜色： 主标题字体颜色。
字体大小： 主标题字体大小。
字体粗细： 主标题字体粗细。
字体： 主标题字体样式。
副标题文本样式
字体颜色： 副标题字体颜色。
字体大小： 副标题字体大小。
字体粗细： 副标题字体粗细。
字体： 副标题字体样式。
# 图例 3.0+
显示图例： 是否显示图例。
选择类型： 图例的类型，包括普通图例，分页图例。
提示：
设置分页图例时，不一定出现翻页控件。翻页图例出现的条件是，当前图例区域不足以容纳所有图例，一种是图例较多时，一种是当前图例区域较小时，区域大小设置在 区域/位置。
选中模式： 图例选择的模式，控制是否可以通过点击图例改变系列的显示状态。
图标： 图例展示的图标类型，包括 圆，矩形，圆矩形，三角形，菱形，取消图标。
图例间距： 图例的间距值。
图例宽度： 图例的宽度。
图例高度： 图例的高度。
内容格式器： 用来格式化图例文本，支持字符串模板和回调函数两种形式。
字符串模板：
{name}回调函数：
return data;
区域/位置
排列方式： 图例列表的布局朝向，包括 水平，垂直。
区域宽度： 图例区域的宽度，水平排列时设置。
区域高度： 图例区域的高度，垂直排列时设置。
水平位置： 可设置对齐、绝对值或百分比。
垂直位置： 可设置对齐、绝对值或百分比。
文字样式
字体颜色： 图例字体颜色。
字体大小： 图例字体大小。
字体粗细： 图例字体粗细。
字体： 图例字体样式。
背景块设置 图例区域的背景样式设置
内边距： 可设置 4 个方向的间距。
背景色： 区域的背景颜色。
边框色： 区域的边框颜色。
边框线宽： 边框线宽度。
圆角半径： 四个方向的圆角半径。
阴影颜色： 阴影颜色。
阴影大小： 阴影范围大小。
X 轴偏移： X 轴方向的偏移。
Y 轴偏移： Y 轴方向的偏移。
全选/反选功能设置 开启时显示全选/反选控件，默认不开启
开启： 是否开启控件。
选择器位置： 设置控件在开始或结束位置。
按钮间距： 两个按钮之间的间距。
据图例： 全选/反选按钮距离图例的间距。
文本标签：
内边距： 控件的内边距。
背景色： 控件的背景色。
边框色： 设置边框颜色。
边框宽度： 设置边框的宽度。
圆角半径： 设置 4 个方向的圆角半径。
阴影颜色： 阴影的颜色。
阴影大小： 阴影范围大小。
X 轴偏移： X 轴方向的偏移。
Y 轴偏移： Y 轴方向的偏移。
高亮文本标签： 属性设置同 文本标签
分页设置 在选择类型是分页图例时可以设置
按钮间距： 设置分页控件按钮间距。
距图例： 控件距图例的距离。
位置： 设置控件所在位置。
按钮颜色： 按钮的颜色。
禁按颜色： 控件禁止点击的颜色。
按钮大小： 按钮控件的大小。
字体颜色： 图例字体颜色。
字体大小： 图例字体大小。
字体粗细： 图例字体粗细。
字体： 图例字体样式。
# 提示框
显示提示框： 是否显示提示框。
提示模板 ：提示框浮层内容格式器，支持字符串模板和回调函数两种形式。
字符串模板
模板变量有
{a},{b}，{c}，{d}，{e}，分别表示系列名，数据名，数据值等。 在触发点为坐标轴的时候，会有多个系列的数据，此时可以通过{a0},{a1},{a2}这种后面加索引的方式表示系列的索引。 不同图表类型下的{a}，{b}，{c}，{d}含义不一样。 其中变量{a},{b},{c},{d}在不同图表类型下代表数据含义为：- 折线（区域）图、柱状（条形）图、K 线图 :
{a}（系列名称），{b}（类目值），{c}（数值）,{d}（无） - 散点图（气泡）图 :
{a}（系列名称），{b}（数据名称），{c}（数值数组）,{d}（无） - 地图 :
{a}（系列名称），{b}（区域名称），{c}（合并数值）,{d}（无） - 饼图、仪表盘、漏斗图:
{a}（系列名称），{b}（数据项名称），{c}（数值）,{d}（百分比）
- 折线（区域）图、柱状（条形）图、K 线图 :
回调函数
return data;
触发点：
坐标轴： 坐标轴触发，主要在柱状图，折线图等会使用类目轴的图表中使用。
数据项： 数据项图形触发，主要在散点图，饼图等无类目轴的图表中使用。
提示外观
背景颜色： 提示框浮层的背景颜色。
边框颜色： 提示框浮层的边框颜色。
边框宽度： 提示框浮层的边框宽。
内边距： 提示框浮层内边距
文本样式
字体颜色： 提示框字体颜色。
字体大小： 提示框字体大小。
字体粗细： 提示框字体粗细。
字体： 提示框字体样式。
# 工具栏
显示工具栏： 是否显示工具栏。
功能按钮
保存为图片按钮
还原按钮
数据视图按钮
位置朝向
排列方式： 功能按钮的布局朝向。
水平位置： 水平排列。
垂直位置： 垂直排列。
图表尺寸
- 图标大小
- 间隔
# 时间轴 3.0+
- 显示： 是否开启时间轴，组件初始化不开启时间轴。数据轴初始开启时没有数据，配置在数据模块，不开启时不显示配置框。
轴的类型： 时间轴数据类型，报告 数值轴，类目轴，时间轴。设置为时间轴时，组件会对值进行时间格式转换。
当前选中项： 设置默认选中时间轴当前值。
自动播放： 设置是否自动播放。
循环播放： 是否循环播放。
方向播放： 是否方向播放。
拖拽更新： 是否可以拖拽改变时间点。
时间间隔： 时间轴变化的时间间隔。
摆放方式： 设置时间轴水平还是垂直方向拜访。
左边距： 可设置自适应、绝对值、百分比。
右边距： 可设置自适应、绝对值、百分比。
上边距： 可设置自适应、绝对值、百分比。
标记图形： 时间轴上时间点显示图形，包括 无，圆，矩形，三角形。
标记大小： 时间点图标大小。
旋转角度： 旋转的角度值。
轴线
显示： 是否显示轴线。
颜色： 轴线颜色值。
宽度： 轴线宽度值。
类型： 轴线类型，包括 实线，虚线，点状线。
文本标签
文本标签： 时间轴的文本标签，可用于说明图形的一些数据信息，例如值、名称等。
显示： 是否显示文本。
显示： 同 普通状态样式 -> 文本标签 -> 内容格式器。
字体颜色： 文本标签字体颜色。
字体大小： 文本标签字体大小。
字体粗细： 文本标签字体粗细。
字体： 文本标签字体样式。
标签位置： 文本标签距离轴线的位置。
旋转角度： 文本标签旋转角度。
对齐方式： 文本标签对齐方式。
高亮标签： 同 文本标签
图形样式： 同组件图形样式
按钮设置
按钮设置： 对时间轴的按钮进行设置，例如播放按钮。
播放按钮： 是否添加播放按钮控件。
前进按钮： 是否添加前进按钮控件。
后退按钮： 是否添加后退按钮控件。
按钮尺寸： 按钮尺寸大小。
按钮间隔： 按钮之间间距。
颜色： 按钮的颜色。
边框颜色： 按钮的边框线颜色。
边框线宽： 按钮边框线宽度。
高亮按钮： 高亮按钮是设置按钮高亮的状态，不能设置按钮是否添加，对已经添加的按钮生效。
颜色： 高亮按钮的颜色。
边框颜色： 高亮按钮的边框线颜色。
边框线宽： 高亮按钮边框线宽度。
当前按钮设置
标记图形： 时间轴上当前时间点显示图形，包括 无，圆，矩形，三角形。
标记大小： 当前时间点图标大小。
旋转角度： 图标旋转的角度值。
颜色： 当前按钮的颜色。
边框颜色： 当前按钮的边框线颜色。
边框线宽： 当前按钮边框线宽度。
开启动画： 组件是否启用动画。
动画时长(ms)： 动画的时长。
缓动效果： 动画的缓动效果。
# 数据
# 静态数据
上图中的示例JSON代码如下：
[
{
"x": "类型一",
"y": 33
},
{
"x": "类型二",
"y": 12
},
{
"x": "类型三",
"y": 27
},
{
"x": "类型四",
"y": 23
},
{
"x": "类型五",
"y": 40
}
]
- x： 维度，各扇形的类目。
- y： 量度，各扇形的值，决定各扇形占整个饼图的百分比。
饼图中需要单维度、单量度的数据，所以横轴、纵轴中只解析拖入的第一个字段，多余字段在图表中不解析。
# 数据资源
警告：
拖动到纵轴的字段为量度---> 数值类型。即在数据资源--->维度/量度列表中格式化为整型或浮点型。
# 交互
# 扇区选中事件
勾选启用，开启扇区选中事件。当单击饼图的扇区时，绑定字段中数据会推送到变量中。关联此变量的组件将携带此变量值，触发数据请求，查询相关数据，更新组件。具体配置请参考组件交互。
# 扇区悬停事件 3.0+
勾选启用，开启扇区悬停事件。当悬停饼图的扇区时，绑定字段中数据会推送到变量中。关联此变量的组件将携带此变量值，触发数据请求，查询相关数据，更新组件。具体配置请参考组件交互。
# 扇区移出事件 3.0+
勾选启用，开启扇区移出事件。当移出饼图的扇区时，绑定字段中数据会推送到变量中。关联此变量的组件将携带此变量值，触发数据请求，查询相关数据，更新组件。具体配置请参考组件交互。
# 数据响应
饼图支持数据响应配置。
# 数据上卷、下钻
饼图支持数据上卷、下钻功能。
# 节点编程
# 事件
扇区选中事件： 扇区单击触发事件。
- 抛出的参数： 扇区所携带的数据。
图表配置转换完成后： 图表 Option 配置转换完成后事件。
- 抛出的参数： 配置完成后的 Option 。
扇区悬停事件： 鼠标悬停到扇区时触发。3.0+
- 抛出的参数： 扇区所携带的数据。
扇区移出事件： 鼠标移出扇区时触发。3.0+
- 抛出的参数： 扇区所携带的数据。
图例切换事件： 图表图例切换时触发。3.0+
- 抛出的参数： 切换的图例名称及选中状态。
时间轴切换事件： 时间轴节点切换时触发。3.0+
- 抛出的参数： 时间轴节点名称。
# 动作
导入图表配置： 可导入 Echarts 图表 Option 配置。
- 接收的参数： 修改后的 Option 。
设置图例： 设置图例的选中状态。3.0+
{ "类型一": true, "类型二": false, "类型三": false }设置时间轴： 设置活动的时间轴节点。 3.0+
- 接受参数： 时间轴节点名称。例如：
{ "value": "2021" }