Javascript 使用d3向折线图添加数据标签和标记

我尝试了各种方法，将标记和标签添加到折线图中

我尝试使用enter方法将圆添加到折线图中。我能得到的是快照中提到的组级别的起点或第一个点

这是我迄今为止一直在尝试的方法

如需进一步信息，请告知

下面是我试图创建的代码段

g.append('circle')
                    .attr("class"   ,"circle")    
                    .attr('cx',function(d) { return xScale(d[0]) ; })
                    .attr('cy',function(d) { return xScale(d[1]) ; })
                    .attr('r',22);

---

用于圆的输入选择基于使用.data[data]的行的附加。当需要一个元素时，这对于线/路径是可以的，但当需要每个基准单独的元素时，这将不起作用

---

您应该单独执行selectAllcircle.datadata.enter…等操作，其中数据不在方括号内。这将为每个圆提供单独的元素。

I second@TomShanley answer，但您不应该使用enter.data[[data]]，因为您不使用数据本身。您应该只使用d3添加svg元素。稍后，您可以根据需要添加数据以创建圆

您也不应该在内部或其他位置包含元素

---

这是最新的小提琴：

谢谢！！我能知道为什么它没有像在我的小提琴中那样在你的小提琴中显示x轴吗？但是，当我检查svg元素并添加滚动条时，它也显示x轴的高度。我想我必须改变边距属性是的，我的没有显示x轴，因为我缺少一些变换。