How To Export Png Within Svg

I have some trouble to export my SVG which contains a PNG image in it. I'm using D3JS and the following code. mysvg.append('image') .attr('width', 299) .attr('height', 168) .

Solution 1:

You need to add xmlns:xlink to your svg tag.

It should look like this:

<svgwidth="xxx"height="yyy"xmlns="http://www.w3.org/2000/svg"xmlns:svg="http://www.w3.org/2000/svg"xmlns:xlink="http://www.w3.org/1999/xlink">

So just do...

.attr("xmlns:xlink", "http://www.w3.org/1999/xlink")

UPDATE

I created a JSBIN to help us with this. It is working just fine.

var mysvg = d3.select('#mysvg');

var src = 'http://placehold.it/350x150';

mysvg.append("image")
  .attr("width", 350)
  .attr("height", 150)
  .attr("xlink:href", src);

var img = document.createElement('img');
    img.src = src;

document.getElementById("target").appendChild(img);

Does it solve your problem?