2

SVG Shape Gaps change when Zooming

I used this tool: here to create a low-poly picture and then downloaded it as an SVG. I then noticed that the edges were overlapping and so I brought it into Inkscape where I set the stroke width on each shape to 0.005. This appeared to solve the problem when I was zoomed in as far as possible:

enter image description here

But when I zoomed out the edges weren't wide enough and so left white lines between the shapes:

enter image description here

I tried changing the vector-effect="non-scaling-stroke" on each shape but that made no difference and when I saved it as an SVG and opened it, it still had the gaps:

enter image description here

I have also seen a question like this where it was all part of the zooming but I still don't know what to do. Any help, please?

Many regards and thanks for any help.

|improve this question
  • 1
    Hi. Welcome to GDSE. It's a common rendering bug, an artefact caused by anti-aliasing and not specifically an Inkscape problem. Adobe Illustrator also has similar problems. SVG's viewed in browsers show it too. There's a similar question with a possible solution/workaround here – Billy Kerr Mar 20 '19 at 21:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.