Light theme override plot bands color

[ZukaBriek]

Hi I have a chart with plot bands which have a colour but when I put the light theme on my dashboard the dashboard light theme override the plot band's colour.

[dawid.d]

Hello,

Thanks for the question!

Can you send a demo of your case, made in e.g. in JSFiddle? This shouldn't be a complicated problem, but it depends on your use case.

Thanks!

[ZukaBriek]

Here you have screenshots from my code and the result that I have.

1st screen : the code of a plotband's code, you can see the color attribute
2nd screen : the result of my plotbands they are light gray but they should be blue

I have this issus only since have setup the white theme of highcharts dashboard.

[dawid.d]

Highcharts Dashboards renders charts with styled mode enabled by default, i.e. it prefers CSS settings. See the demo below on how to set default colors for plotbands for different themes.

Demo: https://jsfiddle.net/BlackLabel/wqs74dah/

Hope it helps!

[ZukaBriek]

I have always this issue I've fixed it with a css styling but now I want to have multiple plotbands with differents colors, so the problem reappear. I've already try to apply chart.styledMode: false but it didn't worked. Do you have a solution ?

[dawid.d]

Hi,

Did you also remember to remove the highcharts.css style import?

We have noticed that the default enabling of styled mode is causing issues for users who previously used standalone Highcharts charts without it. For this reason, styled mode will be disabled by default in the new version.

Best regards

[dawid.d]

Hi,

After updating Highcharts Dashboards to version 3.0.0, `styledMode` is now disabled by default for the Highcharts Component. For those of you who wish to keep using `styledMode`, you can enable it in the settings with the following code in your Highcharts Component options:

Code: Select all

{
  chartOptions: {
    chart: {
      styledMode: true
    }
  }
}

If you prefer to keep it disabled, make sure that you do not import the `highcharts.css` file to avoid any unwanted styling effects.

Best regards,