title: Convert Svg with image tag into PNG
body: <p>I want to convert an SVG data into PNG. For that I am using canvas and <code>drawimage()</code> function. This Works 100% fine and convert my svg to png, but if my svg has any image tag, then it wont work.</p>
  
  <p>have a look in to my dummy code:-</p>
  
  <pre><code>&lt;html&gt;
      &lt;body&gt;
          &lt;div id="mainsvg"&gt;
              &lt;svg  xmlns='http://www.w3.org/2000/svg' width='200' height='200'&gt;
              &lt;rect x='0' y='0' width='50' height='100' fill='red'&gt;&lt;/rect&gt;
              &lt;image x='50' y='0' width='100' height='100' xlink:href='http://www.rashflash.com/assets/images/homepage/bubble2.png'/&gt;
              &lt;/svg&gt;
          &lt;/div&gt;
          &lt;p&gt;
              &lt;canvas id="canvas" style="border:2px solid black;" width="200" height="200"&gt;&lt;/canvas&gt;
              &lt;script&gt;
                  var canvas = document.getElementById("canvas");
                  var ctx = canvas.getContext("2d");
                  var mainsvg=document.getElementById('mainsvg');
                  var data =mainsvg.innerHTML;
                  var DOMURL = self.URL || self.webkitURL || self;
                  var img = new Image();
                  var svg = new Blob([data], {type: "image/svg+xml;charset=utf-8"});
                  var url = DOMURL.createObjectURL(svg);
                  img.onload = function() {
                      ctx.drawImage(img, 0, 0);
                      DOMURL.revokeObjectURL(url);
                  };
                  img.src = url;
              &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Above code generate image only if my svg is  as follow:-</p>
  
  <pre><code>&lt;div id="mainsvg"&gt;
       &lt;svg  xmlns='http://www.w3.org/2000/svg' width='200' height='200'&gt;
           &lt;rect x='0' y='0' width='50' height='100' fill='red'&gt;&lt;/rect&gt;            
       &lt;/svg&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Why isn't it converting imagetag of svg ? need help  thanks</p>
  
  <p><strong><a href="http://jsfiddle.net/r54jX/" rel="nofollow">Fiddle</a></strong></p>