组件说明
进度图是进度条的一种，通常用于展示单点提升比例这样的数据，告知用户当前状态和预期
案例效果
*环形进度条示例
数据绑定
在数据Tab页中可以设置组建的数据来源为数据集市、数据库表或静态数据
环形进度条的数据集市
| 配置项 | 说明 | |
|---|---|---|
| 取值字段 | 只能拖入度量下的字段，拖入的字段会汇总进行展示并计算与总数的占比，只能拖入一个字段。 | |
| 展示名称 | 可自定义度量字段显示的名称 | |
| 聚合方式 | 数据聚合的方式，可选择求和、平均值等 | |
| 排列方式 | 可根据指定度量选择降序或升序排列 | |
| 总数 | 只能拖入度量下的字段，拖入的字段会汇总进行展示，只能拖入一个字段。没有总数时默认总数为100 | |
| 展示名称 | 可自定义度量字段显示的名称 | |
| 聚合方式 | 数据聚合的方式，可选择求和、平均值等 | |
| 排列方式 | 可根据指定度量选择降序或升序排列 | |
| 数据筛选 | 设置筛选条件 | 直接对数据进行筛选，可选择AND（并且）和OR（或者）为各个筛选条件的关系。添加规则和分组后筛选字段为文档中的字段，关系条件可选择“=”“>”等关系符号，后面跟上自己想要的筛选数据 |
| 设置聚合筛选条件 | 数据聚合后进行筛选，可选择AND（并且）和OR（或者）为各个筛选条件的关系。添加规则或分组后筛选字段为维度和度量中的字段，关系条件可选择“=”“>”等关系符号，后面跟上自己想要的筛选数据 | |
| 数据缓存 | 数据缓存的时间，可选择不缓存、一小时和七小时 | |
| 定时刷新 | 数据定时更新的时间，可自定义选择定时更新的时间数据并选择时、分、秒等时间单位 | |
| 结果展示 | 可选择展示的数据数量 | |
| 更新 | 点击后立即更新数据 | |
| 调试 | 查看图表配置后执行的SQL语句和格式化后的数据 |
示例1：显示当前区域任务完成情况的当前完成率（聚合方式为平均值）
*当前区域任务总体完成率
示例2：显示区域任务完成情况，当前完成情况和预期完成情况的完成度
*当前区域任务完成情况对比预期完成情况的进度情况
环形进度条的静态数据
静态数据是指直接在表格中设置对应数据格式的方式来绘制图表，展开「数据来源」下拉框后选择「静态数据」，再点击「编辑表格数据」即可通过表格数据绘制数字翻牌器
*静态数据设置演示
图表样式
在样式中可以设置图表的「环状进度条属性」、「组件属性」、「标题属性」、「背景和边框」
环状进度条属性
常规配置
| 配置项 | 说明 |
|---|---|
| 进度条粗细 | 控制环形进度条的环形粗细，数值越小环形越细，范围为1~100 |
*进度条圆环示意图
自定义指标文本
| 配置项 | 说明 |
|---|---|
| 自定义字号 | 控制进度条中心数值文本的大小，默认为25 |
| 文字粗细 | 控制进度条中心数值文本的粗细 |
| 单位设置 | 控制进度条中心数值的单位，默认为空 |
| 文本颜色 | 控制进度条中心数值文本的颜色 |
*进度条数值组成示例
自定义文本
| 配置项 | 说明 |
|---|---|
| 自定义文本 | 控制自定义文本显示的内容 |
| 自定义字号 | 控制自定义文本的大小，默认为25 |
| 文字粗细 | 控制自定义文本的 粗细 |
| 文本颜色 | 控制自定义文本的颜色 |
*自定义文本示例
自定义颜色模块
| 配置项 | 说明 |
|---|---|
| 自定义配色 | 控制是否使用自定义进度条配色，开启后显示进度条颜色和进度条背景色选项 |
| 进度条颜色 | 控制进度条完成进度的颜色，只有开启自定义配色时才有效 |
| 进度条背景色 | 控制进度条未完成部分的颜色，只有开启自定义配色时才生效 |
*自定义颜色示例
组件属性
| 配置项 | 说明 |
|---|---|
| 组件名称 | 该组件的名称 |
| 组件实际宽度 | 该组件当前的宽度，默认为400 |
| 组件实际高度 | 该组件当前的高度，默认为250 |
| X轴位置 | 表示当前图表距离 画布左侧的距离 |
| Y轴位置 | 表示当前图表距离画布顶部的距离 |
*图表位置与宽高示例
标题属性
| 配置项 | 说明 |
|---|---|
| 标题 | 图表的标题，显示在图表的上方，可修改 |
| 启用标题 | 开启后在图表上方显示标题文本框的内容，并开启设置标题其他样式的功能 |
| 标题字号 | 图表标题的字体大小，默认「16」 |
| 标题粗细 | 图表标题字体的粗细，默认正常，可选值：细小、正常、粗重 |
| 标题字体 | 图表标题字体样式，默认为微软雅黑 |
| 标题颜色 | 图表标题字体的颜色，默认为#000000 |
| 对齐方式 | 图表标题的对齐方式，默认为左对齐，可选设置为：左对齐、右对齐和居中对齐， |
| 标题行高 | 图表标题的行高，默认与标题高度一致（40），标题垂直于行高中心 |
| 标题高度 | 整个标题部分的高度，默认与标题行高一致（40） |
| 标题内边距 | 标题文字距离边框 的距离，默认为0 0 0 10，单位为px，依次为上、右、下、左 |
| 图表简介 | 输入对该图表的介绍，不会在图表上体现 |
*环形进度条标题示例
背景和边框
| 配置项 | 说明 |
|---|---|
| 背景和边框 | 控制图表是否显示背景和边框，关闭后会隐藏设置好的边框、背景，同时隐藏「标题背景设置」、「组件背景设置」、「标题底部边框设置」和「组件边框设置」设置项 |
标题背景设置
| 配置项 | 说明 |
|---|---|
| 背景颜色 | 控制图表标题的背景颜色 |
| 背景图片 | 上传图片后，会将图片设置为标题的背景图片，会覆盖一设置的背景颜色 |
组件背景设置
| 配置项 | 说明 |
|---|---|
| 背景颜色 | 控制图表的背景颜色 |
| 背景图片 | 上传图片后，会将图片设置为组件的背景图片，会覆盖一设置的背景颜色 |
标题底部边框设置
| 配置项 | 说明 |
|---|---|
| 底部边框线 | 设置图表标题底部的边框线类型，默认为直线 |
| 底部边框宽度 | 控制图表标题底部边框线的宽度，值越大边框线越大 |
| 底部边框颜色 | 控制图表标题底部边框线的颜色 |
组件边框设置
| 配置项 | 说明 |
|---|---|
| 边框线类型 | 设置图表周围边框线的类型，默认为直线 |
| 边框宽度 | 控制图表周围边框线的宽度，值越大边框线越大 |
| 边框颜色 | 控制图表周围边框线的颜色 |
| 圆角 | 控制图表四个角的圆润程度，值越大四个角越圆润，最大会变成椭圆形 |
*标题背景和组件背景示例
*关闭背景和边框示例