Edit in JSFiddle

var svg = document.querySelector('svg'),
    img = document.querySelector('img');

setImageToSVG(img,svg);

function setImageToSVG(img,svg){
  var xml = (new XMLSerializer).serializeToString(svg);
  img.src = "data:image/svg+xml;charset=utf-8,"+btoa(xml);
}

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
  <rect width="50" height="50" fill="yellow" />
  <circle cx="20" cy="20" r="10" fill="#900" stroke="#000" stroke-width="4" />
</svg>