Combine similar colors when converting
Combine similar colors when converting
Hey Guys,
So I'm developing an app that lets users design tee shirts. They have the option to upload an image and use it in their designs. However they are charged on a per color used basis as the printing method is screen printing which requires a separate screen for each color in a design which can become labor intensive.
So I'm looking for a way to take an image and convert visually close or similar colors into one color up to a max of 8 colors.
I've tried a bunch of different commands to try and achieve this but haven't been able to yet.
I appreciate any advice.
Thanks
So I'm developing an app that lets users design tee shirts. They have the option to upload an image and use it in their designs. However they are charged on a per color used basis as the printing method is screen printing which requires a separate screen for each color in a design which can become labor intensive.
So I'm looking for a way to take an image and convert visually close or similar colors into one color up to a max of 8 colors.
I've tried a bunch of different commands to try and achieve this but haven't been able to yet.
I appreciate any advice.
Thanks
Re: Combine similar colors when converting
Thanks for the info. I tried that out and its close but it doesn't seem to be combing closely related colors.
I tried it on this image:
https://www.dropbox.com/s/szrynqst0w7ze ... n.png?dl=0
And after processing I was left with these colors
0: {red: 255, green: 255, blue: 255, alpha: 127}
1: {red: 15, green: 3, blue: 78, alpha: 0}
2: {red: 31, green: 6, blue: 73, alpha: 0}
3: {red: 20, green: 4, blue: 77, alpha: 0}
4: {red: 178, green: 32, blue: 23, alpha: 0}
5: {red: 172, green: 204, blue: 233, alpha: 0}
I would like it to leave only 4 colors. The transparent white, the red, dark blue and light blue.
This is just an example, other images may have more or less colors.
- fmw42
- Posts: 25562
- Joined: 2007-07-02T17:14:51-07:00
- Authentication code: 1152
- Location: Sunnyvale, California, USA
Re: Combine similar colors when converting
What was your exact command? Did you upload the correct image? I get the following with non-binary alpha values in your image on my Mac OSX with IM 6.9.0.2.
# ImageMagick pixel enumeration: 4,1,255,srgba
0,0: (16,3,78,0.960189) #10034EF5 srgba(16,3,78,0.960189)
1,0: (178,36,29,0.997299) #B2241DFE srgba(178,36,29,0.997299)
2,0: (21,4,76,0.372274) #15044C5F srgba(21,4,76,0.372274)
3,0: (20,4,75,0.0039826) #14044B01 srgba(20,4,75,0.0039826)
If I binarize the alpha channel, then I get
# ImageMagick pixel enumeration: 4,1,255,srgba
0,0: (93,17,52,1) #5D1134 srgba(93,17,52,1)
1,0: (15,3,78,1) #0F034E srgba(15,3,78,1)
2,0: (178,36,29,1) #B2241D srgba(178,36,29,1)
3,0: (0,0,0,0) #00000000 none
This shows that your background is black not white. So I question if you uploaded the correct file?
What version of IM are you using and what platform?
Code: Select all
convert design.png +dither -colors 4 -unique-colors txt:
0,0: (16,3,78,0.960189) #10034EF5 srgba(16,3,78,0.960189)
1,0: (178,36,29,0.997299) #B2241DFE srgba(178,36,29,0.997299)
2,0: (21,4,76,0.372274) #15044C5F srgba(21,4,76,0.372274)
3,0: (20,4,75,0.0039826) #14044B01 srgba(20,4,75,0.0039826)
If I binarize the alpha channel, then I get
Code: Select all
convert design.png -channel alpha -threshold 50% +channel +dither -colors 4 -unique-colors txt:
0,0: (93,17,52,1) #5D1134 srgba(93,17,52,1)
1,0: (15,3,78,1) #0F034E srgba(15,3,78,1)
2,0: (178,36,29,1) #B2241D srgba(178,36,29,1)
3,0: (0,0,0,0) #00000000 none
This shows that your background is black not white. So I question if you uploaded the correct file?
What version of IM are you using and what platform?
Re: Combine similar colors when converting
This was my exact command.
Heres my version:
And I'm running on Ubuntu Linux version 14.04.
Code: Select all
convert img.png +dither -colors 8 PNG8:img_processed.png
Code: Select all
Version: ImageMagick 6.7.7-10 2014-03-06 Q16 http://www.imagemagick.org
Copyright: Copyright (C) 1999-2012 ImageMagick Studio LLC
Features: OpenMP
- fmw42
- Posts: 25562
- Joined: 2007-07-02T17:14:51-07:00
- Authentication code: 1152
- Location: Sunnyvale, California, USA
Re: Combine similar colors when converting
That is a very old version of IM (over 120 versions old). Can you upgrade? Also it makes not sense to expect alpha 127 for white. Your background is black and the alpha channel is mostly white and black with some between colors. Did you upload the same fine you processed? The one you say you used is img.png but the one uploaded is design.png.
Re: Combine similar colors when converting
That is the version that was automatically installed when I used the Ubuntu package manager to install it.fmw42 wrote:That is a very old version of IM (over 120 versions old). Can you upgrade? Also it makes not sense to expect alpha 127 for white. Your background is black and the alpha channel is mostly white and black with some between colors. Did you upload the same fine you processed? The one you say you used is img.png but the one uploaded is design.png.
I'm also sure that it was the correct image. The colors I referenced in my original post were pulled via PHP so they aren't the exact same.
Everything seems to work for the most part but the issue is when a person uploads an image to be processed I don't know how many visual colors may be in their image. So I can't tell Image Magick how many colors to expect.
So when I tell it to use a max of 8 colors. like so.
Code: Select all
convert design.png +dither -colors 8 -unique-colors txt:
Re: Combine similar colors when converting
You might be able to use -format with %k to find the amount of unique colours which you can then use as a variable in your php code to set the -colors variable. You could use it to skip that part entirely if there are only 4 unique colours in the original image.
- fmw42
- Posts: 25562
- Joined: 2007-07-02T17:14:51-07:00
- Authentication code: 1152
- Location: Sunnyvale, California, USA
Re: Combine similar colors when converting
-colors is a very complex algorithm that tries to merge similar colors. I do not know any way for it to automatically find the number of colors that you want it to have. You can reduce the number of colors to more than you want, then get the list of colors and merge them further after analysis of the list of colors and how close those colors are to each other. But you would have to write a script to process the list of colors and do the merge. You can also try using -connected-components to merge colors after you have reduced the colors down by -colors. See viewtopic.php?f=4&t=26493
I also have a bash unix shell script, kmeans, that will further refine the selected colors. See my scripts at the link below.
I also have a bash unix shell script, kmeans, that will further refine the selected colors. See my scripts at the link below.
-
- Posts: 12159
- Joined: 2010-01-23T23:01:33-07:00
- Authentication code: 1151
- Location: England, UK
Re: Combine similar colors when converting
A scripting technique you may find useful:
The least common colour is #B32017BB, with only 0.12% of the pixels being this colour. Your script decides this is too few to bother with. Make an image with 7 pixels, being the other colours. Map the input to these colours, repeat the histogram, and again find the least common colour. Repeat until all colours are used for at least 1% (or other proportion) of the pixels.
A similar technique is to try "-colors 8" then "-colors 7" and so on, until all colours are used for at least 1% (or other proportion) of the pixels.
EDIT: Of course, add "+dither" to the above, if you want.
Code: Select all
convert design.png -colors 8 -format "%c" histogram:info:
9760: ( 15, 3, 78,161) #0F034EA1 srgba(15,3,78,0.630106)
169748: ( 15, 3, 78,253) #0F034EFD srgba(15,3,78,0.990387)
554372: ( 20, 4, 75, 1) #14044B01 srgba(20,4,75,0.00399786)
11103: ( 21, 4, 76, 95) #15044C5F srgba(21,4,76,0.372274)
1894: ( 54, 10, 65,215) #360A41D7 srgba(54,10,65,0.843687)
1363: (172,204,233,253) #ACCCE9FD srgba(172,204,233,0.992752)
50153: (178, 32, 23,254) #B22017FE srgba(178,32,23,0.997787)
983: (179, 32, 23,187) #B32017BB srgba(179,32,23,0.732601)
A similar technique is to try "-colors 8" then "-colors 7" and so on, until all colours are used for at least 1% (or other proportion) of the pixels.
EDIT: Of course, add "+dither" to the above, if you want.
snibgo's IM pages: im.snibgo.com
- anthony
- Posts: 8883
- Joined: 2004-05-31T19:27:03-07:00
- Authentication code: 8675308
- Location: Brisbane, Australia
Re: Combine similar colors when converting
As you are screen printing you may like to use -remap to specify the colors your want pixels mapped to.
http://www.imagemagick.org/Usage/quantize/#remap
http://www.imagemagick.org/Usage/quantize/#remap
Anthony Thyssen -- Webmaster for ImageMagick Example Pages
https://imagemagick.org/Usage/
https://imagemagick.org/Usage/