更新绘图时svg渲染问题

Question

我有一个d3图，我想动态改变一些点。这是我改变之前情节的样子：

现在，如果我进入chrome控制台并尝试更改任何圆形属性（或从DOM中删除它），例如$($0).attr("r", "20")我的绘图上出现了一个正方形/方框，如果我放大/缩小浏览器窗口或调整浏览器窗口大小，它就会消失。

任何想法为什么会发生这种情况以及如何预防？ 为了帮助调试，我刚刚复制了svg html（由d3生成）并将其发布到codepen。我设置了一个点击事件来说明问题，所以点击任意一点来查看错误。