Several display issues when drawing paths

[JustASquid]

I'm trying to display the following SVG image (The actual SVG is in the reproduction below):

This is how the image is displayed in PIXI using this pixi-vector-graphics:

Notice the obvious visual glitches. I've attempted to make a more minimal reproduction with a simpler image, but at least the most obvious issue (with the brown section) seems to go away once certain unrelated image elements are deleted.

I've created a reproduction of the issue here.

[FlorianLudwig]

Hey @JustASquid, thank you for the report and the example.

There are several issues in this svg and it would be really great if you could further simplify the svg. (and having it demonstrate just one problem to start with)

Remove as many elements as possible, simplify elements and remove unneeded tags and attributes from the xml - using inkscape "plain svg" provides a better starting point when poking inside the xml tree.

Could you do that?

[JustASquid]

Hi Florian, thanks for your response. Next time I get a chance I'll re-save as a simple SVG.

My first thought was to simplify the image by removing elements, but it seems like removing elements actually causes the issue with the brown section to stop happening.

Are there any other specific issues with this SVG I can resolve? It was just generated with an online tool so i guess it's possible that it's ill formed, but all other SVG renderers handle it fine.

[FlorianLudwig]

@JustASquid what is the copyright status of this svg? We would want to have an example that we can include within our git to reproduce the issue and have an test case.

[JustASquid]

I made the original image so it's free to use.

[JustASquid]

@FlorianLudwig Just pushed an update to save the test image as simple SVG instead of Inkscape SVG.