Incorrect area fillOpacity in boosted series

[MightyPork]

fillOpacity is rendered incorrectly when area series gets boosted (probably also other types)

Something similar was reported in other places:

• Boost. Serie opacity #7567
• Boost: Some colors are barely visible when opacity is applied. #6580
• https://www.highcharts.com/forum/viewtopic.php?t=45744

Expected behaviour

Chart uses the set fillOpacity.

Actual behaviour

Chart is barely visible no matter the fillOpacity, so long as a custom opacity is specified.

If you remove the fillOpacity setting, the bug disappears, and the chart looks almost OK.
Note that I set a very small boost threshold for the demo, so the stepped line looks weird due to how boost draws it.

Live demo with steps to reproduce

https://jsfiddle.net/yoakfcn9/

Product version

highcharts 10.2.1

Affected browser(s)

reproduced in vivaldi, firefox

[raf18seb]

Hi @MightyPork, thanks for writing to us about your issue.

Your series is barely visible because the fillOpacity is divided by 10 (a temporary fix added in this ticket: #6759)

Your chart looks OK with fillOpacity when comenting this line:

scolor[3] /= 10;

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

FYI @cvasseng

[am-username]

Hi guys. Is there some estimate or a milestone when fix is expected ?
we are really interested in this fix
thanks in advance

[pawellysy]

Hello @am-username, we haven't scheduled any work in this ticket yet. Please use the workaround suggested by @raf18seb above. Thanks!

[MightyPork]

I tested this hack, but it ended up breaking some other charts, so I had to revert it. I don't remember what was the exact problem, unfortunately - but we are back to boost disabled for now.

[raf18seb]

@MightyPork the above hack was prepared for the 10.2.1 version. If you're using other Highcharts versions, it might indeed break other charts.
If you're using a fixed version, please let me know which exactly, and I'll prepare a fix for that specific version.

[MightyPork]

Ah, okay, good to know. I locked our Highcharts to version 10.0.0 after hitting the bug #17300 in 10.2.0.

I'll try again, maybe the update is now possible.

[raf18seb]

@MightyPork I'm afraid that overriding a single function is not possible in 10.0.0 because of the boost module structure and private functions.
You can override the whole module like in this 10.0.0 demo: https://jsfiddle.net/BlackLabel/8byr35tp/ (HTML tab),
or, if you have local files, find and simply remove (or comment) this line:

highcharts/ts/Extensions/Boost/WGLRenderer.ts

Line 1403 in ec92d7c

(scolor[3] as any) /= 10;

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions!

[MightyPork]

Please don't do this, this is the worst way to manage a project. If this bot achieves anything it is to make me angry first thing in the morning.

2 years later, the bug is still very much not fixed on the latest release.

https://jsfiddle.net/yp8qoL06/

[karolkolodziej]

@MightyPork Sorry for the inconvenience, we didn’t mean to annoy you.
Your feedback shows this issue is important, so I've added it to our backlog for prioritization.