0

我是 Raphael 的新手,想就如何构建我的应用程序提出一些基本问题:

我需要在可视化图形编辑器上绘制模型并将它们保存到文件中(我称它们为屏幕)。在运行时,我需要加载这些屏幕并使用 Ajax 从服务器数据中为它们制作动画。

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

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

此外,在 SVG 上,我们可以使用一些图形可视化编辑器,这就是我们构建屏幕所需的全部内容。其余的如果 javascript 代码获取元素 id 并在运行时基于 ajax 调用更改它们的属性以获取服务器数据。

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

那么,可视化编辑我的模型、将它们保存到文件并使用 Raphael 实时加载的最佳方法是什么?

4

3 回答 3

1

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

对于相对简单的 SVG 图像,您可以使用svg2path。它将 SVG 文件(或来自 URL 的 svg)转换为可以加载到 Raphael 中的路径。从文档中,在命令行上运行以下命令:

svg2path some.svg

生成一个名为的路径文件some.path,可以在 Raphael 中加载(大概使用paper.path()方法)。

它在githubnpm上可用。

于 2013-10-18T07:46:55.213 回答
1

您可以使用像https://github.com/wout/raphael-svg-importhttps://github.com/jspies/raphael.serialize https://github.com/crccheck/raphael-svg-import这样的插件-经典让你开始也许。我认为您可能需要做一些额外的工作来应对团体和拉斐尔。

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

于 2013-10-11T22:11:22.853 回答
0

这对VectorEditorJS你来说是一个很好的起点。研究editor.js在它之上构建或重建你自己的功能。Here's演示。

编辑

SVGEdit演示具有将矢量保存为 svg 的代码。您可以查看代码。

于 2013-10-10T11:41:52.640 回答