Echarts不同类型的柱子不同的颜色

最新推荐文章于 2024-05-30 23:16:00 发布

TSwizzle1327

最新推荐文章于 2024-05-30 23:16:00 发布

阅读量206

点赞数

分类专栏： ECharts 文章标签： echarts

本文链接：https://blog.csdn.net/jduksa/article/details/113869237

版权

ECharts 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

var data_d = []; 

//能确定柱子的最大数量时 根据给不同类型给不同的颜色
        for (var b = 0; b < bar.length; b++) {
            if (bar[b] == "不合格") {
                var data_style = {
                    type: 'bar',
                    barWidth: 25,
                    barMaxWidth: 30,
                    barGap: '50%',
                    label: {
                        show: true,
                        position: 'top',
                        color: 'balck'
                    },
                    itemStyle: {
                        //borderColor: '#000',
                        color: 'red',
                        borderColor: 'white',
                        borderWidth: 1,
                        borderType: 'solid',
                        barBorderRadius: 3,
                        opacity: 1
                    }
                };
                data_d.push(data_style);
            }
            else if (bar[b] == "合格") {
                var data_style = {
                    type: 'bar',
                    barWidth: 25,
                    barMaxWidth: 30,
                    barGap: '50%',
                    label: {
                        show: true,
                        position: 'top',
                        color: 'balck'
                    },
                    itemStyle: {
                        //borderColor: '#000',
                        color: 'DarkKhaki',
                        borderColor: 'white',
                        borderWidth: 1,
                        borderType: 'solid',
                        barBorderRadius: 3,
                        opacity: 1
                    }
                };
                data_d.push(data_style);
            }
            else if (bar[b] == "良好") {
               ... ...
            }
        }