在 d3 中附加多个外部 svg 并将它们与数据绑定

Question

我有几个 svg 文件想包含在我的 d3 图表中。我可以通过硬编码添加它们，并使用 css 将它们与我的图表正确对齐。

但这似乎是一种愚蠢的方式。我知道我可以使用 d3.xml 从文件中导入 svg 或将其作为对象复制并粘贴并附加到代码中。但这并不能解决我的问题，因为有太多无法手动绑定。

有没有办法让我可以按照 d3 的 join-update-exit 的方式导入和使用它们

Answer 1

我从这个example中想出来了。不要使用 d3.xml，而是在 中添加内联 svg，稍后再 使用 。

.append("use")
.attr("xlink:href",function(d){return "#mySymbol"+d})

jsfiddle here