dompdf / dompdf

HTML to PDF converter for PHP

Home Page:https://dompdf.github.io/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Embedded SVG in HTML Capability

PhenX opened this issue · comments

Original author: mar (June 29, 2011 12:30:48)

What would you like dompdf to do:
Be able, like tcpdf, to render SVG tags into PDF

Do you have an example:
Using TCPDF
PHP Code http://www.tcpdf.org/examples/example_058.phps
PHP Code Execution http://www.tcpdf.org/examples/example_058.pdf

Original issue: http://code.google.com/p/dompdf/issues/detail?id=314

From fabien.menager on January 12, 2012 20:13:43
I would also add
http://www.godisaduck.com/svg2pdf_with_fpdf

From ger on September 28, 2012 10:22:10
why not using imagick to convert svg files in png format, as a quick workaround to this feature ?
I am using dompdf for several years now, i would be glad to contribute.

From mar on September 28, 2012 14:06:53
imagick certainly converts to PNG, but is a very basic convertion and no all hosting services provide it. In my case, my hosting provider refused to install needed addons for imagick to be able to convert SVG to PNG.

I have fixed this issue in my local. If there is anyone who needs this patch, please let me know

@oliverhuynh how have you gone about SVG support? We would be interested in knowing the details.

I'd be interested too. The easiest way to share your implementation would be for you to fork this repository and push your changes on it.

@oliverhuynh I totally agree, if you need help pushing to a Git clone, please tell us.

Hi guys,

DOMPDF can use PDFlib to build the PDF. My patch is updating the code with latest PDFLIB(9), adding SVG capacibility and so, the output PDF can embed SVG.

I can attach the patch here.

That's not going to be universal enough for the majority of users who, I suspect, use the CPDF back end. Still, it would be good to see the patch. We could conditionally add it for PDFLib users. We could also give some support to CPDF by converting to PNG using imagick/gmagick if installed.

Unfortunately, this doesn't really get us where we want to be. The closest I've seen to what we need is prawn-svg, but it's coded in Ruby. Everything I've seen coded in PHP relies on an external app/library.

@bsweeney I agree with you. But this patch may be a good start (even if it doesn't have all the "hard" code we would need).
@oliverhuynh can you send us the patch please ?

We could start a separate project like I did with php-font-lib, and get inspiration from fabric.js which includes a pretty good SVG parser + canvas renderer. PDFKit.js has also a part of what we want.
The PDF is basically like a Canvas, we already have a part of the methods required in Cpdf : line, curve, ellipse, text, transformations, etc. The "path" is still missing, but I think it's not really hard to add.
Something harder is integrating gradients, but still not impossible.

Hi guys including PhenX, :)

There is API in PDFLIB. My work is just implementing this API to DOMPDF. Not too much subliminal. Here it is. I can attach also the other patch to use with CPDF(using imagick). Btw, my editor erases blank spaces after each line so the patch is longer. Excuse me for this.
...
...
...
Oops, the patch is not able to be uploaded.
Try this link pls.http://media.jufist.org/oliver/svginpdflib.patch

@oliverhuynh what's the status of SVG support?

I cleaned up the patch file a bit, removing all whitespace changes. It currently looks like this:

20930f43c12f33e143fa306db5570742f715b9c3
 sites/all/libraries/dompdf/dompdf_config.inc.php   |   6 +-
 .../all/libraries/dompdf/include/functions.inc.php | 157 +++++++++++----------
 .../libraries/dompdf/include/image_cache.cls.php   |  45 +++---
 .../dompdf/include/pdflib_adapter.cls.php          |  78 ++++++----
 4 files changed, 157 insertions(+), 129 deletions(-)

diff --git a/sites/all/libraries/dompdf/dompdf_config.inc.php b/sites/all/libraries/dompdf/dompdf_config.inc.php
index 0c3f8e3..70c0686 100755
--- a/sites/all/libraries/dompdf/dompdf_config.inc.php
+++ b/sites/all/libraries/dompdf/dompdf_config.inc.php
@@ -4,7 +4,7 @@
  * @link    http://www.dompdf.com/
  * @author  Benj Carson <benjcarson@digitaljunkies.ca>
  * @author  Helmut Tischer <htischer@weihenstephan.org>
- * @author  Fabien M�nager <fabien.menager@gmail.com>
+ * @author  Fabien Ménager <fabien.menager@gmail.com>
  * @license http://www.gnu.org/copyleft/lesser.html GNU Lesser General Public License
  * @version $Id: dompdf_config.inc.php 468 2012-02-05 10:51:40Z fabien.menager $
  */
@@ -164,7 +164,7 @@ def("DOMPDF_ENABLE_FONTSUBSETTING", false);
  * @link http://www.ros.co.nz/pdf
  * @link http://www.php.net/image
  */
-def("DOMPDF_PDF_BACKEND", "CPDF");
+def("DOMPDF_PDF_BACKEND", "PDFLib");

 /**
  * PDFlib license key
@@ -285,7 +285,7 @@ def("DOMPDF_ENABLE_JAVASCRIPT", true);
  *
  * @var bool
  */
-def("DOMPDF_ENABLE_REMOTE", false);
+def("DOMPDF_ENABLE_REMOTE", TRUE);

 /**
  * The debug output log
diff --git a/sites/all/libraries/dompdf/include/functions.inc.php b/sites/all/libraries/dompdf/include/functions.inc.php
index 8e0ab02..335409a 100644
--- a/sites/all/libraries/dompdf/include/functions.inc.php
+++ b/sites/all/libraries/dompdf/include/functions.inc.php
@@ -12,6 +12,7 @@ if ( !defined('PHP_VERSION_ID') ) {
   $version = explode('.', PHP_VERSION);
   define('PHP_VERSION_ID', ($version[0] * 10000 + $version[1] * 100 + $version[2]));
 }
+define ('IMAGETYPE_SVG', 111);

 /**
  * Defined a constant if not already defined
@@ -744,36 +745,44 @@ function imagecreatefrombmp($filename) {

 /**
  * getimagesize doesn't give a good size for 32bit BMP image v5
  *
  * @param string $filename
  * @return array The same format as getimagesize($filename)
  */
 function dompdf_getimagesize($filename) {
   static $cache = array();

   if ( isset($cache[$filename]) ) {
     return $cache[$filename];
   }

   list($width, $height, $type) = getimagesize($filename);

   if ( $width == null || $height == null ) {
-    $data = file_get_contents($filename, null, null, 0, 26);
-
-    if ( substr($data, 0, 2) === "BM" ) {
+    $data = file_get_contents($filename, null, null, 0, 1024);
+    if (strstr($data, 'http://www.w3.org/2000/svg')) {
+      $type = IMAGETYPE_SVG;
+      $width = explode('width="', $data);
+      $width = explode('"', $width[1]);
+      $width = $width[0];
+      $height = explode('height="', $data);
+      $height = explode('"', $height[1]);
+      $height = $height[0];
+    }
+    elseif ( substr($data, 0, 2) === "BM" ) {
       $meta = unpack('vtype/Vfilesize/Vreserved/Voffset/Vheadersize/Vwidth/Vheight', $data);
       $width  = (int)$meta['width'];
       $height = (int)$meta['height'];
       $type   = IMAGETYPE_BMP;
     }
   }

   return $cache[$filename] = array($width, $height, $type);
 }

 /**
  * Converts a CMYK color to RGB
  *
  * @param float|float[] $c
  * @param float         $m
  * @param float         $y

diff --git a/sites/all/libraries/dompdf/include/image_cache.cls.php b/sites/all/libraries/dompdf/include/image_cache.cls.php
index 7d7e560..c8d7c69 100644
--- a/sites/all/libraries/dompdf/include/image_cache.cls.php
+++ b/sites/all/libraries/dompdf/include/image_cache.cls.php
@@ -49,28 +49,28 @@ class Image_Cache {
     $message = null;

     $remote = ($protocol && $protocol !== "file://") || ($parsed_url['protocol'] != "");

     $data_uri = strpos($parsed_url['protocol'], "data:") === 0;
     $full_url = null;
     $enable_remote = $dompdf->get_option("enable_remote");

     try {

       // Remote not allowed and is not DataURI
       if ( !$enable_remote && $remote && !$data_uri ) {
         throw new DOMPDF_Image_Exception("DOMPDF_ENABLE_REMOTE is set to FALSE");
-      }
      }
+
       // Remote allowed or DataURI
       else if ( $enable_remote && $remote || $data_uri ) {
         // Download remote files to a temporary directory
         $full_url = build_url($protocol, $host, $base_path, $url);

         // From cache
         if ( isset(self::$_cache[$full_url]) ) {
           $resolved_url = self::$_cache[$full_url];
         }
         // From remote
         else {
           $tmp_dir = $dompdf->get_option("temp_dir");
@@ -105,30 +105,30 @@ class Image_Cache {
           }
         }
       }

       // Not remote, local image
       else {
         $resolved_url = build_url($protocol, $host, $base_path, $url);
       }

       // Check if the local file is readable
       if ( !is_readable($resolved_url) || !filesize($resolved_url) ) {
         throw new DOMPDF_Image_Exception("Image not readable or empty");
       }

       // Check is the file is an image
       else {
         list($width, $height, $type) = dompdf_getimagesize($resolved_url);
         // Known image type
-        if ( $width && $height && in_array($type, array(IMAGETYPE_GIF, IMAGETYPE_PNG, IMAGETYPE_JPEG, IMAGETYPE_BMP)) ) {
+        if ( $width && $height && in_array($type, array(IMAGETYPE_GIF, IMAGETYPE_PNG, IMAGETYPE_JPEG, IMAGETYPE_BMP, IMAGETYPE_SVG)) ) {
           //Don't put replacement image into cache - otherwise it will be deleted on cache cleanup.
           //Only execute on successful caching of remote image.
           if ( $enable_remote && $remote || $data_uri ) {
             self::$_cache[$full_url] = $resolved_url;
           }
         }
         // Unknown image type
         else {
           throw new DOMPDF_Image_Exception("Image type unknown");
@@ -150,31 +150,32 @@ class Image_Cache {
    */
   static function clear() {
     if ( empty(self::$_cache) || DEBUGKEEPTEMP ) return;

     foreach ( self::$_cache as $file ) {
       if (DEBUGPNG) print "[clear unlink $file]";
       unlink($file);
     }

     self::$_cache = array();
   }

   static function detect_type($file) {
     list(, , $type) = dompdf_getimagesize($file);
     return $type;
   }

   static function type_to_ext($type) {
     $image_types = array(
       IMAGETYPE_GIF  => "gif",
       IMAGETYPE_PNG  => "png",
       IMAGETYPE_JPEG => "jpeg",
       IMAGETYPE_BMP  => "bmp",
+      IMAGETYPE_SVG => 'svg',
     );

     return (isset($image_types[$type]) ? $image_types[$type] : null);
   }

   static function is_broken($url) {
     return $url === self::$broken_image;
   }
diff --git a/sites/all/libraries/dompdf/include/pdflib_adapter.cls.php b/sites/all/libraries/dompdf/include/pdflib_adapter.cls.php
index 4bfe191..bf5251e 100644
--- a/sites/all/libraries/dompdf/include/pdflib_adapter.cls.php
+++ b/sites/all/libraries/dompdf/include/pdflib_adapter.cls.php
@@ -774,13 +774,24 @@ class PDFLib_Adapter implements Canvas {
     $img_ext  = Image_Cache::type_to_ext($img_type);

     if ( !isset($this->_imgs[$img_url]) ) {
-      $this->_imgs[$img_url] = $this->_pdf->load_image($img_ext, $img_url, "");
+      if ($img_ext == 'svg') {
+        $this->_imgs[$img_url] = $this->_pdf->load_graphics('auto', $img_url, "");
+      }
+      else {
+        $this->_imgs[$img_url] = $this->_pdf->load_image($img_ext, $img_url, "");
+      }
     }

     $img = $this->_imgs[$img_url];

     $y = $this->y($y) - $h;
-    $this->_pdf->fit_image($img, $x, $y, 'boxsize={'."$w $h".'} fitmethod=entire');
+    if ($img_ext == 'svg') {
+      $this->_pdf->fit_graphics($img, $x, $y, '');
+      $this->_pdf->close_graphics($img);
+    }
+    else {
+      $this->_pdf->fit_image($img, $x, $y, 'boxsize={'."$w $h".'} fitmethod=entire');
+    }
   }

   //........................................................................
@@ -788,7 +799,11 @@ class PDFLib_Adapter implements Canvas {
   function text($x, $y, $text, $font, $size, $color = array(0,0,0), $word_spacing = 0, $char_spacing = 0, $angle = 0) {
     $fh = $this->_load_font($font);

-    $this->_pdf->setfont($fh, $size);
+    // TODO: Raise warning
+    if ($fh != 0) {
+      $this->_pdf->setfont($fh, $size);
+    }
+
     $this->_set_fill_color($color);

     $y = $this->y($y) - Font_Metrics::get_font_height($font, $size);
@@ -875,6 +890,9 @@ class PDFLib_Adapter implements Canvas {
   function get_font_height($font, $size) {

     $fh = $this->_load_font($font);
+    if (empty($fh)) {
+      return 0;
+    }

     $this->_pdf->setfont($fh, $size);

I guess:

  1. The config changes could be ignored for review
  2. There is a change in the braces around a try/catch statement in image_cache.cls.php, I have no idea why it's there

I would love to have SVG support, so can the first phase possibly with only support for pdflib and if cpdf is ready, we get the support for that too?

@juriansluiman your patch got corrupted. I am getting this error when trying to apply it with git:

fatal: corrupt patch at line 133

Also the patch by @oliverhuynh doesn't apply anymore. I re-rolled it against the current master branch while removing all unnecessary whitespace changes:

diff --git a/dompdf_config.inc.php b/dompdf_config.inc.php
index 51fbcb5..a195cf9 100644
--- a/dompdf_config.inc.php
+++ b/dompdf_config.inc.php
@@ -160,7 +160,7 @@ def("DOMPDF_ENABLE_FONTSUBSETTING", false);
  * @link http://www.ros.co.nz/pdf
  * @link http://www.php.net/image
  */
-def("DOMPDF_PDF_BACKEND", "CPDF");
+def("DOMPDF_PDF_BACKEND", "PDFLib");

 /**
  * PDFlib license key
@@ -281,7 +281,7 @@ def("DOMPDF_ENABLE_JAVASCRIPT", true);
  *
  * @var bool
  */
-def("DOMPDF_ENABLE_REMOTE", false);
+def("DOMPDF_ENABLE_REMOTE", TRUE);

 /**
  * The debug output log
diff --git a/include/functions.inc.php b/include/functions.inc.php
index 8e0ab02..a304235 100644
--- a/include/functions.inc.php
+++ b/include/functions.inc.php
@@ -12,6 +12,7 @@ if ( !defined('PHP_VERSION_ID') ) {
   $version = explode('.', PHP_VERSION);
   define('PHP_VERSION_ID', ($version[0] * 10000 + $version[1] * 100 + $version[2]));
 }
+define ('IMAGETYPE_SVG', 111);

 /**
  * Defined a constant if not already defined
@@ -758,9 +759,17 @@ function dompdf_getimagesize($filename) {
   list($width, $height, $type) = getimagesize($filename);

   if ( $width == null || $height == null ) {
-    $data = file_get_contents($filename, null, null, 0, 26);
-    
-    if ( substr($data, 0, 2) === "BM" ) {
+    $data = file_get_contents($filename, null, null, 0, 1024);
+    if (strstr($data, 'http://www.w3.org/2000/svg')) {
+      $type = IMAGETYPE_SVG;
+      $width = explode('width="', $data);
+      $width = explode('"', $width[1]);
+      $width = $width[0];
+      $height = explode('height="', $data);
+      $height = explode('"', $height[1]);
+      $height = $height[0];
+    }
+    elseif ( substr($data, 0, 2) === "BM" ) {
       $meta = unpack('vtype/Vfilesize/Vreserved/Voffset/Vheadersize/Vwidth/Vheight', $data);
       $width  = (int)$meta['width'];
       $height = (int)$meta['height'];
diff --git a/include/image_cache.cls.php b/include/image_cache.cls.php
index 7d7e560..dfb00b9 100644
--- a/include/image_cache.cls.php
+++ b/include/image_cache.cls.php
@@ -121,7 +121,7 @@ class Image_Cache {
         list($width, $height, $type) = dompdf_getimagesize($resolved_url);

         // Known image type
-        if ( $width && $height && in_array($type, array(IMAGETYPE_GIF, IMAGETYPE_PNG, IMAGETYPE_JPEG, IMAGETYPE_BMP)) ) {
+        if ( $width && $height && in_array($type, array(IMAGETYPE_GIF, IMAGETYPE_PNG, IMAGETYPE_JPEG, IMAGETYPE_BMP, IMAGETYPE_SVG)) ) {
           //Don't put replacement image into cache - otherwise it will be deleted on cache cleanup.
           //Only execute on successful caching of remote image.
           if ( $enable_remote && $remote || $data_uri ) {
@@ -170,6 +170,7 @@ class Image_Cache {
       IMAGETYPE_PNG  => "png",
       IMAGETYPE_JPEG => "jpeg",
       IMAGETYPE_BMP  => "bmp",
+      IMAGETYPE_SVG => 'svg',
     );

     return (isset($image_types[$type]) ? $image_types[$type] : null);
diff --git a/include/pdflib_adapter.cls.php b/include/pdflib_adapter.cls.php
index 4bfe191..4787332 100644
--- a/include/pdflib_adapter.cls.php
+++ b/include/pdflib_adapter.cls.php
@@ -774,13 +774,24 @@ class PDFLib_Adapter implements Canvas {
     $img_ext  = Image_Cache::type_to_ext($img_type);

     if ( !isset($this->_imgs[$img_url]) ) {
-      $this->_imgs[$img_url] = $this->_pdf->load_image($img_ext, $img_url, "");
+      if ($img_ext == 'svg') {
+        $this->_imgs[$img_url] = $this->_pdf->load_graphics('auto', $img_url, "");
+      }
+      else {
+        $this->_imgs[$img_url] = $this->_pdf->load_image($img_ext, $img_url, "");
+      }
     }

     $img = $this->_imgs[$img_url];

     $y = $this->y($y) - $h;
-    $this->_pdf->fit_image($img, $x, $y, 'boxsize={'."$w $h".'} fitmethod=entire');
+    if ($img_ext == 'svg') {
+      $this->_pdf->fit_graphics($img, $x, $y, '');
+      $this->_pdf->close_graphics($img);
+    }
+    else {
+      $this->_pdf->fit_image($img, $x, $y, 'boxsize={'."$w $h".'} fitmethod=entire');
+    }
   }

   //........................................................................
@@ -788,7 +799,11 @@ class PDFLib_Adapter implements Canvas {
   function text($x, $y, $text, $font, $size, $color = array(0,0,0), $word_spacing = 0, $char_spacing = 0, $angle = 0) {
     $fh = $this->_load_font($font);

-    $this->_pdf->setfont($fh, $size);
+    // TODO: Raise warning
+    if ($fh != 0) {
+      $this->_pdf->setfont($fh, $size);
+    }
+
     $this->_set_fill_color($color);

     $y = $this->y($y) - Font_Metrics::get_font_height($font, $size);
@@ -875,6 +890,9 @@ class PDFLib_Adapter implements Canvas {
   function get_font_height($font, $size) {

     $fh = $this->_load_font($font);
+    if (empty($fh)) {
+      return 0;
+    }

     $this->_pdf->setfont($fh, $size);

When trying to embed a svg I get this error:

Image type unknown test.svg

@luksak can you attach the image here?

This is the source:

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="44px" height="44px" viewBox="0 0 44 44" enable-background="new 0 0 44 44" xml:space="preserve">
<image display="none" overflow="visible" opacity="0.2" width="44" height="44" xlink:href="cart.png" >
</image>
<rect fill="#66FF66" width="44" height="44"/>
<path fill="#FFFFFF" d="M17.5,30.8c-2.4,0-4.3,1.9-4.3,4.3s1.9,4.3,4.3,4.3s4.3-1.9,4.3-4.3S19.9,30.8,17.5,30.8z M30.6,30.8
    c-2.4,0-4.3,1.9-4.3,4.3s1.9,4.3,4.3,4.3s4.3-1.9,4.3-4.3S33,30.8,30.6,30.8z M37.1,9.1H13.3l-0.6-2.2c-0.4-2-1.7-2.2-2.2-2.2H6.7
    c-1.2,0-2.2,1-2.2,2.2s1,2.2,2.2,2.2h2.2l4.3,15.6c0.4,1.3,1.4,1.7,2.2,1.7h17.4c0.9,0,1.7-0.5,2.2-1.7l3.7-11.3
    c0.3-1.1,0.6-1.6,0.6-2.2C39.2,9.8,38,9.1,37.1,9.1z M31.2,22.1H17l-2.4-8.7h19.5L31.2,22.1z"/>
</svg>
``

The unknown error is because currently DOMPDF doesn't support SVG. You need to apply the patch (if possibile) to get a support only made by PDFLib.

Anyway, it would be cool to have it integrated also with ImageMagick/GraphicsMagick to get it just a little automated :)

I tried applying the patch, just to see if it would work and I'm afraid it still didn't let me put in SVG files. c'est la vie. But I'm going to add a +1 to request support of SVG files, inline or otherwise.

@DasUmlaut
You need to buy PDFLib for this to work...

@hakimio
Welp - I feel dumb now. Thanks for the help.
Still hoping that domPDF will support svg files via CPDF in the future.

+1 for SVG support..

For your information, I'm currently working on a library to parse and write SVG files onto PDF documents, it will be used by Dompdf.

Here is what will be possible : http://pxd.me/dompdf/dompdf_svg.pdf
A few fixes need to be done (like text rendering but it's getting good).

You can follow the project here : https://github.com/PhenX/php-svg-lib

That's really nice :)

Wow good job! Keep it up!

Thank you @PhenX! Hoping to see it inside DomPDF ASAP

Cool, but some example how to use your library will be very useful :-)

@PhenX Wicked! For my current project I have found a workaround using canvg, but that is less than optimal.

It's great to see so much support :)
There is a demo of the lib here : http://pxd.me/php-svg-lib/gui/debugger.php
I'll write some doc if I see interest in using it independently from Dompdf, but it's use will be transparent in Dompdf, and will be probably in 0.7 beta 2

I just committed SVG support, in the develop branch, in 7f89380
Please tell me what you think, but for any issues with SVG rendering itself, please post issues or pull request in the dedicated project here : https://github.com/PhenX/php-svg-lib

Have fun !

Thank you a dozen times over. I will have a look when the next time I step into the project I was working on.

Thank you @PhenX I'll try it the next days to see how far we can go.

Did you have the time to try it ?
Please note that for now, only SVG in tags are supported, what is the next priority for you ?

  • Embedded SVG
  • Better SVG support (gradients, clipping, etc)
  • CSS Backgrounds

Nope sorry I didn't had time but I'll do it maybe this weekend :) But I can say for sure that for me the priority is a Better SVG Support

Ok, could you send me examples of SVG files you'd like to use with dompdf ? I'll work on it wo it looks good.

Thank you @PhenX, the dev-develop branch works on my project!

I already have a minor issue with the SVG size, when a force the size on the img tag or in CSS class doesn't works.

Example:

IMAGE TAG:

(Dont worry, the image is white, looks like is nothing there)

CSS TAG:
#logo {
width: 126px;
height: 100px;
display: block;
max-width: 100%;
}

Hello everybody,

dompdf runs with me quite well. I have now only a problem if I want to integrate the SVG graphics, for example, with this line: <logo1><img src='img/logo_old.svg' alt=''></logo1> Could you help me what I need to do just to make the error Image type unknown
img / logo_old.svg no longer comes?

@mfeske are you using the develop branch? SVG support is not yet integrated into the downloadable archive or master branch.

@bsweeney i use master branch

@mfeske SVG support is only enabled on the develop branch. Easier than using git, though, would be to install with composer or download a nightly.

Hello bsweeney, thanks for the support. I had placed me a git version in a separate directory and have changed with git branch --set-upstream-to = origin / Develop Develop, there were then away at www all files. What should I do to in order to provide my current version with an update of the nightly without which I destroy my adjustments in the configuration, such as passwords, etc. fonts.

Has anyone any idea how I can perform the update without my existing settings to overwrite? I need the support SVG.

Please consider this as my personal help but STOP the offtopic, if you need help you definitely not need to ask it here. This ticket is about discussing the SVG code support and not how to implement it on your application.


Use composer to download the latest dev branch

composer require dompdf/dompdf:0.7.x@beta

then include this at the beginning of your main file application ( for eg. index.php )

// somewhere early in your project's loading, require the Composer autoloader
// see: http://getcomposer.org/doc/00-intro.md
require 'vendor/autoload.php';

finally

// reference the Dompdf namespace
use Dompdf\Dompdf;
use Dompdf\Options;

// instantiate and use the dompdf class
$dompdf = new Dompdf();
$dompdfOptions = new Options();

// see https://github.com/dompdf/dompdf/blob/develop/src/Options.php
$dompdfOptions->set( ... )

$dompdf->setOptions( $dompdfOptions )

// the rest of the code here

Hello julianxhokaxhiu sorry for offtopic. I will try this. Where is the correct Place to ask for help?

@juriansluiman This worked PERFECT for my proof-of-concept test. Thank you. Now if PDFLib wasn't so expensive... :-/ Would love to have the native support built into domPDF.

What's the current status of this? I installed composer require dompdf/dompdf:0.7.x@beta and I'm getting Image type unknown, along with broken_image.png :-(
Is this the expected behavior for now, or am I in the wrong branch?
Thanks!!

@ThomasLandauer should be working, how are you referencing the SVG document in your HTML? Was the php-svg-lilb dependency also installed?

I'm referencing it as image: < img src="test.svg" alt="" width="300" height="300" >
php-svg-lilb: I don't know - how can I check that?

@ThomasLandauer since you're using composer you should see it under vendor/phenx/php-svg-lib.

No, I have only php-font-lib there :-(

Ok, I'll validate that Composer is set up correctly. In the meantime you can grab a copy of php-svg-lib from the repository if you want to test out the SVG functionality.

I've downloaded the ZIP of php-svg-lib and extracted it into vendor/phenx/php-svg-lib. But I don't know how to register it, so that autoloader can find it :-( Please help!

The easiest path for now would be to manually reference the included autoloader: require_once 'vendor/PhenX/php-svg-lib/src/autoload.php';.

Well, with require_once __DIR__ . '/../../../vendor/phenx/php-svg-lib/src/autoload.php'; I can instantiate a class like that: $d = new \Svg\Document();, so the autoloading is working in principle. However, instead of the SVG it's still looking for broken_image.png :-(

Summarizing on the SVG status: The problems I experienced were just an installation issue (see #1132). SVG embedding is working out of the box - at least for me :-)
Note: If you use the sample SVG from @luksak for testing (see above), you need to delete the <image> tag ;-)

Following up on this question http://stackoverflow.com/questions/38919354/dompdf-base64-coded-svg-arent-rendered-correctly I'd like to find out which factors SVG support is depending on:

  1. Is this a dompdf issue or a CPDF issue?
  2. Does the embed method matter? I.e. <svg> or <img src="file.svg"> or <img src="data:image/svg+xml;base64,...">
  3. Does it matter if <?xml> tag and/or xmlns attribute is present?
  4. Does it matter which shapes (i.e. tags) the SVG uses?
  5. What is the worst case? Ugly rendering or not displaying at all?

Thanks!

Are you using PDFLib? That would be the issue. We haven't added SVG support to the PDFLib adapter yet.

No, sorry, it's CPDF - I updated the comment.
Sometimes SVG's work, and sometimes they don't. So I want to find out what exactly makes the difference.

@PhenX would be the best person to answer these questions but I'll do my best

  1. Would actually probably be a php-svg-lib issue
  2. Yes. Currently dompdf (0.7.0) only supports SVGs referenced via IMG element, either <img src="file.svg"> or <img src="data:image/svg+xml;base64,...">
  3. I don't believe so.
  4. There are some things missing, the last update from PhenX indicated future improvements to gradients and CSS (ref)
  5. Absolute worst case is an SVG with text, which loses the text.

If you have a sample SVG that's not rendering well and can post it please do. Actually, you should post a bug report to the php-svg-lib project for any problematic SVG renders.

In my case, I have user-generated drawings, so it's not that easy to predict how the exact SVG conversion will come out (which tags, etc.).

Here's an example:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="419" height="200"> <path stroke-linejoin="round" stroke-linecap="round" stroke-width="5" stroke="rgb(100, 100, 100)" fill="rgb(255, 0, 0)" d="M 1 52 c 0.51 -0.14 19.57 -6.07 29 -8 c 3.13 -0.64 6.71 0.39 10 0 c 8.01 -0.94 15.97 -3.22 24 -4 c 5.61 -0.55 11.37 -0.24 17 0 c 2.02 0.09 5.72 0.08 6 1 c 0.43 1.43 -1.48 7.48 -3 9 c -1.13 1.13 -4.79 1 -7 1 c -1.59 0 -4.74 -0.03 -5 -1 c -0.9 -3.43 -0.62 -12.38 0 -18 c 0.33 -2.96 1.14 -7.14 3 -9 c 4.52 -4.52 12.37 -10.14 19 -13 c 9.57 -4.13 21.42 -8.04 32 -9 c 21.32 -1.94 47.04 -1.06 67 0 c 2.66 0.14 5.45 2.51 8 4 c 1.43 0.83 2.87 1.87 4 3 c 1.13 1.13 2.77 2.63 3 4 c 0.64 3.84 -0.14 13.29 0 14 c 0.05 0.23 1.13 -2.99 2 -4 c 0.97 -1.13 2.58 -2.56 4 -3 c 3.45 -1.08 7.97 -1.86 12 -2 c 15.58 -0.53 31.85 -0.77 47 0 c 3.99 0.2 8.17 1.62 12 3 c 4.43 1.6 8.7 4.41 13 6 c 1.83 0.67 4.17 0.39 6 1 c 2.02 0.67 4.31 1.74 6 3 c 2.13 1.6 5.2 4.09 6 6 c 0.57 1.37 -0.21 4.74 -1 6 c -0.58 0.93 -2.64 1.55 -4 2 c -1.55 0.52 -3.33 0.93 -5 1 c -5.9 0.26 -12.2 0.26 -18 0 c -1.33 -0.06 -4.07 -0.49 -4 -1 c 0.14 -0.97 3.04 -5.81 5 -6 c 14.32 -1.39 38.43 -1.44 57 0 c 10.99 0.85 21.88 4.17 33 7 c 8.96 2.28 17.34 5.03 26 8 c 3.14 1.08 6.18 2.48 9 4 c 1.43 0.77 3.45 1.9 4 3 c 0.55 1.1 0.49 3.66 0 5 c -0.7 1.93 -2.27 5.87 -4 6 c -18.23 1.37 -74.25 -0.12 -76 0 c -0.45 0.03 17.03 3.14 19 4 c 0.43 0.19 -1.89 2.39 -3 3 c -1.65 0.92 -4 1.86 -6 2 c -11.4 0.81 -23.51 0.94 -36 1 c -58.63 0.29 -111.3 0.59 -169 0 c -8.9 -0.09 -17.26 -2 -26 -2 c -12.09 0 -23.61 1.65 -36 2 c -11.69 0.33 -24.34 -0.52 -34 0 c -1.02 0.06 -2 1.75 -3 2 c -1.38 0.34 -5.09 0 -5 0 c 4.51 0 258 0 258 0"/> </svg>

In base64:
PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgd2lkdGg9IjQxOSIgaGVpZ2h0PSIyMDAiPg0KICAgIDxwYXRoIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBzdHJva2U9InJnYigxMDAsIDEwMCwgMTAwKSIgZmlsbD0icmdiKDI1NSwgMCwgMCkiIGQ9Ik0gMSA1MiBjIDAuNTEgLTAuMTQgMTkuNTcgLTYuMDcgMjkgLTggYyAzLjEzIC0wLjY0IDYuNzEgMC4zOSAxMCAwIGMgOC4wMSAtMC45NCAxNS45NyAtMy4yMiAyNCAtNCBjIDUuNjEgLTAuNTUgMTEuMzcgLTAuMjQgMTcgMCBjIDIuMDIgMC4wOSA1LjcyIDAuMDggNiAxIGMgMC40MyAxLjQzIC0xLjQ4IDcuNDggLTMgOSBjIC0xLjEzIDEuMTMgLTQuNzkgMSAtNyAxIGMgLTEuNTkgMCAtNC43NCAtMC4wMyAtNSAtMSBjIC0wLjkgLTMuNDMgLTAuNjIgLTEyLjM4IDAgLTE4IGMgMC4zMyAtMi45NiAxLjE0IC03LjE0IDMgLTkgYyA0LjUyIC00LjUyIDEyLjM3IC0xMC4xNCAxOSAtMTMgYyA5LjU3IC00LjEzIDIxLjQyIC04LjA0IDMyIC05IGMgMjEuMzIgLTEuOTQgNDcuMDQgLTEuMDYgNjcgMCBjIDIuNjYgMC4xNCA1LjQ1IDIuNTEgOCA0IGMgMS40MyAwLjgzIDIuODcgMS44NyA0IDMgYyAxLjEzIDEuMTMgMi43NyAyLjYzIDMgNCBjIDAuNjQgMy44NCAtMC4xNCAxMy4yOSAwIDE0IGMgMC4wNSAwLjIzIDEuMTMgLTIuOTkgMiAtNCBjIDAuOTcgLTEuMTMgMi41OCAtMi41NiA0IC0zIGMgMy40NSAtMS4wOCA3Ljk3IC0xLjg2IDEyIC0yIGMgMTUuNTggLTAuNTMgMzEuODUgLTAuNzcgNDcgMCBjIDMuOTkgMC4yIDguMTcgMS42MiAxMiAzIGMgNC40MyAxLjYgOC43IDQuNDEgMTMgNiBjIDEuODMgMC42NyA0LjE3IDAuMzkgNiAxIGMgMi4wMiAwLjY3IDQuMzEgMS43NCA2IDMgYyAyLjEzIDEuNiA1LjIgNC4wOSA2IDYgYyAwLjU3IDEuMzcgLTAuMjEgNC43NCAtMSA2IGMgLTAuNTggMC45MyAtMi42NCAxLjU1IC00IDIgYyAtMS41NSAwLjUyIC0zLjMzIDAuOTMgLTUgMSBjIC01LjkgMC4yNiAtMTIuMiAwLjI2IC0xOCAwIGMgLTEuMzMgLTAuMDYgLTQuMDcgLTAuNDkgLTQgLTEgYyAwLjE0IC0wLjk3IDMuMDQgLTUuODEgNSAtNiBjIDE0LjMyIC0xLjM5IDM4LjQzIC0xLjQ0IDU3IDAgYyAxMC45OSAwLjg1IDIxLjg4IDQuMTcgMzMgNyBjIDguOTYgMi4yOCAxNy4zNCA1LjAzIDI2IDggYyAzLjE0IDEuMDggNi4xOCAyLjQ4IDkgNCBjIDEuNDMgMC43NyAzLjQ1IDEuOSA0IDMgYyAwLjU1IDEuMSAwLjQ5IDMuNjYgMCA1IGMgLTAuNyAxLjkzIC0yLjI3IDUuODcgLTQgNiBjIC0xOC4yMyAxLjM3IC03NC4yNSAtMC4xMiAtNzYgMCBjIC0wLjQ1IDAuMDMgMTcuMDMgMy4xNCAxOSA0IGMgMC40MyAwLjE5IC0xLjg5IDIuMzkgLTMgMyBjIC0xLjY1IDAuOTIgLTQgMS44NiAtNiAyIGMgLTExLjQgMC44MSAtMjMuNTEgMC45NCAtMzYgMSBjIC01OC42MyAwLjI5IC0xMTEuMyAwLjU5IC0xNjkgMCBjIC04LjkgLTAuMDkgLTE3LjI2IC0yIC0yNiAtMiBjIC0xMi4wOSAwIC0yMy42MSAxLjY1IC0zNiAyIGMgLTExLjY5IDAuMzMgLTI0LjM0IC0wLjUyIC0zNCAwIGMgLTEuMDIgMC4wNiAtMiAxLjc1IC0zIDIgYyAtMS4zOCAwLjM0IC01LjA5IDAgLTUgMCBjIDQuNTEgMCAyNTggMCAyNTggMCIvPg0KPC9zdmc+

Outcome: The image-area is being rendered (as I can see from a border I added), but it's blank. Only when I added the fill (as above) I get so see at least something. However, it has the wrong color ;-) More important to me: The stroke is not rendered at all.

Bottom line: I really need this functionality in a few weeks. But it's no big deal if I use another image format. So would you guess that this will be working soon, or should I switch to PNG right away?

Should I repost this at php-svg-lib?

Thanks!!

Hi, I have a solution for this problem, can you open an issue in PhenX/php-svg-lib please so that I can post the solution ?

I am amazed this issue was opened in 2012 and now in 2017 using 0.7.0 I still can't load svgs into dompdf. I have tried many different kinds and all I get is either a square box or unknown type.

@Asimov500 0.7.0 can load SVGs, though I've seen a few instances where people are having problems. If you need help you should ask. Just remember to provide details about what you've tried and the results.

@Asimov500 could your issue be related to this #1353?

@Asimov500 also make sure to update "phenx/php-svg-lib" to version 0.2. SVG parsing has significantly improved in the latest version compared to 0.1, but dompdf still seems to depend on version 0.1 for some reason.

Thanks when I get home I will check my php-svg-lib and I will try to give you more information as to what I am doing. I am sure I did update php-svg-lib to test at one point using composer, but I am not sure if I did it correctly. To be honest I don't like composer. All this command line stuff is a pain when you are not a linux user LOL. so I will check again when I get home, and let you know more information.

FYI since php-svg-lib 0.2 is newly released it wasn't available with the last dompdf release. I added it to dompdf last night for inclusion in the next release (currently in the develop branch).

Can you tell me how I find out what version of php-svg-lib I am currently on. I looked in the Readme.md but it doesn't seem to say. I was going to post more details, but my brother is staying with me over the weekend, so I won't be able to reply for a couple of days. Then I will post exactly what my process is.

I looked in in phpunit.xml and it looks like that is version one. Anyway I went into composer and typed composer update and it said that there were no updates. I am not that good with composer so I may have done it wrong.

PS. I am very new to github so I don't know what these branches are.

@Asimov500 composer show tells you what you have installed in which version.

Thanks Thomas. My name is also Thomas by the way. Ok I used composer show and it gives me this

phenx/php-font-lib 0.4 A library to read, parse, export and make subsets of different types of font files.
phenx/php-svg-lib 0.1 A library to read, parse and export to PDF SVG files.
phpunit/php-code-coverage 1.2.18 Library that provides collection, processing, and rendering functionality for PHP code coverage informat...
phpunit/php-file-iterator 1.4.2 FilterIterator implementation that filters files based on a list of suffixes.
phpunit/php-text-template 1.2.1 Simple template engine.
phpunit/php-timer 1.0.8 Utility class for timing
phpunit/php-token-stream 1.2.2 Wrapper around PHP's tokenizer extension.
phpunit/phpunit 3.7.38 The PHP Unit Testing framework.
phpunit/phpunit-mock-objects 1.2.3 Mock Object library for PHPUnit
symfony/yaml v2.8.16 Symfony Yaml Component

So it looks like I am using versin 0.1 then. The question is now how do I update this to the new version.

A little more information I am using a plain old image tag to show my svg
<img src="images/form_opt.svg" alt="name" width="230">
And this gives me image type not found or unknown.

I am not sure at this point showing the svg would help, because I have tried it with various svgs and they all fail.

By the way because I don't have a versioning system because I don't understand github much. I have to copy the dompdf folder to my C drive to update it, and then I copy it back into my project. You see I number all my versions. One day I will learn how to use github LOL

Edit your dompdf composer.json like Brian did in this commit -> 68f40e1
and then run composer update .

You can also download the latest dompdf development version from github web if you select "Branch: develop" and then click "Download ZIP".

Ok I have now got svg lib to update eg
phenx/php-svg-lib v0.2 A library to read, parse and export to PDF SVG files.

So I copied my dompdf folder back into my project, but I am still having the same problem with the svg not showing.

I can give a link to the svg if you think that would be helpful. Just let me know

Make sure you are including the image using "img" tag. Using CSS background won't work.

I am using an image tag as I read that is the only way it will work.
<img src="images/form_opt.svg" alt="name" width="230">

Depending on the format of your SVG you might be affected by the problem described in #1353.

I ddin't understand what the problem was in that post. I am wondering if it is the way I am loading my html
I am doing it like this

<?php
//Include autoloader
require_once "../../../dompdf/autoload.inc.php";
// Reference the Dompdf namespace
use Dompdf\Dompdf;

$dompdf = new Dompdf();

$dompdf->loadHtml(file_get_contents("manualtext.php"));

$dompdf->setPaper("A4","portrait");
$dompdf->render();

//Output the generated pdf
$dompdf->stream('Manual');
?>

Perhaps if I paste my svg it might give a clue. However I have tried different svgs and they all do the same

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 308 114.7" xml:space="preserve"><style type="text/css">
	.st0{fill:#FFFFFF;}
	.st1{fill:#171349;}
	.st2{fill:#4DB748;}
	.st3{fill-rule:evenodd;clip-rule:evenodd;fill:#171349;}
</style><rect class="st0" width="308" height="114.7"/><path class="st1" d="M79.2 48.5C77.5 47 75.3 46 73 46c-5 0-9.5 4-9.5 9.6 0 5.6 4.6 9.6 9.5 9.6 2.7 0 4.7-1 6.4-2.6l1.9 2.2C79.2 66.8 76 68 73 68c-8.2 0-12.8-6.5-12.8-12.4 0-6 4.6-12.4 12.8-12.4 3.2 0 6.3 1.3 8.3 3.1L79.2 48.5zM108.9 62H97.7l-2.2 5.6h-3.3l9.8-24.1h2.7l9.8 24.1h-3.3L108.9 62zM103.3 47.6l-4.6 11.8h9.1L103.3 47.6zM126.9 43.6h6.6c5.1 0 8.1 3.9 8.1 7.9 0 4-3 7.9-8.1 7.9H130v8.2h-3V43.6zM132.9 56.8c3.6 0 5.7-1.8 5.7-5.3 0-3.5-2.1-5.3-5.7-5.3h-3v10.5H132.9zM154.6 43.6H167v2.8h-9.4v7.6h9.4v2.8h-9.4v7.9h9.4v2.8h-12.4V43.6zM206.6 43.6h3.2l-7.4 24.1H200l-5.8-19.1h-0.1l-5.8 19.1h-2.3l-7.4-24.1h3.2l5.4 18.3h0.1l5.5-18.3h2.8l5.5 18.3h0.1L206.6 43.6zM222.2 43.6h12.4v2.8h-9.4v7.6h9.4v2.8h-9.4v7.9h9.4v2.8h-12.4V43.6zM248.2 43.6h3v21.2h8.5v2.8h-11.5V43.6zM272.3 43.6h3v21.2h8.5v2.8h-11.5V43.6z"/><path class="st2" d="M126.5 73.7h12.4v2.8h-9.4v7.6h9.4V87h-9.4v10.7h-3V73.7zM142.8 73.7h3v24.1h-3V73.7zM166.2 73.7h3v24.1h-2.8l-12.9-18.6h-0.1v18.6h-3V73.7h2.8l12.9 18.6h0.1V73.7zM188.8 92.1h-11.2l-2.2 5.6h-3.3l9.8-24.1h2.7l9.8 24.1H191L188.8 92.1zM183.2 77.7l-4.6 11.8h9.1L183.2 77.7zM213 73.7h3v24.1h-2.8l-12.9-18.6h-0.1v18.6h-3V73.7h2.8L213 92.3h0.1V73.7zM238.9 78.6c-1.7-1.6-3.9-2.5-6.2-2.5 -5 0-9.5 4-9.5 9.6 0 5.6 4.6 9.6 9.5 9.6 2.7 0 4.8-1 6.4-2.6l1.9 2.2c-2.2 2-5.3 3.2-8.4 3.2 -8.2 0-12.8-6.5-12.8-12.4 0-6 4.6-12.4 12.8-12.4 3.2 0 6.3 1.3 8.3 3.1L238.9 78.6zM244.2 73.7h12.4v2.8h-9.4v7.6h9.4V87h-9.4v7.9h9.4v2.8h-12.4V73.7z"/><path class="st3" d="M85.1 32.5c-17-3.2-28.1 5.1-37.6 16.6C40.5 57.4 36.4 67 36 77.9c-0.3 9.9 3 18.5 10.8 25 0.5 0.4 1.1 0.9 1.6 1.3 0.1 0.1 0 0.2 0.1 0.6 -6.1-1.2-11.4-3.8-15.9-7.9 -10.1-9.3-13.1-21-11.3-34.2 2.7-19.2 13.8-31.6 31.9-37.6 9.3-3.1 18.6-2.7 27 3.2C81.9 29.4 83.1 30.8 85.1 32.5z"/><path class="st2" d="M96.8 39.2h24c-1.7-11.6-8.3-22.3-21.1-27.6 -9.5-3.9-19.3-3.8-29.2-1.4 -6.6 1.6-12.8 4.3-19.1 8.4C76.1 12.1 92.6 22 96.8 39.2zM84.1 76c-2.9 2.2-6.1 4-9.8 5.3 -11.6 4.1-25.2 1.5-29.6-13.6 -5.2 14.6 1.6 29.3 15.4 33.8 7.4 2.4 14.7 1.8 21.8-1C94.6 95.6 104 87 111.2 76H84.1z"/></svg>

@Asimov500 I don't really have a definitive answer right now. Rather than tie up this issue trying to track down your problem you should start a new discussion on the support forum: http://groups.google.com/group/dompdf

Thanks bsweeney. I will do that as soon as I have finished this section I am working on.

I feel like an idiot for making this schoolboy error. I was using the same data for showing the page and the pdf. Unfortunaly when you load another page it changes the root folder. So basically the location was wrong for the svg image. So now I have got the svg to load, but there is still a problem, and I will make my own thread on this, but the problem is that instead of the svg being green and blue, it is totally black.

Ok it seems the svg I was using I had optimized to make smaller, and it came out black. So I loaded the optimized version back into illustrator and re-exported to svg and now it is in full colour, and the same filesize. So I have finally got it to work. I am using php_svg_lib 2.0 if anyone else is having problems.

@Asimov500 for something like that it might help to start a new issue with php-svg-lib.

My problems with svg are solved, but I thought I should share something with you. If you save out svgs from illustrator for dompdf you will sometimes get a black and white image. This is down to the css properties of the svg being imcompatible with dompdf. So the solution is this When saving svgs
Click more options and change css properties to "Presentation Attributes". Then it doesn't matter if you svg is transparent or not, or anything. The svg will then be in full colour in dompdf. I hope this helps somebody else. I am using illustrator CC2015 and this method works. The other solution is to use an older version of illustrator.

commented

I'm wondering if there are any plans to support
<img src="data:image/png;base64,..."> (png)
or is it supported already? getting nothing in my PDF

thanks

It is supported. Maybe, you are encoding it wrong. Did you try to render it in your browser?

commented

yes browser renders it just fine. here is my image http://138.197.105.143/test

There is sth wrong with your message formatting.

commented

Yes sorry about that. I was editing my comment and putting my image in a separate test file. URL is here http://138.197.105.143/test

here is my composer

"require": {
        "php": ">=5.6.4",
        "laravel/framework": "5.4.*",
        "laravel/tinker": "~1.0",
        "laravelcollective/html": "5.4.*",
        "cartalyst/sentinel": "2.0.*",
        "cviebrock/eloquent-sluggable": " ^4.0.3",
        "cviebrock/eloquent-taggable": "2.1",
        "yajra/laravel-datatables-oracle": "^7.0",
        "intervention/image" :"dev-master",
        "doctrine/dbal": "~2.3",
        "infyomlabs/laravel-generator": "1.0",
        "infyomlabs/core-templates": "5.3.x-dev",
        "infyomlabs/swagger-generator": "dev-master",
        "jlapp/swaggervel": "dev-master",
        "infyomlabs/generator-builder": "dev-master",
        "barryvdh/laravel-dompdf": "^0.8",
        "phenx/php-svg-lib": "0.2.*"
    },

I searched FOREVER until I finally came up with my own solution. I thought I should share in case it could be useful to anyone else. If you are using PHP the best solution to inline SVG images (for me) is to output it using BASE64_ENCODE() on the actual svg, then wrapping it in an image using the src as follows:

$svg = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 36 36" class="circular-chart">
    <path class="circle-bg"
          stroke-width="1"
          fill="none"
          stroke="#ddd"
          d="M18 2.0845
             a 15.9155 15.9155 0 0 1 0 31.831
             a 15.9155 15.9155 0 0 1 0 -31.831"
          />
</svg>';

$html = '<img src="data:image/svg+xml;base64,'.base64_encode($svg).'"  width="100" height="100" />';

The only issue you might find is weird dimensions on the actual image. You will have to mess with it on the PDF output to make sure it displays as desired. I needed to remove the width and height of the actual SVG to make sure it was sizing correctly. Again hope this helps!

@lov2code Thanks that works! But i found svg needs to have defined color trough stroke or fill or it will render transparent.

@lov2code Thanks that works! But i found svg needs to have defined color trough stroke or fill or it will render transparent.

This helped me as well. Could not understand why my SVG wasn't showing. Adding a fill fixed it.

Here you guys have a direct way to do it directly from your controller.
Remember the SVG have to have fill or stroke otherwise you get a transparent SVG.
An Example for Laravel user would be as follow.

In your Controller

$path_to_image = "/img/yourimage.svg";
$logo = "data:image/svg+xml;base64,". base64_encode(file_get_contents(public_path($path_to_image)));

$pdf = PDF::loadView('qr', ['data' => $data, 'logo' => $logo]);

In your PDF / Blade Template

<img src="{{ $logo }}" width="150px" height="100px">

Remember the SVG have to have fill or stroke otherwise you get a transparent SVG.

This from @Gkiokan helped me. Thanks )

What could be wrong with my SVG? it's not displayed

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <path d="M3.18273 9.00943C2.0794 6.79522 3.19265 4.35157 5.31397 3.07877C6.3353 2.46598 7.65528 2.73192 8.35963 3.6924L9.92229 5.82331C10.5874 6.73027 10.6893 7.93307 10.1864 8.93904L9.77663 9.75849C9.65802 9.99571 9.63927 10.2701 9.7606 10.506C9.98164 10.9356 10.4524 11.6971 11.3592 12.6038C12.266 13.5106 13.0274 13.9814 13.4571 14.2024C13.6929 14.3237 13.9673 14.305 14.2045 14.1864L15.024 13.7766C16.0299 13.2737 17.2327 13.3756 18.1397 14.0407L20.2706 15.6034C21.2311 16.3077 21.497 17.6277 20.8842 18.649C19.6114 20.7704 17.1678 21.8836 14.9536 20.7803C13.0874 19.8504 10.7028 18.3114 8.17717 15.7858C5.65156 13.2602 4.11261 10.8756 3.18273 9.00943Z" fill="#538689"/>
    <path d="M3.18273 9.00943C2.0794 6.79522 3.19265 4.35157 5.31397 3.07877C6.3353 2.46598 7.65528 2.73192 8.35963 3.6924L9.92229 5.82331C10.5874 6.73027 10.6893 7.93307 10.1864 8.93904L9.77663 9.75849C9.65802 9.99571 9.63927 10.2701 9.7606 10.506C9.98164 10.9356 10.4524 11.6971 11.3592 12.6038C12.266 13.5106 13.0274 13.9814 13.4571 14.2024C13.6929 14.3237 13.9673 14.305 14.2045 14.1864L15.024 13.7766C16.0299 13.2737 17.2327 13.3756 18.1397 14.0407L20.2706 15.6034C21.2311 16.3077 21.497 17.6277 20.8842 18.649C19.6114 20.7704 17.1678 21.8836 14.9536 20.7803C13.0874 19.8504 10.7028 18.3114 8.17717 15.7858C5.65156 13.2602 4.11261 10.8756 3.18273 9.00943Z" fill="white" fill-opacity="0.1"/>
</svg>

@alex-malyita your issue appears to be different from this one.

For now you can work around the problem by removing the fill declaration from the SVG element.

<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <path d="M3.18273 9.00943C2.0794 6.79522 3.19265 4.35157 5.31397 3.07877C6.3353 2.46598 7.65528 2.73192 8.35963 3.6924L9.92229 5.82331C10.5874 6.73027 10.6893 7.93307 10.1864 8.93904L9.77663 9.75849C9.65802 9.99571 9.63927 10.2701 9.7606 10.506C9.98164 10.9356 10.4524 11.6971 11.3592 12.6038C12.266 13.5106 13.0274 13.9814 13.4571 14.2024C13.6929 14.3237 13.9673 14.305 14.2045 14.1864L15.024 13.7766C16.0299 13.2737 17.2327 13.3756 18.1397 14.0407L20.2706 15.6034C21.2311 16.3077 21.497 17.6277 20.8842 18.649C19.6114 20.7704 17.1678 21.8836 14.9536 20.7803C13.0874 19.8504 10.7028 18.3114 8.17717 15.7858C5.65156 13.2602 4.11261 10.8756 3.18273 9.00943Z" fill="#538689"/>
    <path d="M3.18273 9.00943C2.0794 6.79522 3.19265 4.35157 5.31397 3.07877C6.3353 2.46598 7.65528 2.73192 8.35963 3.6924L9.92229 5.82331C10.5874 6.73027 10.6893 7.93307 10.1864 8.93904L9.77663 9.75849C9.65802 9.99571 9.63927 10.2701 9.7606 10.506C9.98164 10.9356 10.4524 11.6971 11.3592 12.6038C12.266 13.5106 13.0274 13.9814 13.4571 14.2024C13.6929 14.3237 13.9673 14.305 14.2045 14.1864L15.024 13.7766C16.0299 13.2737 17.2327 13.3756 18.1397 14.0407L20.2706 15.6034C21.2311 16.3077 21.497 17.6277 20.8842 18.649C19.6114 20.7704 17.1678 21.8836 14.9536 20.7803C13.0874 19.8504 10.7028 18.3114 8.17717 15.7858C5.65156 13.2602 4.11261 10.8756 3.18273 9.00943Z" fill="white" fill-opacity="0.1"/>
</svg>

Edit: this is likely due to an outdated version of php-svg-lib. Have you tried updating to Dompdf 2.0.2?