Page 1 of 1
Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-19T08:59:30-07:00
by ertank
Hello,
I am using ImageMagick 7.0.8-0 Q16 x86 2018-06-12 on a Windows 10 64bit.
I have following transparent images:
design1:
https://imgur.com/a/bSspnOZ
design2:
https://imgur.com/a/Jj28fcd
I use following command line to merge them together:
Code: Select all
magick design2.png -draw "image over 0,0 0,0 'design1.png'" result.png
result.png is fine. Now, I would like to do two more things:
1- Draw an outline background to result.png image. It should look like following when done:
https://imgur.com/a/rQms94t (outline is not fine in terms of following main lines in parallel)
2- Add a border to outline with adjustable thickness and color. That border line should also have anti-aliasing on the transparent side:
https://imgur.com/a/i4jbnmc
Samples may not be what I would like to have in the final image, but they should pretty much give an idea of what is needed.
I appreciate any help.
Thanks & regards,
-Ertan
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-19T10:17:19-07:00
by fmw42
This method works for me on IM 7.0.8.1 Q16 Mac OSX Sierra, but is slow due to the size of the kernel and your image sizes.
Unix:
Code: Select all
magick design1.png design2.png -compose over -composite \
\( +clone -alpha extract -morphology edgeout octagon:40 -alpha copy \) \
-compose over -composite \
\( +clone -alpha extract -morphology edgeout octagon:30 -negate -background red -alpha shape \) \
-compose over -composite \
sports_outline.png
Windows:
Code: Select all
magick design1.png design2.png -compose over -composite ^
( +clone -alpha extract -morphology edgeout octagon:40 -alpha copy ) ^
-compose over -composite ^
( +clone -alpha extract -morphology edgeout octagon:30 -negate -background red -alpha shape ) ^
-compose over -composite ^
sports_outline.png
Adjust the octagon:X values as desired for thickness.
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-19T10:39:07-07:00
by ertank
It is really taking time to finish the job. Is there any "threading" ability in ImageMagick? Just to make it faster.
Other than this, I have two questions on result image.
1- I see some distance between white and red areas. That distance is saved as a transparent area:
https://imgur.com/a/d0vgSDF
Sample image I have does not have such empty area:
https://imgur.com/a/4Hh8Bpd
Is it possible to fine tune that?
2- It is requested to have anti-aliasing on the final red outline. I used below command on generated image. Putting aside above problem, it is seemingly working. Just would like to be sure that is the way to go?
Code: Select all
magick sports_outline.png -channel A -blur 1x65000 -level 50x100% -channel rgba sports_aliased.png
Thanks for the help.
Regards,
Ertan
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-19T11:50:00-07:00
by fmw42
Using disk rather than octagon will produce a much smoother outline. You can fill the gaps with -morphology close at the end. This work for me in Unix syntax. Here is the Windows code:
Code: Select all
magick design1.png design2.png -compose over -composite ^
( +clone -alpha extract -morphology edgeout disk:40 -alpha copy ) ^
-compose over -composite ^
( +clone -alpha extract -morphology edgeout disk:30 -negate -background red -alpha shape ) ^
-compose over -composite ^
-channel rgba -morphology close disk:2 ^
sports_outline2.png
Add any further antialiasing via -blur as you have done already, if desired.
You could try taking the alpha channel, blurring it and then thresholding it. Then subtract the original alpha channel from it to make the outline in place of the -morphology edge out. That might be faster.
EDIT:
Yes, it is much faster, but is not as rounded.
Unix:
Code: Select all
magick design1.png design2.png -compose over -composite \
\( +clone -alpha extract \( +clone -blur 0x10 -threshold 0 \) -compose minus -composite -alpha copy \) \
-compose over -composite \
\( +clone -alpha extract \( +clone -blur 0x10 -threshold 0 \) -compose minus -composite -negate -background red -alpha shape \) \
-compose over -composite \
sports_outline3.png
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-19T14:16:24-07:00
by ertank
fmw42 wrote: ↑2018-06-19T11:50:00-07:00
Using disk rather than octagon will produce a much smoother outline. You can fill the gaps with -morphology close at the end.
How long it takes to complete on your system? I am still waiting it to complete and I forgot for how long it is running.
Edit:
It took about half an hour on my system.
As my knowledge about images is limited. That kind of images, can I use Q8 version (instead of Q16) and have identical output?
That's what comes in my mind to gain speed.
Thanks.
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-20T06:17:24-07:00
by ertank
I am also requested following, if possible, to add double outline?
Thanks.
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-20T09:19:46-07:00
by fmw42
On my INTEL Mac Mini (2 core) OSX Sierra (8G ram) and ImageMagick 6.9.10.1 Q16, the first script took 2m 55s. The second script took 12 s.
To add another color band, just duplicated the two lines for the red, such as
Code: Select all
magick design1.png design2.png -compose over -composite ^
( +clone -alpha extract -morphology edgeout disk:40 -alpha copy ) ^
-compose over -composite ^
( +clone -alpha extract -morphology edgeout disk:30 -negate -background red -alpha shape ) ^
-compose over -composite ^
( +clone -alpha extract -morphology edgeout disk:20 -negate -background blue -alpha shape ) ^
-compose over -composite ^
-channel rgba -morphology close disk:2 ^
sports_outline2.png
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-20T10:04:45-07:00
by ertank
fmw42 wrote: ↑2018-06-20T09:19:46-07:00
On my INTEL Mac Mini (2 core) OSX Sierra (8G ram) and ImageMagick 6.9.10.1 Q16, the first script took 2m 55s. The second script took 12 s.
What maybe a reason for me to have processing about 20 minutes (octagon) and an hour (disk)?
I'm using static executable. Can it be?
Intel cpu i7 7700k (8 cores), 8gb ram, windows 10 64bit
Thanks.
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-20T10:36:29-07:00
by fmw42
I have no idea? What do you get from convert -version? Does it have OpenMP enabled? Are you on a hosted server that may have put limits on your policy.xml file?
The first one I mentioned was using the disk and the second one was using -blur.
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-20T10:44:55-07:00
by ertank
I do not have OpenMP enabled as far as I understand from below output. My system also has SSD (Samsung 950 NVMe) and slowness cannot be because of a HDD. I see RAM usage going up to 500MB during processing. Starting around 100MB and slowly increasing.
Code: Select all
Version: ImageMagick 7.0.8-0 Q16 x86 2018-06-12 http://www.imagemagick.org
Copyright: Copyright (C) 1999-2018 ImageMagick Studio LLC
License: http://www.imagemagick.org/script/license.php
Visual C++: 180040629
Features: Cipher DPC HDRI
Delegates (built-in): bzlib cairo flif freetype gslib heic jng jp2 jpeg lcms lqr lzma openexr pangocairo png ps raw rsvg tiff webp xml zlib
Very strange. I would love to get these commands processed in 3 minutes than 1 hour of course. I read somewhere that I can generate verbose log for debugging purposes. I do not know exact usage myself.
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-20T11:21:32-07:00
by fmw42
Your version of ImageMagick does not include OpenMP, which allows multi-threading if you have more cores. My systems had a SSD also. I was actually processing with 7.0.8.1 Q16 HDRI. I would suggest you check your policy.xml file. or just do
though that may not actually list your policy if there are no restrictions.
Add -verbose to the command right after magick, if you want to see the verbose information about what is happening from the commands.
Re: Merging two transparent png images AND drawing an outline around them
Posted: 2018-06-20T12:08:59-07:00
by ertank
There was no policies listed.
I am developing an application. My application is using ImageMagick (IM) in the background. My EXE was 32bits and I did install 32bit version of IM on my system. x86 platform download's of IM seemingly does not have OpenMP support included.
I switched my application to be 64bits, also installed 64bit version of IM. That version has OpenMP support built in.
Code: Select all
Version: ImageMagick 7.0.8-2 Q16 x64 2018-06-18 http://www.imagemagick.org
Copyright: Copyright (C) 1999-2018 ImageMagick Studio LLC
License: http://www.imagemagick.org/script/license.php
Visual C++: 180040629
Features: Cipher DPC Modules OpenMP
Delegates (built-in): bzlib cairo flif freetype gslib heic jng jp2 jpeg lcms lqr lzma openexr pangocairo png ps raw rsvg tiff webp xml zlib
That fixed my problem of slowness. Now, when my application run IM (disk version of above commands) it takes 2min 45 seconds with my application user interface overhead.
Thank you.