什么是将SVG文件转换为Raphael的可能方式

假设我将.ai文件保存为.svg。现在我想将这个文件中的所有矢量移动到Raphael，以使用JavaScript来操纵它们。什么是将SVG文件转换为Raphael的可能方式

我该怎么办？有什么方法可以实现这个目标？也请写下任何优点和缺点，以便用户能够以他们的意见选择最佳方式。

来源

2013-01-10 Karol

您可以循环遍历SVG的节点并逐个将它们写入Raphaël对象，但除非您处理非标准元素类型/属性，否则最好使用导入SVG的Raphaël插件之一单线命令。如：

来源

2013-01-10 23:17:28 ram1

仅适用于Raphael-only解决方案 - 比获得Node更好，特别是对于较新的程序员。 –

完全同意您的看法@ChrisWilson。没有节点解决方案最适合大多数用户，这就是我接受这个答案的原因。 – Karol

如果你想操纵svg的子元素，这将无济于事......我更喜欢rappar解决方案。 –

我发现了一些简单的转换器here。

优点： 这真的很简单直接 - 你上传文件，并获得生成的代码。你甚至可以看到它的预览。当加载很简单.svg它的正常使用，您可以轻松地编辑代码，但是...

缺点： 但它最大的问题是，该代码是有点乱。所以如果你加载更大的文件（100多个向量，甚至更多;我为了测试目的而加载了大约1000个）。它的名称和结构也不会响应图层的划分。有时某些图层（您可以在预览中看到它）的顺序不正确，因此如果要查看完全相同的“图像”，则需要浏览代码，查看.svg文件中哪个对象与哪个对象相对应。

无论如何，这是我发现的唯一一个，最后（经过一些工作），你可以达到你想要的。使用它的最佳方式是当您逐个上传.svg部分时，以避免乱码。

来源

2013-01-10 23:04:34 Karol

我认为很高兴看到网站的实际名称和地址，这在您的文章中不可见。所以这里是：Ready.Set.Raphael，http://readysetraphael.com/ – Sygmoral

-2

所有的向量都在文件中，所以你可以把这些路径放到一个变量字符串中，Raphael会使用它。

来源

2013-01-10 23:06:50 Chris

好点 - 你可以打开'.svg'作为文本文件，并通过路径，属性的属性复制它的路径...它需要一些时间但是 - 确实 - 可能的方式。 – Karol

像上面提供的程序化解决方案更好 –

据我所知，SVG坐标不同于Raphael的，这就是为什么我们需要一个转换器。一个人不能简单地复制和粘贴另一个脚趾的坐标。这不就是为什么人们来到这个页面 - 找出如何转换它们？ – Michael

这个对我来说工作得很好http://roomandboard.github.com/vectron/ 在安装rappar依赖项时，需要删除Node.js代码以使其工作。

优点：不需要太多的代码。

缺点：在较大的SVG上它可能有点慢。您可能会考虑将其另存为JSON并使用另一个Raphael插件，以便下次加载速度更快。

来源

2013-01-10 23:12:57

我不得不在几个月前做同样的事情。我用rappar

我使用的节点在命令行来执行转换，并将其保存到文件

node rappar.js test.svg >test.js

test.js现在包含载体。我也发现，虽然唯一的是rappar

的该行537

var files = process.ARGV.slice(0);

应该

var files = process.argv.slice(0);

除此之外，它的工作一种享受。

来源

2013-01-10 23:26:32 Bruno

什么是将SVG文件转换为Raphael的可能方式

回答

相关问题