Converting Svg to Png Using C#

Converting SVG to PNG using C#

You can call the command-line version of inkscape to do this:

http://harriyott.com/2008/05/converting-svg-images-to-png-in-c.aspx

Also there is a C# SVG rendering engine, primarily designed to allow SVG files to be used on the web on codeplex that might suit your needs if that is your problem:

Original Project
http://www.codeplex.com/svg

Fork with fixes and more activity: (added 7/2013)

https://github.com/vvvv/SVG

SVG element to PNG file with C#

pushed by the comment of ccprog I found out that the UI was openend by inkscape because I was doing also other stuff in the same command I run.

Actually running inkscape as:

MyFile.svg --export-id=ElementIdToRender --export-id-only --export-dpi=200 --export-png="TargetFile"

Does the job.

Still to understand why the SVG library gives strange numbers as Bounds for g elements containing one or more children with transform attribute set, but at the moment I can go on.
Tnx

Convert an SVG to PNG using Javascript/jQuery and C# for download

You don't need any server-side for download png)))Please see an example
P.S.
Using jquery for a dom manipulation is a "bad taste" in 2k18, please use dom api))

Update: I have added querySelector to the SVG child of SVG, and SVG serializing code.

downloadPng=function(){   var img = new Image();   img.onload = function (){ var canvas = document.createElement("canvas"); canvas.width = img.naturalWidth; canvas.height = img.naturalHeight; var ctxt = canvas.getContext("2d"); ctxt.fillStyle = "#fff"; ctxt.fillRect(0, 0, canvas.width, canvas.height);        ctxt.drawImage(img, 0, 0); var a = document.createElement("a"); a.href = canvas.toDataURL("image/png"); a.download = "image.png" document.body.appendChild(a); a.click(); document.body.removeChild(a);   };   var innerSvg = document.querySelector("#div-surrounding-svg-element svg svg");   var svgText = (new XMLSerializer()).serializeToString(innerSvg);   img.src = "data:image/svg+xml;utf8," + encodeURIComponent(svgText);}

<div id="div-surrounding-svg-element">  <svg id="inner-svg" height="100" width="500" xmlns="http://www.w3.org/2000/svg">    <svg height="100" width="500" xmlns="http://www.w3.org/2000/svg">      <ellipse cx="240" cy="50" rx="220" ry="30" style="fill:green" />    </svg>    <ellipse cx="240" cy="50" rx="220" ry="30" style="fill:yellow" />  </svg></div><button onclick="downloadPng()">download</button>

---

Related Topics