score:1

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

It should look like this:

<svg width="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?


Related Query

More Query from same tag