flother / spreet

Create a spritesheet from a set of SVG images
MIT License
94 stars 7 forks source link

The SDF icons seem to lack antialiasing #80

Open bchapuis opened 9 months ago

bchapuis commented 9 months ago

In the following example, the icons generated with spritezero seem to apply some antialiasing whereas the spreet one does not:

spritezero

spreet

The svg file used to generate the veterinary icon is located here:

https://github.com/apache/incubator-baremaps/blob/main/basemap/assets/icons/veterinary.svg

The following README contains instructions to generate a sprite that contains most openstreetmap-carto icons:

https://github.com/apache/incubator-baremaps/blob/main/basemap/assets/README.md

All the icons seem to be affected by this issue.

Shikakka commented 8 months ago

The problem seems to be the lack of "blurring" the svg.

This is the sprite generated by Elastic/Spritezero image

And the sprite generated by Spreet: image

It lacks the "blur" that causes Mapbox to render it without any antialiasing.

CommanderStorm commented 1 month ago

And the sprite generated by Spreet

@Shikakka just to make sure. Have you used

Your output suspiciously does not quite look like an sdf to me..

jessekrubin commented 3 weeks ago

I am experiencing the same problem, however I am using deckgl to render the sdf icons.

I also see adjacent icons bleeding into each other (might be a deck problem) -- for this I think buffering/bordering each icon by 1-2 pixels would fix my issue. How involved would it be to add a cli flag for bordering icons? (can pr if I find time)