如何在周末更改条形图颜色?

当 xaxis 值为周末时,我想更改图表上条形柱的颜色。


这是我的数据示例:


[

  [

    1564034400000,

    291681

  ],

  [

    1564120800000,

    1533580

  ],

  [

    1564207200000,

    985398

  ],

  [

    1564293600000,

    451679

  ],

  [

    1564380000000,

    1051938459

  ],

  [

    1564466400000,

    1486601

  ],

  [

    1564552800000,

    1712150

  ],

  [

    1564639200000,

    1719820

  ],

  [

    1564725600000,

    2142532

  ],

  [

    1564812000000,

    1332015

  ]

]

我试过这个():


data.forEach(x => {              

            ndata.push([x.date, x.eApar]);    

            if(x.date.getDay()==0 || x.date.getDay()==6){

              bcolor="orange"

            }

            else

            {

              bcolor="";

            }

        });

然后在图表建筑上我有这个:


plotOptions: {

              series: {

                color: bcolor

              },

series: [{

          data: ndata,

          type: 'column',

        }],

但它改变了所有列的颜色。


我希望你能帮助我,谢谢!


暮色呼如
浏览 155回答 1
1回答

慕村9548890

您可以尝试在两个不同的系列上设置您的数据(根据工作日或周末在几天内缺失值),然后为每个系列定义颜色,如下所示:series: [{    name: 'weekend',    color: '#ffffff',    data: [null, null, null, null, null, value, value]}]; series: [{    name: 'weekdays',    color: '#f20303',    data: [value, value, value, value, value, null, null]}];在这里给出的这个问题的答案中有一个更好的解决方案:如何更改 highcharts 柱形图中每个类别的颜色?. 给不同的点一个像这样的颜色属性:  data: [  {y: 34.4, color: 'red'},     // this point is red  21.8,                        // default blue  {y: 20.1, color: '#aaff99'}, // this will be greenish  20]          
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript