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



我想在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',
}],

但它会更改所有列的颜色。

希望你能帮到我,谢谢!

您可以尝试在两个不同的系列上设置数据(根据工作日或周末在日期上缺少值(,然后为每个系列定义颜色,如下所示:

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]
}
];

编辑: 在@eolsson给出的这个问题的答案中,有一个更好的解决方案:如何更改高图表柱形图中每个类别的颜色?为不同的点指定一个颜色属性,如下所示:

data: [
{y: 34.4, color: 'red'},     // this point is red
21.8,                        // default blue
{y: 20.1, color: '#aaff99'}, // this will be greenish
20]          

最新更新