Javascript D3盘和x2B；缩放-当缩放结果位于错误位置时添加项目

我有一个规则的网格，当用户点击一个按钮时，我会在随后的顺序中绘制正方形，例如

但是，如果我在添加新项目之前放大，它会被添加到错误的位置，即。

问题的演示

---

有什么想法吗？

你在d3中混合了两种不同的缩放方式——缩放（“语义”缩放）和变换（“几何”缩放）。看

您已将比例附加到缩放行为，因此当您缩放或平移时，将修改比例以反映更改。但是，您仅使用该修改来重新绘制轴，对于正在使用几何变换创建缩放效果的绘图。在您尝试重新绘制任何绘图（或绘制新形状）之前，此操作一直有效。执行此操作时，修改后的比例和变换后的打印加在一起，以使缩放和平移效果加倍，从而导致形状与轴不匹配

---

解决办法是简单地做一件或另一件事。或者将比例连接到缩放行为，然后在每次缩放事件后使用这些比例重新绘制所有形状；或者使用变换——但是当你放大和缩小时，你的轴不会自动改变刻度间距。

谢谢你的指针！我已经用语义缩放修复了它