'Highcharts bubble chart sub levels not displayed in drilldown
I'm trying to adapt my code with the newer version of highcharts and I have a problem with bubble chart with drilldown levels. The code worked like a charm but in the version 9.3.3 (even in 10.0), only the first sub level is displayed correctly. You can see a code here : https://jsfiddle.net/vegaelce/8nLumacp/ In this example, drilling in California sub-level displays correct years information. But drilling in Colorado or DC or Florida displays nothing. This example worked with the library 9.1.2.
My series are defined as :
series: [{ name:'California',
data : [{
x: 4836171.3, y: 29828, z: 1953706.9,
drilldown: 'drill_California'
}],
},
{ name:'Colorado',
data : [{
x: 1327390, y: 8299, z: 527434,
drilldown: 'drill_Colorado'
}],
},
{ name:'DC',
data : [{
x: 1809005, y: 11525, z: 720978.0999999999,
drilldown: 'drill_DC'
}],
},
{ name:'Florida',
data : [{
x: 1252697.9, y: 7619, z: 524066.6,
drilldown: 'drill_Florida'
}],
},
],
drilldown: {
series: [{
name: "California",
id: "drill_California",
data: [{
name: '2016',x: 1595318.9, y: 9249, z: 627939.8,
},{
name: '2017',x: 1404929.6, y: 9817, z: 596923.6,
},{
name: '2018',x: 1729952.1, y: 10117, z: 688805.7,
},{
name: '2019',x: 105970.7, y: 645, z: 40037.8,
},],
dataLabels: {
enabled: true,
formatter: function () {
return this.key;}
}
},
{
name: "Colorado",
id: "drill_Colorado",
data: [{
name: '2016',x: 443088.5, y: 2669, z: 168450.9,
},{
name: '2017',x: 395947.7, y: 2787, z: 168011.2,
},{
name: '2018',x: 463399.3, y: 2685, z: 181716.8,
},{
name: '2019',x: 24954.5, y: 158, z: 9255.1,
},],
dataLabels: {
enabled: true,
formatter: function () {
return this.key;}
}
},
{
name: "DC",
id: "drill_DC",
data: [{
name: '2016',x: 599168.1, y: 3612, z: 230768.4,
},{
name: '2017',x: 593314.4, y: 4196, z: 249435.3,
},{
name: '2018',x: 586145.8, y: 3532, z: 229305.2,
},{
name: '2019',x: 30376.7, y: 185, z: 11469.2,
},],
dataLabels: {
enabled: true,
formatter: function () {
return this.key;}
}
},
{
name: "Florida",
id: "drill_Florida",
data: [{
name: '2016',x: 440506.9, y: 2561, z: 177894.7,
},{
name: '2017',x: 358862.3, y: 2482, z: 157490.4,
},{
name: '2018',x: 426437.3, y: 2403, z: 178357.5,
},{
name: '2019',x: 26891.4, y: 173, z: 10324,
},],
dataLabels: {
enabled: true,
formatter: function () {
return this.key;}
}
}]
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
