title: Convert jQuery SVG to image
body: <p>I am generating SVG object using jQuery SVG plug-in. The problem is how can I convert it into image in my script.</p>
  
  <p>My script is following:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;        
  &lt;script type="text/javascript" src="jquery-latest.min.js"&gt;&lt;/script&gt;                
  &lt;script type="text/javascript" src="jquery.svg.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(function(){
    $("#draw").click(function(){
       $('#svg_container').svg();
       svg = $('#svg_container').svg('get');
       svg.clear(true);
       svg.circle(200, 220, 150, {fill: "red", stroke: "blue", strokeWidth: 5});
       alert(svg.toSVG()); //this prints svg source of the generated image, i.e. circle
    });
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="svg_container" style="position: absolute; left: 100px; top: 100px; width: 400px; height: 400px; border: thin solid #4297D7;"&gt;&lt;/div&gt;
  &lt;button id="draw"&gt;Draw&lt;/button&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I have tried out <a href="https://stackoverflow.com/questions/4809194/convert-svg-image-to-png-with-php/4809562#4809562">this</a> and <a href="https://stackoverflow.com/questions/3975499/conversion-of-svg-to-jpeg/3976034#3976034">this</a> but without success.</p>
  
  <p>Could you please show me how to convert this svg into any type of image?</p>
  
  <p>Thanks in advance.</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>The problem is solved and I have posted the solution as an answer, check it <a href="https://stackoverflow.com/questions/4827764/convert-jquery-svg-to-image/4836882#4836882">here</a>.</p>