[英]Can't download my svg to png
谁能告诉我为什么我的 svg to png 没有下载? 我究竟做错了什么? 我似乎找不到有关如何将我的 svg 下载到 png 的解决方案。 是我的库还是我的代码?
function save(){ $("#editor_save").click(function() { // the canvg call that takes the svg xml and converts it to a canvas canvg('canvas', $("#editor").html()); // the canvas calls to output a png var canvas = document.getElementById("canvas"); var img = canvas.toDataURL("image/png"); // do what you want with the base64, write to screen, post to server, etc... }); }
<script src="canvg-master/canvg.js"></script> <div id="editor" class="chart"> <svg width="100" height="100"> <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="red" /> </svg><br /> <button id="editor_save" onclick="save">Save</button> </div>
你有很多问题:
getElementById("canvas")
但尽管您的问题标记中实际上没有画布元素<br />
和按钮在我更正的代码中,我让画布 div 可见,所以你可以看到它在工作。 画布通常是display:none
但您可以使用 img 对象做其他事情。
$("#editor_save").click(function() { // the canvg call that takes the svg xml and converts it to a canvas canvg('canvas', $("#svg")[0].outerHTML); // the canvas calls to output a png var canvas = document.getElementById("canvas"); var img = canvas.toDataURL("image/png"); // do what you want with the base64, write to screen, post to server, etc... });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://canvg.github.io/canvg/rgbcolor.js"></script> <script src="http://canvg.github.io/canvg/StackBlur.js"></script> <script src="http://canvg.github.io/canvg/canvg.js"></script> <div id="editor" class="chart"> <svg id="svg" width="100" height="100"> <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="red" /> </svg> <br /> <button id="editor_save">Save</button> </div> <div> <canvas id="canvas" width="1000px" height="600px"></canvas> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.