ECharts饼图能够根据来源的名称决定颜色吗?

目前项目中某一个模块用到了饼图,主要分为正面,负面和中立。
需求是正面为绿色,负面为红色,中立为蓝色。
但是ECharts中是根据饼图面积分配颜色的,
能不能根据名称来决定饼图块的颜色呢?

先谢谢大家的解答,今天上班的时候按大家的方法都试了一遍,但是还有一点问题和大家的描述不太一样。
图表的数据是后台给出的,代码如下吧。虽然我知道颜色是color控制的,但是数据是由chartData[]中给出的,chartData中有name和value属性,如何将它与color相关联呢?

var self = this;
option = {
    backgroundColor: '',
    tooltip: {
        ...                        
        }
    },
    legend:{
        orient:'vertical',
        data:self.legendData,
        icon: 'rect',
        right: '5%',
        top:'80%',
        textStyle:{
            color:'#888',
            fontSize:'14'
        },
        itemWidth: 12,
        itemHeight: 12
    },
    grid:{
        ...
    },
    color:['#45ba59','#5b8de0','#ee6d61'],
    series : [
        {
        type:'pie',
        param:self.param,
        data:self.chartData
        ...
        }
    ]
};
阅读 6.7k
3 个回答

echarts非常多的功能都是可配置的,可以多看下他的开发文档中配置的那部分
http://echarts.baidu.com/opti...

饼图颜色的设置

var colors = {
    '正面':'#00ff00',
    '负面':'#ff0000',
    '中立':'#0000ff'
}
itemStyle:{
    color:colors[..name]
}

itemStyle可以多级设置。可以通过直接设置data中元素的itemStyle来实现。

比如
data:[{name:正面,value:10,itemStyle:{color:'green'}},{name:负面,value:10,itemStyle:{color:'red'}}]

楼上说的对 itemStyle属性很重要

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题