zoukankan      html  css  js  c++  java
  • Echart使用记录-动态设置series的时候,设置了color属性,但所有的柱状图显示灰白色

    在后台获取数据,根据后台获取的数据,添加series的时候,应用设置了series的颜色,但是最终显示的时候,所有

    的柱状图显示灰白色。

    动态设置series代码

    for (var i = 0; i < chart.legend.length; i++) {
                       var seriesMolde = {};
                       var SeriesItemStyle = {};
                       var normal = {};//修改后这里新增了一个normal对象
                       normal.color = lstColor[i];//给normal对象的color属性赋值
                       SeriesItemStyle.normal = normal;//
                       seriesMolde.name = chart.legend[i];
                       seriesMolde.type = 'bar';
                       seriesMolde.stack = '产能';
                       seriesMolde.color = lstColor[i]; //这里设置了颜色,但是最后还是显示灰白
                       seriesMolde.label = SeriesLabel;
                       seriesMolde.itemStyle = SeriesItemStyle;//给itemStyle属性赋值
                       seriesMolde.data = chart.TopAll[i];
    
                       SeriesLineMachine.push(seriesMolde);
                   }
    

     换成可以直观看的Echar option代码

    {
                            name: '名称',
                            type: 'bar',
                            color: '#63b2ee',
                            stack: '明细',
                            itemStyle: {//除了上面设置颜色外,这里还需要设置颜色
                                normal: {
                                    color: '#63b2ee'
                                }
                            },
                            label: {
                                normal: {
                                    show: true,
                                    position: 'inside',
                                    align: 'center',
                                    verticalAlign: 'middle',
                                    color: 'white',
                                    borderColor: '#9ACD32',
                                    formatter: function (params) {
                                        if (params.value == '0.00') {
                                            return '';
                                        } else {
                                            return params.value + '%';
                                        }
                                    }
                                }
                            },
                            data: chart.dataBaiDian
                        },

     

  • 相关阅读:
    CCF CSP 201403-2 窗口
    Ethical Hacking
    Ethical Hacking
    Ethical Hacking
    Ethical Hacking
    Ethical Hacking
    Ethical Hacking
    Ethical Hacking
    Ethical Hacking
    Ethical Hacking
  • 原文地址:https://www.cnblogs.com/PingPo/p/13217455.html
Copyright © 2011-2022 走看看