bsheehy
Posts: 6
Joined: Sat Oct 07, 2023 8:13 pm

Series backgroud color only partial loading in Safari mobile

I have a HighCharts chart as shown with 3 series. 1 is hidden from legend.
The hidden series applies the yellow background colour to the chart.

This displays correctly as shown in Chrome\Edge and in mobile view as in attached CorrectImage

However in Safari iOS it partially cuts of some of the background colour a shown in IncorrectImage. If I click on the chart then click of it again the colour will correct it self and fill in the rest of the area.

Ive tries various things to get the series o draw correctly e.g.

Code: Select all

this._renderedChart.series[2].hide();
this._renderedChart.series[2].show();
 
 this._renderedChart.redraw();
Is there any specific reason this should be happening and any help appreaciated?
Attachments
CorrectImage.PNG
CorrectImage.PNG (36.21 KiB) Viewed 158 times
IncorrectImage.PNG
IncorrectImage.PNG (83.16 KiB) Viewed 158 times
bsheehy
Posts: 6
Joined: Sat Oct 07, 2023 8:13 pm

Re: Series backgroud color only partial loading in Safari mobile

I found a fix for this myself.
By adding the same series in a different order and then assigning them a zIndex to match the original order I required the chart auto-magically fixed itself.
Im not sure why it didnt like the original way (which worked on desktop and everywhere else but Safari).
I hope this helps someone.
User avatar
dawid.d
Site Moderator
Posts: 992
Joined: Thu Oct 06, 2022 11:31 am

Re: Series backgroud color only partial loading in Safari mobile

Thanks for sharing the solution!
Dawid Draguła
Highcharts Developer

Return to “Highcharts Usage”