使用 Extjs 将 SVG 转换为 PNG 的 Python 脚本

Question

我正在尝试通过使用 Python 脚本将 SVG 转换为 PNG 来保存图表。 所以我开始将 svg 数据存储在一个变量中:

var svgdata = Ext.draw.engine.SvgExporter.generate(chart.surface);

当我执行 alert(svgdata) 时，我可以看到这个输出是正确的。

但是当我像这样将它发送到服务器时:

Ext.draw.engine.ImageExporter.defaultUrl = "data/svg_to_png.py?svgdata="+svgdata;

已发送的 svgdata 如下所示:

<?xml version=

我是 extjs 的新手，请在这方面帮助我。将 svg 数据发送到我的 python 脚本并呈现 png 图像的正确方法是什么？

这是我的 python 脚本:

import cairo
import cgi
import rsvg
print "Content-type: image/png\n\n"

arguments = cgi.FieldStorage()
img =  cairo.ImageSurface(cairo.FORMAT_ARGB32, 640,480)
ctx = cairo.Context(img)
handler= rsvg.Handle(None, str(arguments["svgdata"]))
handler.render_cairo(ctx)
img.write_to_png("svg.png")

请帮帮我!

Answer 1

<div style="display:none;">
    <iframe id="file_download_iframe" src="blank.html"></iframe>
</div>

您的服务器上需要一个空白的 html 页面才能在所有浏览器中正常工作。 blank.html 页面基本上是一个空页面，以满足 ifram 中始终有一个页面的要求。

那么你还需要一个隐藏在某处的基本表单:

<div style="display:none;">
    <form
        id = "file_download_iframe_form"
        name = "file_download_iframe_form"
        target = "file_download_iframe"
        method = "post"
        action = "data/svg_to_png.py"
    >
        <input type="hidden" id="svgdata" name="svgdata"/>
    </form>
</div>

然后有一个像这样的 javascript 函数:

function getImage(svgdata){
    var form = document.getElementById("file_download_iframe_form");
    document.getElementById("svgdata").value = svgdata;
    form.submit();
};