PHPWord icon indicating copy to clipboard operation
PHPWord copied to clipboard

SVG image type support

Open echaconairlan opened this issue 6 years ago • 10 comments

Is there any workaround to add this support? I really need it for adding some highcharts graphs.

echaconairlan avatar Oct 24 '19 08:10 echaconairlan

any news regarding this feature request ? Thanks in advance

simogeo avatar May 04 '24 10:05 simogeo

I briefly looked at this today together with a collegae.

We found out that:

  • SVG data should be written to Word in a different way than a PNG or a JPEG:
    • PNG and JPEG are written in \PhpOffice\PhpWord\Writer\Word2007\Element\Image and are using (among more) a XML tag called 'w:pict'.
    • SVG needs to start with a XML tag called 'w:drawing'. This makes them closer related to \PhpOffice\PhpWord\Writer\Word2007\Element\Chart than to \PhpOffice\PhpWord\Writer\Word2007\Element\Image.
  • SVG data shouldn't be written to the Word XML as is. Instead, in the Word XML a reference (r:id) needs to be used.
  • \PhpOffice\PhpWord\Element\Image::checkImage() uses PHP image functions that don't work for SVG images, like getimagesizefromstring(). image_type_to_mime_type(), used to determine the mime type of the image, has no listing for SVG, see https://www.php.net/image_type_to_mime_type.
  • The mimetype for SVG should be 'image/svg+xml'.
  • In Word's openXML documentation we saw that we would at least need to use a XML tag called 'asvg:svgBlip'. See https://learn.microsoft.com/en-us/dotnet/api/documentformat.openxml.linq.asvg.svgblip?view=openxml-3.0.1#documentformat-openxml-linq-asvg-svgblip
  • We found a code example here for generating Word XML for SVG images: https://www.docx4java.org/forums/docx-java-f6/add-svg-to-document-t2927.html#p10155. It is in Java, but it does give an idea about which XML tags should be used to write the data.
  • By calling the getData() method on a \PhpOffice\PhpWord\Shared\XMLWriter object you can get an idea about what Word XML gets produced. I temporarily added var_dump($xmlWriter->getData());die(); to \PhpOffice\PhpWord\Writer\Word2007\Element\Image::writeImage() to see what was getting outputted.

That's how far as we got today.

Todo:

  • I think that in phpword/src/PhpWord/Writer/Word2007/Element we would need to add a new class called SvgImage. The code from \PhpOffice\PhpWord\Writer\Word2007\Element\Chart could probably be used as a starting point for this class.
  • Likewise, I think that we need to have a SvgImage class in phpword/src/PhpWord/Element so a svg image can be added by calling $phpWord->addSvgImage().

MegaChriz avatar Jun 14 '24 14:06 MegaChriz

Hi @simogeo @MegaChriz @echaconairlan , could you give me a sample file with a svg image, please ?

Progi1984 avatar Aug 10 '24 13:08 Progi1984

I found a few SVG images: waardering-82 ukkie tux Piramade groen

MegaChriz avatar Aug 10 '24 14:08 MegaChriz

Hm, apparently GitHub transforms them. Try again: svgs.zip

MegaChriz avatar Aug 10 '24 14:08 MegaChriz

Not a Svg file but a docx with a svg image embed.

Progi1984 avatar Aug 10 '24 14:08 Progi1984

I haven't one ready right now, because I don't have access to Word currently. Maybe in a few days.

MegaChriz avatar Aug 10 '24 14:08 MegaChriz

Thanks 😊

Progi1984 avatar Aug 10 '24 14:08 Progi1984

docxs-with-svg.zip Here are a few docx-files with a SVG in them. There is one with a highchart graph in it, and two with a simpler looking SVG file.

MegaChriz avatar Aug 12 '24 07:08 MegaChriz

Thanks to all of you. I also provide a doc sample with EPS image embedded. It should not be so different from SVG file and also interesting to implement.

embedded-EPS-file.docx

thanks @Progi1984 and @MegaChriz

simogeo avatar Aug 12 '24 10:08 simogeo