Question

我正在尝试将图标放在D3地图上。我通过插入形状并用图片填充背景（PNG，SVG等）来构建这些图标

这样可以正常工作，直到您尝试缩放。放大时，图标会因变换而变形，我无法将它们固定/与父图形的大小保持一致。这是一个jsfiddle演示我的问题：https://jsfiddle.net/Guill84/Lo2mjhjq/3/

如何修改缩放以使其不会弄乱头像图标？伪代码应该是：

d3.select("#avatar").attr("transform", "scale(*don't scale with rest*)
 translate(*translate with rest to enable panning*)")

Answer 1

一个简单的解决方案（众多）正在对<image>元素应用相同的更改：

d3.select("#avatar")
    .select("image")
    .attr("width", 40 / d3.event.scale)
    .attr("height", 40 / d3.event.scale);