Echart颜色设置

最近在做的项目用到Echarts，由于客户对图表颜色的要求，找了很多资料，终于对柱状图，饼图，仪表盘图的颜色设置有了一个了解，供大家参考学习。

Echarts配置项手册：http://echarts.baidu.com/option.html#title

Echarts实例：http://echarts.baidu.com/demo.html#confidence-band

1. 饼状图(pie)

只要在option里加入color，就可以了，比如修改官网示例的颜色http://echarts.baidu.com/echarts2/doc/example/pie1.html，试验了一下，好像color要放在series之后，否则会报错。

option = {
    title : {
        text: '某站点用户访问来源',
        subtext: '纯属虚构',
        x:'center'
    },
  
    tooltip : {
        trigger: 'item',
        formatter: "{a}
{b} : {c} ({d}%)"
    },
    legend: {
        orient : 'vertical',
        x : 'left',
        data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
    },
    toolbox: {
        show : true,
        feature : {
            mark : {show: true},
            dataView : {show: true, readOnly: false},
            magicType : {
                show: true, 
                type: ['pie', 'funnel'],
                option: {
                    funnel: {
                        x: '25%',
                        width: '50%',
                        funnelAlign: 'left',
                        max: 1548
                    }
                }
            },
            restore : {show: true},
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    series : [
        {
            name:'访问来源',
            type:'pie',
            radius : '55%',
            center: ['50%', '60%'],
            data:[
                {value:335, name:'直接访问'},
                {value:310, name:'邮件营销'},
                {value:234, name:'联盟广告'},
                {value:135, name:'视频广告'},
                {value:1548, name:'搜索引擎'}
            ]
        }
    ],
  color: ['rgb(239,219,200)','rgb(137,246,100)','rgb(155,314,203)','rgb(155,155,146)','rgb(111,222,100)']
};                   
                    

2.仪表盘(gauge)

仪表盘的颜色要加在series里

   series: [
                        {
                            name: '指标',
                            type: 'gauge',
                            detail: { formatter: '{value}%' },
                            data: [{ value: completeRate, name: '完成率' }],
                            axisLine: {
                                lineStyle: {
                                    color: [[0.0, 'lime'], [0.2, 'red'], [0.8, 'green'], [1, 'blue']]
                                }
                            }
                        }
                    ]

3.柱状图

柱状图颜色的设置也要放到series里，官网示例http://echarts.baidu.com/echarts2/doc/example/bar3.html

 series : [
        {
            name:'2011年',
            type:'bar',
            data:[18203, 23489, 29034, 104970, 131744, 630230],
            itemStyle:{  normal:{color:'rgb(200,210,99)'}   }  
        },
        {
            name:'2012年',
            type:'bar',
            data:[19325, 23438, 31000, 121594, 134141, 681807],
            itemStyle:{  normal:{color:'#079255'}}  
        }
    ]