How to handling jagged pie charts slices and spotty area line charts

[SDVII]

Question

• Is there a way to increase anti aliasing or reduce the jaggedness of Pie Charts?
• Is there a way to mitigate area charts having rendering issues with fill?

Thank you for your time

Environment (if applicable)

• amCharts v5.8.0
• Microsoft Edge v126.0.2592.61
• React v18.2.0

[martynasma]

That does not look right. Can you provide a working demo?

[SDVII]

Here is a Codepen for the Pie Chart. As you can see, the stroke around each slice is quite jagged https://codepen.io/SDVII/pen/wvbmPPd

[SDVII]

Here is a Codepen for the Area Chart. This issues seems to only affect Mac devices

• Pen: https://codepen.io/SDVII/pen/YzbaYGV?editors=0010
• OS: Sonoma v14.5
• Browser: Chrome v126.0.2592.61
• Screenshot:
• Recording https://github.com/amcharts/amcharts5/assets/10416702/16dfc249-8e6a-4a7d-862e-c29060f3439f

[martynasma]

Here is a Codepen for the Pie Chart. As you can see, the stroke around each slice is quite jagged

Unfortunately, there's nothing we can do about it. That's how canvas rendering works in browser.

[martynasma]

Here is a Codepen for the Area Chart. This issues seems to only affect Mac devices

I can't seem to be able to reproduce it on a Macbook Pro.

Same OS version. Chrome: 126.0.6478.115.

Can you try upgrading Chrome?

[SDVII]

Upgraded the browser, still encountering the issue. Multiple people on my team are encountring it as well

[SDVII]

Safari & Firefox are working just fine

[martynasma]

Still not able to reproduce it. There's a newer version of Chrome now available. Maybe try an upgrade?

If it's still buggy, maybe you can provide more information about your setup? E.g. are you using external monitor? What is the resolution? Anything else?