search

fogleman / primitive

Reproducing images with geometric primitives.
https://primitive.lol/
MIT License
12.35k stars 608 forks source link

Feature request: transparent background #54

Open Xe opened 6 years ago

Xe commented 6 years ago

Hi,

I want to use this to generate character sprites for a video game idea. Is there a way to make primitive work with a fully transparent background?

Thanks,

fogleman commented 6 years ago

Are you using the Mac app? The command line version should already support this.

paambaati commented 6 years ago

@fogleman I use the command line version, but I'm having trouble getting an image with a transparent background. I use a PNG with large areas of transparency, but all of them come out black when passed through primitive.

EDIT: Here's an image you could try - https://i.imgur.com/pbVyVje.png

I tried generating an SVG out of it with the command —

primitive -i test.png -o test.svg -n 100 -m 0 -bg #ffffff

The generated image looks like this - http://svgshare.com/i/3sa.svg

kanzelm3 commented 6 years ago

I am also running into this issue. Transparent regions are output as black.

imtoori commented 6 years ago

@paambaati try this command:

primitive -i test.png -o test.svg -n 100 -m 0 -bg #ffffff00

Reading the code in color.go I found out that the input color is intended as one of this:

AA is the alpha channel value, so if you want it to be transparent just set it to 00

paambaati commented 6 years ago

@Salvatore-Giordano Thanks a ton, that works!

globalcitizen commented 6 years ago

Still doesn't work for me.

OSX. Input...

beers-color-transparent

Command: ~/code/gopath/bin/primitive -i beers-color-transparent.png -o beers-color-transparent.svg -bg '#ffffff00' -n 500

Output (after conversion to jpg with convert beers-color-transparent.svg svg.jpg)... svg

Alternative output if running ~/code/gopath/bin/primitive -i beers-color-transparent.png -o beers-color-transparent-output.png -bg '#ffffff00' -n 500 to directly generate a PNG... beers-color-transparent-output

Then I realised I had an old version...

$ md5 ~/code/gopath/bin/primitive MD5 (/Users/user/code/gopath/bin/primitive) = 4913fcd77601bfc67dbaa7dfe68f0e54

So I updated...

$ md5 ~/code/gopath/bin/primitive MD5 (/Users/user/code/gopath/bin/primitive) = f3163eec91c5575fb24b547d2279e887

... but no difference observed. I am getting neater backgrounds (at least they are white now!) but 100% opaque ... despite testing both SVG and PNG output. For example...

$ ~/code/gopath/bin/primitive -i beers-color-transparent.png -o beers-color-transparent.svg -m 0 -bg '#ffffff00' -n 500

... zero transparency in SVG, white visible background. Reference output after convert beers-color-transparent.svg svg2.jpg (because Github doesn't support SVG upload)...

svg2

... which is a pretty crappy render (it looks better in Firefox)...

screen shot 2017-11-30 at 08 09 30

... but anyway still certainly lacks transparency (tried: Illustrator, Firefox, OSX Finder preview, GIMP).

fogleman commented 6 years ago

@globalcitizen JPG doesn't do transparency, you need to use PNG. This worked for me on latest master:

go run main.go -i test.png -o out.png -n 100 -bg ffffff00 -v

out

globalcitizen commented 6 years ago

Thanks.

Yes, I was just uploading JPG because Github doesn't support upload of SVG.

Indeed, that command line does now work for me. No idea what changed there. Weird. Perhaps it is the number of polygons - I note you only used 100 and I was using 500 - as the number increases transparency perhaps tends towards opaque? Perhaps if I set a higher opacity like 100% combined with a higher number of polygons it will work better? Let me test that theory...

Nope. Area 51 has eaten my shell. Thanks 👍