什么是从客户端DOM序列化SVG的最好方法是什么?

问题描述:

我的工作在哪里用户创建和重新定位的即时元素互动SVG / AJAX接口。我想,以支持其当前视图导出到一个PNG图像和/或SVG文件的能力,为用户。我真的很喜欢SVG文件要尽可能简单(无需大量嵌套变换)。是否有已经支持这个任何框架?

I am working on interactive SVG/AJAX interfaces where elements are created and repositioned on-the-fly by users. I'd like to support the ability for users to export their current view to a PNG image and/or an SVG document. I'd really like the SVG document to be as simple as possible (without a lot of nested transforms). Is there any framework that already supports this?

目前,我要求我的用户使用Ctrl + Alt + PrntScrn技术,我不想让他们安装任何软件/插件。

I'm currently asking my users to use the Ctrl+Alt+PrntScrn technique, and I don't want to ask them to install any software/plugins.

服务器端code为PHP实现,现在,有没有什么帮助。我已经实现了以从原文件PNG图像使用ImageMagick(客户端发出之前,任何修改)的能力。

The server-side code is implemented in PHP right now, if that helps. I've already implemented the ability to generate a PNG image from the "original" document (before the client makes any modifications) using ImageMagick.

我假设你需要这在支持SVG浏览器才能工作。

I'm assuming you need this to work only in browsers that support SVG.

火狐,Safari和Opera提供非标的XMLSerializer API,所以你可以做这样的事情:

Firefox, Safari, and Opera provide the non-standard XMLSerializer API, so you could do something like this:

var svg = document.getElementById('svg_root'); // or whatever you call it
var serializer = new XMLSerializer();
var str = serializer.serializeToString(svg);

从那里,你可以将它发送到服务器,并获得一个PNG的回报。

From there, you can send it to the server and receive a PNG in return.

下面的 Mozilla的开发者页面的DOM 的序列化XML。

Here's Mozilla's developer page on serializing XML from the DOM.