如何合并多个svg文件？

Question

现在有两个svg文件
1.svg如下

描绘的是一张脸

2.svg如下

描绘出来是一双眼睛

我想把这两个svg文件合并成一个，达到下面这个效果

我现在用的是通过两个iframe的重叠实现的（两个dom），觉得不太好，想把两个svg合并成一个svg，就是类似把2.svg中的<g>添加到1.svg中这样的方法（这样应该是只生成了一个dom）显示出来.

没啥思路，想问问各位大牛~？谢谢

Answer 1

问题年代久远，但还是回答下吧，万一有人也有同样的问题呢( 3__3 )下面是正题：
鉴于1.svg和2.svg中<svg>的width和height都是一致的，且填充属性filling都写在<g>标签里，题主可以这样操作：

1. 在2.svg中复制最大层级的标签<g>的所有内容（题主的2.svg截图不完整，只看到<g id='leftEye'...>，应该还有<g id='rightEye'...>等内容也一并复制）；

2.在1.svg的结尾，也就是</g>和</svg>之间粘贴刚刚复制的内容。
这样就可以实现题主的要求啦
最后还是建议了解下 SVG 的制图原理，这样会更有帮助

Answer 2

给你个网址，在线编辑 svg ，你可以依次导入两个 svg 调整位置，然后输出，上地址：https://svg-edit.github.io/sv...

补充一下，导入和导出都在左上角按钮里

Answer 3

http://www.zhangxinxu.com/Git...

可以参考下张鑫旭的这篇文章