是否可以在SVG元素中使用.PNG精灵？

Question

我有大约30个PNG图标，我想在SVG元素中嵌入我的D3.js图形中。 到目前为止，我已经分别加载所有图像（png）。

目标：现在我想使用一个精灵。我怎样才能以最好的方式做到这一点？

我通过使用一些免费的在线精灵创建者在精灵中转换了我的图标，并在我的精灵中添加了一个如下所示的css代码：

container li {
background: url("../images/somePng.png") no-repeat top left;
}

.sprite-icon_1{ background-position: 0 0; width: 40px; height: 40px; }
.sprite-icon_2{ background-position: 0 -90px; width: 40px; height: 40px; }
                  ...   ...   ...
.sprite-icon_3{ background-position: 0 -180px; width: 40px; height: 40px; }

我真的试图在网上找到相关信息，但找不到合适的方法。 我不关心如何到达目标，只要我不必自己输入位置坐标，它需要很多时间或者图像具有与正常单独加载的svg-image不同的定位/缩放行为元件。

我感谢所有的帮助！