Issue with .highcharts-null-point css class

[terrencecastro]

Hello,

I'm currently using the Highcharts Organization Chart on an Angular project but the .highcharts-null-point class from highcharts.scss is overriding the inline fill="none" on the path elements. This causes the organization chart to have "broken lines". Please see attached link to the screenshot.

https://ibb.co/F3Fgsw5

[mateusz.b]

Hello terrencecastro,

Welcome to our forum and thanks for contacting us with your issue!

Thanks for sharing the screenshot, but it is hard to tell you what is not working and what could be done without taking look at your code. Please try to reproduce your issue in a form of a live demo. You can start here: https://jsfiddle.net/BlackLabel/7ybo0aLw/

Best regards!

[terrencecastro]

Hi,

I was able to reproduce it here: https://stackblitz.com/edit/angular-ivy ... styles.css

I added "./node_modules/highcharts/css/highcharts.scss" under the styles node of angular.json. If you would notice, there's a "broken line" below Christer Vasseng and another one below Anita Nesse.

Regards

[mateusz.b]

Hi terrencecastro,

Sorry for slightly longer response time. Frankly speaking it took me a while to figure out what was the cause of the issue.

It seems like it is a bug. Appropriate github issue will be created.
As a workaround you can add these styles:

Code: Select all

.highcharts-null-point {
  fill: none !important;
}

Demo: https://stackblitz.com/edit/angular-ivy ... styles.css

I will let you know once GH issue is created so you can follow it for any updates.

Best regards!

[terrencecastro]

Hi,

Got it. Thanks!

Regards

[mateusz.b]

You're welcome! In case of any further questions, feel free to contact us again.