我有一个使用 highcharts 的图表,唯一的问题是每列都有相同的列。 我应该怎么做才能让每一列都有不同的列。 这是我的代码:
var charts = [];
$containers = $('#container1');
var datasets = [
{
name: 'Tokyo',
data: [49, 57]
}];
var cat = ['A', 'B'];
console.log(datasets);
$.each(datasets, function(i, dataset) {
console.log(dataset);
charts.push(new Highcharts.Chart({
chart: {
renderTo: $containers[i],
type: 'column',
marginLeft: i === 0 ? 100 : 10
},
title: {
text: dataset.name,
align: 'left',
x: i === 0 ? 90 : 0
},
credits: {
enabled: false
},
xAxis: {
categories: cat,
labels: {
enabled: i === 0
}
},
yAxis: {
allowDecimals: false,
title: {
text: null
}
},
legend: {
enabled: false
},
series: [dataset]
}));
});
提前致谢。
最佳答案
要使每列具有不同的颜色,您只需将 colorByPoint
属性设置为 true
。
引用:
或者,您可以将每一列设为一个单独的系列,这为您提供了额外的控制级别。
OTOH,在大多数情况下,为每列设置单独的颜色没有任何意义,只会使数据变得杂乱和困惑,并使用户在认知上更加努力地解释图表。
如果您出于特定原因想要突出显示单个列,可以通过将 fillColor 属性添加到数据数组来实现:
类似于:
data:[2,4,5,{y:9,fillColor:'rgba(204,0,0,.75)',note:'Wow, look at this one'},4,5,6]
关于javascript - 如何使用 highcharts 创建列字符,其中每列都有不同的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27553505/