我正在尝试使用下面的 js 对 highcharts 中的柱形图进行向下钻取
// Create the chart
Highcharts.chart('container', {
chart: {
type: 'column'
},
title: {
text: 'Browser market shares. January, 2015 to May, 2015'
},
subtitle: {
text: 'Click the columns to view versions. Source: <a href="http://netmarketshare.com">netmarketshare.com</a>.'
},
xAxis: {
type: 'category'
},
yAxis: {
title: {
text: 'Total percent market share'
}
},
legend: {
enabled: false
},
plotOptions: {
series: {
borderWidth: 0,
dataLabels: {
enabled: true,
format: '{point.y:.1f}%'
}
}
},
tooltip: {
headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
},
series: [{
name: 'Brands',
colorByPoint: true,
data: [{
name: 'Microsoft Internet Explorer',
y: 56.33,
drilldown: 'Microsoft Internet Explorer'
}, {
name: 'Firefox',
y: 10.38,
drilldown: 'Firefox'
}]
}],
drilldown: {
series: [{
name: 'Microsoft Internet Explorer',
id: 'Microsoft Internet Explorer',
data: [
[
'v11.0',
24.13
],
[
'v8.0',
17.2
],
[
'v6.0',
1.06
],
[
'v7.0',
0.5
]
]
}, {
name: 'Firefox',
id: 'Firefox',
data: [
[
'v35',
2.76
],
[
'v34',
1.27
],
[
'v38',
1.02
],
[
'v33',
0.22
],
[
'v32',
0.15
]
]
}]
}
});
是否可以仅根据某些不同的而不是 x 轴或 y 轴值更改向下钻取列颜色。
在下面基于“new_info”的数据中，我想根据其更改颜色
[{"name":Microsoft Internet Explorer, data :[['v11.0',14, (new_info) 6] , ['v8.0',10, 8(new_info)] , ['v6.0',8, 3 (new_info)]]
如果值介于 10 - 8 红色、7-5 琥珀色、4-3 黄色之间。
当我点击钻取时，它应该向我显示一些 n 柱形图，其中几列为红色，几列为黄色，几列为橙色，依此类推。
最佳答案
您可以使用zones像这样:
...
zones: [{
value: 4,
color: '#ffcc00'
}, {
value: 7.1,
color: '#AA7F39'
}, {
value:13,
color: '#ff0000'
}]
...
这里是Fiddle
关于javascript - Highcharts - 柱形图钻取，如何根据某些值更改钻取条颜色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48660900/