Skip to content

MultiDonutChart 多层环形图

基于 ECharts 的多层环形图组件,支持自定义颜色、尺寸和图例样式。

基础用法

loading

API

Props

参数说明类型默认值
className容器的类名string'chart'
width图表宽度string'100%'
height图表高度string'300px'
chartParam图表数据对象ChartParam必传
color自定义颜色数组string[]['#0055FE', '#88DDFF', '#FF749D', '#FCDD69']

ChartParam

参数说明类型必填
data数据项数组ChartDataItem[]

ChartDataItem

参数说明类型必填
name数据项名称string
color数据项颜色string
tips数据项提示文本string
value数据项数值number

特性

  • 自动排序:数据会自动按值的大小排序,值越大圆弧宽度越大
  • 响应式:组件支持窗口大小变化自动重绘
  • 自定义图例:支持自定义图例的样式和格式
  • 工具提示:鼠标悬停显示详细数据和百分比

注意事项

  1. chartParam 是必传参数,必须包含 data 数组
  2. 数据项中的 color 必须指定,因为组件会对数据进行排序
  3. 组件基于 ECharts 5.x 版本开发
  4. 建议在组件销毁前调用 dispose() 方法清理资源(组件已自动处理)

Released under the MIT License.