Javascript 在D3图表中，“圆圈”不代表直线

我在d3图表中画了4个值，对于第一个值，我没有得到圆，但是对于其余的值，它完美地显示了圆

有人能指出问题所在吗？谢谢

代码沙箱

代码片段-

  g.selectAll("circle")
      .data(data)
      .enter()
      .append("circle")
      .attr("cx", function(d) {
        return xScale(d.startTime);
      })
      .attr("cy", function(d) {
        return yScale(d.magnitude);
      })
      .attr("r", function(d) {
        return 5;
      })
      .on("click", function(d) {
        alert("on click" + d.magnitude);
      })
      .attr("class", "circle");

---

您的图例中已经有一个圆。因此，当你做

g.selectAll("circle")

。。。您正在选择该圆并向其添加数据点

解决方案是不选择任何内容：

g.selectAll(null)

或者，如果计划进行更新选择，请按类选择：

g.selectAll(".foo")
  .data(data)
  .enter()
  .append("circle")
  .attr("class", "foo)
  //etc...

---

结果如下：

谢谢，我看到的只是添加了一个类attr并选择了g.selectAll.foo。仅此而已，还有一件事一个相同的注释我可以将图表向右移动一点，这样我的圆圈就完全可见了，因为如果我们注意到圆圈是半可见的。请建议。谢谢你的建议？这是一个不同的问题，所以请发布一个新的问题和相关的细节，在评论部分回答问题相当复杂。另外，从现在起，我将不再检查CodeSandbox上的代码，对于D3代码这样简单的东西来说，它是一个复杂而缓慢的站点。祝你好运。当然，谢谢你的帮助。