Highcharts styledMode with highcharts.css import causes pie legend hover to apply to all legend items

0
votes

Using highcharts, if you create a pie chart with styledMode: true; and you import their highcharts.css file, the hover effect on legend items causes all legend items to go opaque.

Code That Causes It

You can even see this on their demo page by selecting the Styled Mode: Pie. And then hovering over the legends items. If you set the styledMode: false; and then remove the CSS import it goes away.

My question basically: Is this a bug? It seems like unintended behaviour.

1
highcharts

1 Answers

0
votes

I don't think that it is a bug - it's more like a small difference between styledMode and the regular one, which could be easily fixed by changing the opacity for it.

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

CSS:

.highcharts-legend-point-active .highcharts-point:not(.highcharts-point-hover) {
  opacity: 1
}