Circle 圆环进度条

基础用法

圆形进度环有一系列的参数可配置，具体可以查看下面的 API 文档。

60%

自定义样式

通过自定义 slot 和丰富的配置，可以组合出很多统计效果。

42,001,776

消费人群规模

---

总占人数 75%

配合外部组件使用

通过数据的联动和逻辑控制，实现交互效果。

50%+-

支持的 CSS 变量

可自定义默认状态的轨道颜色和进度颜色

点击打开

:host {
  --ivy-circle-color: var(--ivy-color-primary, #409eff);
  --ivy-circle-track-color: var(--ivy-color-border, #e5e9f2);
}

Props

Prop	描述	类型	可选值	默认值
value	百分比	string|number	-	0
status	状态(进度条的颜色)	string	process/success/danger	process
stroke-width	进度环的线宽（px）	number|string	-	6
size	进度环的宽度和高度（px）	number|string	-	126
color	进度条的颜色(优先级最高)	string	-	false

Slots

名称	说明
无	自定义显示中间内容，内容默认垂直居中