预拉伸拉斐尔屏幕，它们保存到

Question

I'm新文件和负载在运行时拉斐尔和想这样做就如何构建我的应用程序的一些基本问题：我需要

对视觉绘制模型图形编辑器并将它们保存到文件（我称之为屏幕）。在运行时，我需要加载这些屏幕并使用Ajax从服务器数据制作动画。

使用SVG我可以使用这个简单的命令加载数据：

<object id="svgobject" type="image/svg+xml" data=".\svg\svgfilename.svg"></object> 

此外，在SVG，我们可以使用一些图形可视化编辑器和that's都需要我们建立的屏幕。其余的如果JavaScript代码来获取元素ID并在运行时改变它们的属性，基于Ajax调用来获取服务器数据。

由于旧版浏览器不支持SVG，因此一种自然的选择就是选择Raphael，但我不知道是否有支持Raphael脚本语言的可视化图形编辑器以及如何在运行时保存/加载这些脚本。

那么，什么是最好的方法来视觉编辑我的模型，将它们保存到文件并使用Raphael实时加载？

Answer 1

伊恩的答案是一个解决方案。另一种做法是将SVG文档转换为Raphael可以理解的数据结构。

对于相对简单的SVG图像，您可以使用svg2path。它将SVG文件（或URL中的svg）转换为可以加载到Raphael中的路径。从文档，运行在命令行上执行以下操作：

svg2path some.svg 

生成称为some.path路径文件，可以在圣拉斐尔被加载（大概使用paper.path()方法）。

它在github和npm上可用。

Answer 2

VectorEditorJS对你来说是一个不错的起点。查看editor.js来构建或重建你自己的功能。 Here's演示。

编辑

的SVGEdit演示得到了代码来保存向量作为svg.You可以看看代码。

Answer 3

你可以使用像https://github.com/wout/raphael-svg-import或https://github.com/jspies/raphael.serializehttps://github.com/crccheck/raphael-svg-import-classic这样的插件让你开始吧。我想你可能需要做一些额外的工作来应付团队和拉斐尔。

编辑澄清，我不确定从你的其他评论你是什么意思拉斐尔模式从图形编辑器。您可以将图形作为直观的SVG并导入。我不确定为什么需要支持Raphael脚本。