I need to convert images for object detection. I start with svg images with multiple polygons. Example:
<svg ...>
<rect width = "100%" height = "100%" fill = "rgb(0,0,0)" />
<polygon points="..." fill="rgb(221,221,221)" fill-opacity="1.0" />
<polygon points="..." fill="rgb(100,100,100)" fill-opacity="0.5" />
</svg>
The result is a black background, object A having color rgb(221,221,221), object B having color rgb(50,50,50), and anywhere the two objects overlap rgb(160,160,160). The detection algorithm (cannot be modified) determines objects by their pixel values.
I have successfully converted from svg to png using inkscape, svgr-convert, or ImageMagikk. However the edges of these png images are always blurry which in interfering with my object detection.
Is there some way to convert having crisp edges? This image shows the conversion adding blurred pixels with incorrect values. I have zoomed into an edge to make it obvious.
edit: full image example
<svg viewBox="17.874 6.66874 74.0131 70.817" xmlns="http://www.w3.org/2000/svg">
<rect width = "100%" height = "100%" fill="black" fill-opacity="1.000000" stroke="black" stroke-opacity="1.000000" stroke-width ="0.000000"/>
<polygon points="66.499391,34.862972 35.730400,51.495089 68.667463,64.499553 " fill="rgb(221,221,221)" fill-opacity="1.000000" />
<polygon points="47.613765,49.254424 23.219703,52.458598 47.246912,50.965952 48.078815,51.599703 49.620943,52.471096 62.516253,65.471290 65.077318,43.877861 51.086443,12.014429 34.861708,20.532821 " fill="rgb(100,100,100)" fill-opacity="0.500000" />
</svg>
Add the attribute in the <svg>
element ( it's inherited by all child elements)
shape-rendering="crispEdges"
While from my short test Inkscape seems not to honor that, rsvg-convert does. For your Imagemagick setup, you should make sure it delegates to librsvg, not Inkscape.