当我将 SVG 转换为 Raphael JS 对象时，路径不显示

Question

我在网上找到了我想与 Raphael 一起使用的这个 SVG 文件，所以我开始采用路径的 d 属性并将它们放入一个 JS 对象中。在代码中，我循环遍历 JS 对象并创建 Raphael 路径。当我在浏览器中打开文件时，什么都没有显示，我不知道为什么。

我认为它与 SVG 文件有关。在我下载的 SVG 文件中，每个组（g 标签）都有一个transform 属性。如果我从 g 标记中删除该属性并在浏览器中打开 SVG 文件，则该组不会显示。因此，当我只是复制路径时似乎丢失了某些东西。

我不确定如何让这些路径出现在 raphael 中，有什么建议吗？

资源：

• my files
• original map

Answer 1

路径可能确实“显示”了，但在您定义的视口之外。您需要调整路径坐标以适合您的视口，例如通过应用变换（您可以这样做with raphaël，但确保路径坐标一开始就正确变换会更有效）。

如果您想查看路径在哪里，您可以随时增加坐标空间，例如将setting the viewBox 增加到较大的值，例如 [x,y,w,h] = [-10000,-10000,50000,50000 ]。这可能会使渲染看起来很小，但您应该能够快速发现丢失的路径在哪里。