SVG stroke opacity

[jorlando]

Greetings, Does IM recognize SVG stroke opacity? I'm using 6.4.1

When I load an SVG created by Inkscape, all strokes are fully opaque even when set otherwise.

Thx
~Jeff

[anthony]

According to my test example in IM examples, YES...

It is the very first example given for trialling various MVG settings.
http://www.imagemagick.org/Usage/draw/#mvg_settings

[jorlando]

Thanks Anthony, Can't get it here with 6.4.1

Here is the file created by Inkscape 0.46 http://www.interactimage.com/php/svgtemp/mysvg.svg which looks ok in the browser.

Going top to bottom, each line has stroke-opacity setting of 1.0, 0.8, 0.6, and 0.3

When loaded into 6.4.1 with -background none -matte and output to .PNG or .GIF , a transparent image results with all 4 lines fully opaque.

I don't have access to a higher version of IM to try. Can you please try loading this to see what you get?

GIF does not support semi-transparency so that is out, immediately.

Code: Select all

convert -background none mysvg.svg mysvg.png

worked for me.

[jorlando]

Just saw the reply edited into my post. Thanks.

Must be the version of IM I'm using as it won't work here without tweaking. Here is something else I noticed

In the XML, the stroke-opacity style is always set to 1 for each path in the file. The opacity style for the same path is set to the different levels of alpha.

If I manually change the stroke-opacity to the desired alpha level (same as the opacity style), then 6.4.1 displays the expected semi-transparency.

I'm hoping that a)All this stuff works in 6.4.8-4 and b)my hosting company will install it as they said they would. Any ETA on release?

My Flash to IM widget is ready to go once IM is able to handle the file (or I write my own converter) . Heres the demo site: http://www.interactimage.com/4alpha1_index.php (after generating an image click the freehand draw button on the toolbar). Note that both the fill and opacity issues are evident in the demo

~Jeff

[anthony]

Hmmm... one point I did not think off. I am use the RSVG librayr

not the build in MVG convertor. See Im Examples, SVG
http://www.imagemagick.org/Usage/draw/#svg

[jorlando]

Figured out a solution!

I use php to change the opacity setting to zero. I send the SVG to the server via AJAX and modify the XML along the way.

From:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480 320"><g fill="none" stroke-miterlimit="6" stroke-linecap="round"><path d="M 190 76 ... 0 l -1 0 l" opacity="1" stroke="rgb(0,166,79)" stroke-width="2"/></g></svg>

To:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480 320"><g fill="none" stroke-miterlimit="6" stroke-linecap="round"><path d="M 190 76 ... 0 l -1 0 l" opacity="0" stroke="rgb(0,166,79)" stroke-width="2"/></g></svg>

It was trial and error discovery. I'm not sure whats going on.

The demo site is now working correctly. I'll see if I can figure out a way to get the stroke-opactity to work next.

update: yes there is a way. I can do it manually by using rgba to specify the color. My Flash Widget outputs the alpha value when stroke opacity is set. Now I hafta go figure out a regular expression to substitute the rgba into the rgb automatically... Ohhh, I feel a headache coming on.

~Jeff