echarts柱状图根据数值范围不同而颜色不同的柱状图

单独添加itemStyle
itemStyle: { color: '#ccc' }

image.png

封装

• 主要在series里的itemStyle判断设置颜色

 series: [
                        {
                            name: 'PM2.5',
                            type: 'bar',
                            data: Pm25Ozonedata,
                            data: [35,75,100,115,150,250,300,500],
                            itemStyle: {
                                normal: {
                                    color: function (params) {
                                        var index_color = params.value;
                                        if (index_color <=35) {
                                            return '#00ff00';
                                        } else if(index_color >35 &&index_color <=75) {
                                            return '#f5fc13';
                                        }else if(index_color >75 &&index_color <=115) {
                                            return '#ff8400';
                                        }else if(index_color >115 &&index_color <=150) {
                                            return '#fc0000';
                                        }else if(index_color >150 &&index_color <=250) {
                                            return '#9b004f';
                                        }else if(index_color >250 &&index_color <=500) {
                                            return '#860023';
                                        }
                                    }
                                }
                            }
                        },