xCharts 进度条 opts.extra.arcbar
以下是在 xCharts 中配置进度条 opts.extra.arcbar
的属性列表:
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
type | String | default | 圆弧进度图样式,可选值:"default"半圆弧模式,"circle"整圆模式 |
direction | String | cw | 动画方向(变换时需要注意起始与结束角度),可选值:"cw"顺时针方向,"ccw"逆时针方向 |
width | Number | 12 | 圆弧进度图弧线宽度 |
lineCap | String | round | 进度条两端样式,可选值:"round"圆形线帽,"square"方形线帽,"butt"平直边缘 |
backgroundColor | Color | #E9E9E9 | 圆弧进度图背景颜色 |
startAngle | Number | 0.75 | 圆弧进度图起始角度,0-2之间,0为3点钟位置,0.5为6点钟,1为9点钟,1.5为12点钟,默认0.75 |
endAngle | Number | 0.25 | 圆弧进度图结束角度,0-2之间,0为3点钟位置,0.5为6点钟,1为9点钟,1.5为12点钟,默认0.25 |
radius | Number | 圆弧进度图自定义半径(最大半径)(无特殊需求无需填写) | |
gap | Number | 2 | 圆弧进度条的间隔单位px |
centerX | Number | 自定义圆心x坐标(无特殊需求无需填写) | |
centerY | Number | 自定义圆心y坐标(无特殊需求无需填写) | |
linearType | String | none | 渐变类型,可选值:"none"关闭渐变,"custom"开启渐变 |
customColor | Array | 自定义渐变颜色,数组类型对应series的数组长度以匹配不同series颜色的不同配色方案,例如["#FA7D8D", "#EB88E2"] |