Dom-to-image SVG image elements

Question

I'm using the brilliant dom-to-image to capture a screenshot of a d3.js dashboard and download as a png.

I've found it works better than it's competitors - the CSS transfers beautifully - but I've come across a stumbling block.

I have some SVG image elements in my dashboard:

<image x="20" y="20" width="300"height="80" 
xlink:href="image/my_image.png"/>

These are either embedded directly onto the svg or as pattern definitions and they are not rendering on the PNG.

This is a know problem and one which has come up on Stack Overflow before but I haven't been able to find a solution. Any thoughts?

Answer 1

For me what worked was installing html-to-image and not using dom-to-image