Theme option in chart options or constructor
Theme being a global object (Highcharts.theme = {...}) is quite limiting - we have some cases where we want to have multiple charts on 1 page but with different themes.
To do that now we have to intersperse all the theming options with the rest of the options, which works, but is somewhat clunky. Or we can set the theme, render 1, set the theme, render another and hope there are no redraws required.
This suggestion is about adding a theme argument either to the highcharts options object, or to the constructor. eg:
new Highcharts.chart({
theme: {...},
chart: {...},
series: {...}
})
or
new Highcharts.chart({
/* Chart Here /
}, {
/ Theme here */
})
The theme actually isn’t part of the Highcharts namespace internally, it is just assigned there for conveniency.
Best practice currently would be to merge in the theme with your chart options:
chart1 = new Highcharts.Chart(Highcharts.merge(options1, theme1));
-
Anonymous commented
ok useful,thanks
-
Alex S. commented
This helped! Thank you!
In my case I needed to use multiple Highcharts themes on the same page.
My initial code was like this:
Highcharts.setOptions(theme);
// Create the chart
window.chart = new Highcharts.Chart({chart: {
renderTo: 'divChartContainer'
},
.......
});NOW, it looks like this:
var obj = {
chart: {
renderTo: 'divChartContainer'
},
.........
});
window.chart = new Highcharts.Chart(Highcharts.merge(obj,thema));