克隆由 Snap.load() 检索的根元素

Question

我目前正在努力弄清楚如何重新使用加载的 SVG 文件，而不是每次需要时都加载它。

Snap.load('app/pages/map/desk.svg', function(svg) {
    desk = svg;
});

但是，当我附加这个桌面变量时，它只在第一次工作，我发现我需要克隆 svg 才能重新使用它。 (reusing snap.svg loaded svg into different elements)

不幸的是 svg.clone() 不存在，我无法执行类似 svg.select('whatever').clone() 的操作，因为我加载的 svg 是根元素。

我只是想要能够做到desk = svg.clone();

有谁知道我如何做到这一点？

Answer 1

我在 svg 周围放置了一个 <defs> 元素，然后我选择了嵌套的 svg，然后，每次我附加 svg 时，我都会在其上调用 clone。

我的 .svg 来自这个：

<svg>...</svg>

到这里：

<defs><svg>...</svg></defs>

我的代码现在看起来像这样：

// Load the .svg
Snap.load('app/pages/map/desk.svg', function(svg) {
    desk = svg.select('svg');
});

// Append it somewhere
group.append(desk.clone());

感谢您的帮助@Ian