PHP Convert SVG To Jpg Missing Elements

Question

I am using php imagemagic to convert svg to jpg and i use the below command for the conversion.

convert -density 250 source.svg target.jpg

I can able to convert svg to jpg successfully but some elements in svg are missing. Please check below example

Input SVG

Output JPG

Here you can clearly see that the light grey shades on the sides are replaced with white color. Can someone let me know how to fix this.

FYI here is the link to download the actual SVG

https://drive.google.com/file/d/1vC5yaXds7ogcsTWjaDzkXZZFyKzLCsgf/view?usp=sharing

Kindly check another stackoverflow post [SVG To JPEG](https://stackoverflow.com/questions/10289686/rendering-an-svg-file-to-a-png-or-jpeg-in-php) here — IshaniNet, Sep 11 '18 at 12:38
Not that it helps you, but this works fine on my machine: `Version: ImageMagick 6.9.7-4 Q16 x86_64 20170114 http://www.imagemagick.org` — Sean Bright, Sep 11 '18 at 14:05
@emcconville I tried with ImageMagic 7.0.8-11 but still same issue — Aravinthan M, Sep 12 '18 at 07:11

fmw42 · Answer 1 · 2018-09-11T17:21:51.593

1

Which SVG renderer are you using? It could be the internal Imagemagick MSVG/XML, the RSVG delegate or Inkscape (in order of increasing functionality). You can find out by adding -verbose to your command line.

convert -verbose -density 250 source.svg target.jpg

I used Imagemagick 6.9.10.11 Q16 Mac OSX with its internal MSVG/XML renderer, RSVG 2.42.2_2 and Inkscape 0.92.3_4. All three produced different results. The RSVG was the worst. The Inkscape was the best. Here are my results using your command.

convert -density 250 MSVG:source.svg target_msvg.jpg

convert -density 250 RSVG:source.svg target_rsvg.jpg

convert -density 250 source.svg target_inkscape.jpg

Usually RSVG does better than Imagemagick's MSVG. But here it seems to do worse. It could be due to the way I modified my delegates.xml file in order to be able to run RSVG while Inkscape was installed. Also the MSVG renderer has been improved over the last few releases. So an older version may not produce as good of a result.

edited Sep 11 '18 at 17:21

answered Sep 11 '18 at 17:15

fmw42

46,825
10
62
80

The verbose command "convert -verbose -density 250 source.svg target.jpg" resulted below. mvg:/tmp/magick-LSfBdmJW=>/tmp/magick-LSfBdmJW MVG 1246x1076 1246x1076+0+0 16-bit DirectClass 15.5KB 0.430u 0:00.439 /var/www/html/img/simulator/tmp/575562/sourceImageTopFront.svg SVG 1246x1076 1246x1076+0+0 16-bit DirectClass 15.5KB 0.000u 0:00.000 /var/www/html/img/simulator/tmp/575562/sourceImageTopFront.svg=>/var/www/html/img/simulator/tmp/575562/sourceImageTopFront.jpg SVG 1246x1076 1246x1076+0+0 16-bit DirectClass 106KB 0.020u 0:00.019 – Aravinthan M Sep 12 '18 at 06:26
convert -list format | grep SVG This command resulted below MSVG -w+ ImageMagick's own SVG internal renderer SVG -w+ Scalable Vector Graphics SVGZ -w+ Compressed Scalable Vector Graphics – Aravinthan M Sep 12 '18 at 06:26
Still am facing same issue. FYI i am using ImageMagic 7.0.8-11 – Aravinthan M Sep 12 '18 at 06:27
Install Inkscape and you should get what I have above for the Inkscape result, if that is a correct result. – fmw42 Sep 12 '18 at 16:35

score 0 · Accepted Answer · answered Sep 12 '18 at 10:55

0

Finally I found a workaround for this. I converted svg to canvas image (base64 format) via javascript and through php i have converted the base64 data to jpg image.

answered Sep 12 '18 at 10:55

Aravinthan M

835
1
9
24

PHP Convert SVG To Jpg Missing Elements

2 Answers2