我可以将页面上已经存在的 svg 添加到另一个 svg 吗？

【问题标题】：Can I add an svg that already exists on the page to another svg?我可以将页面上已经存在的 svg 添加到另一个 svg 吗？
【发布时间】：2013-06-30 18:51:01
【问题描述】：

情况是这样的。我正在使用 d3 动态生成徽标（即它们不是外部资源）作为 svg。我现在有一个 svg 地图，我想将这些相同的徽标添加到其中。有没有办法（是否使用 d3）将这些徽标复制到地图上？如果有帮助，我的模型会挂在由new XMLSerializer().serializeToString() 制作的完整徽标 svg 的字符串表示上。

【问题讨论】：

标签： javascript svg d3.js geo

【解决方案1】：

通过克隆源并将其附加到目标，您可以使用 JQuery 轻松复制节点层次结构：

$("#source > svg").clone().appendTo("#target");

您显然也可以只复制 SVG 的一部分，例如顶级组，这样。

【讨论】：

实际上，关于如何将顶级组集中在目标元素上的任何提示？
将transform 属性设置为合适的translate 值，即元素宽度的一半和高度的一半。