I'm working on a drilldown treemap and the render is exactly what I want. My problem is about the legend. I used colorAxis for the drilldown level and I would like to hide the legend on the main level (one color by tile) but display the graduate color axis legend on the sub level, only for the sub-serie displayed.
I made an example here : http://jsfiddle.net/vegaelce/4dLopjwv
I used the property legend to display it :
legend: {
enabled: true
},
but it displays the legend of each colorAxis on the sublevel. How can I hide all the legend except the one corresponding to the sub-serie displayed ? Thanks in advance
You can use drilldown
and drillup
events and update the visible
property of the right color axis.
chart: {
type: 'treemap',
events: {
drilldown: function(e) {
const colorAxis = this.colorAxis[e.seriesOptions.colorAxis];
if (colorAxis) {
colorAxis.update({
visible: true
}, false);
}
},
drillup: function() {
this.colorAxis.forEach(function(cAxis){
if (cAxis.visible) {
cAxis.update({
visible: false
}, false);
}
});
}
}
}
Live demo: http://jsfiddle.net/BlackLabel/vtg7fdn6/
API Reference: https://api.highcharts.com/class-reference/Highcharts.Axis#update