Search code examples
javascriptsvgpng

Convert an SVG to a PNG image is missing the fill image pattern

I am trying to convert an SVG to a PNG image. For this reason I use the npm package "dom-to-image". This and all other packages I tried (e.g. html2canvas) do not show a pattern/image in the polygon.

Here is a small example: https://stackblitz.com/edit/angular-ivy-h5e3aw?file=src/app/app.component.html (External and internal Images produce the same result.)

How can I convert my complete SVG to a PNG?

Thank you very much.

Solution

  • Convert your image link to a data URL and it will work.

    href="data:image/png;base64,iVBO ...snip... gg=="

    StackBlitz demo