echarts饼图设置颜色的两种方式

最新推荐文章于 2024-05-22 09:42:41 发布

白桃与猫

最新推荐文章于 2024-05-22 09:42:41 发布

阅读量1.3k

点赞数

分类专栏： echarts 文章标签： echarts 前端 vue.js

本文链接：https://blog.csdn.net/qq_52395343/article/details/131664365

版权

echarts 专栏收录该内容

8 篇文章

订阅专栏

文章介绍了两种在Echarts中设置饼图颜色的方法：1)直接在color数组中指定颜色；2)在series.data.itemStyle.color中为每个数据项单独设定颜色。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 直接写在color数组中

option = {
  color:['#fac858','#e0504b','#e6e9ee'],
  series: 
    {
      type: 'pie',
      radius: ['40%', '70%'],
      data: [
        { value: 1048, name: 'Search Engine', },
        { value: 735, name: 'Direct'},
        { value: 580, name: 'Email' },
      ]
    }
};

2. 在series.data.itemStyle.color中

option = {
  series: 
    {
      type: 'pie',
      radius: ['40%', '70%'],
      data: [
        { value: 1048, name: 'Search Engine',itemStyle:{color:'#fac858'} },
        { value: 735, name: 'Direct',itemStyle:{color:'#e0504b'} },
        { value: 580, name: 'Email',itemStyle:{color:'#e6e9ee'} },
      ]
    }
};