echarts 柱状图、饼图指定颜色

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/liyongjian12/article/details/84772581

1、在option变量里面设定调色盘颜色列表，不设定的话默认是如下颜色

全局调色盘 option.color 获取颜色

['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83',  '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3']

option = {
   color: ['red', 'green', 'yellow', 'blueviolet']
}

2、柱状图设置每个柱子的颜色

series: [{
    name: '',
    type: 'bar',
    //配置样式
    itemStyle: {
        //通常情况下：
        normal: {
            //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
            color: function (params) {
                var colorList = ['rgb(164,205,238)', 'rgb(42,170,227)', 'rgb(25,46,94)', 'rgb(195,229,235)'];
                return colorList[params.dataIndex];
            }
        },
        //鼠标悬停时：
        emphasis: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
    },
}]