Graph 使用d3.js向多行图添加圆

因此，我尝试将圆添加到该图上的每个数据点：

你知道怎么做吗？谢谢

以下是我现在尝试的：

var circles = focus.selectAll("g") 
    .data(values) 
    .enter() 
    .append("g"); 

circles.append("circle") 
    .attr("cx", function (d) { return d.date; }) 
    .attr("cy", function (d) { return d.temperature; }) 
    .attr("r", function (d) { return 4; });

---

可以为给定城市的每个点附加圆：

city.append("g").selectAll("circle")
  .data(function(d){return d.values})
  .enter()
  .append("circle")
  .attr("r", 2)
  .attr("cx", function(dd){return x(dd.date)})
  .attr("cy", function(dd){return y(dd.temperature)})
  .attr("fill", "none")
  .attr("stroke", "black")

结果:

顺便说一句，这种方法不适用于

基

插值，因为点似乎离直线很远。如果需要插值，您可能需要做更多的工作，但我怀疑，突出显示曲线的每个点肯定意味着您希望得到它们的确切位置

编辑： 为了使圆与线的颜色相同，您需要访问parentNode的数据：

.attr("stroke", function(d){return color(this.parentNode.__data__.name)})

---

新结果：

欢迎使用StackOverflow。你试过什么？@ChristopherChiche我试过用这个：var circles=focus.selectAll（“g”）.data（values.enter（）.append（“g”）；circles.append（“circle”）.attr（“cx”，函数（d）{return d.date；}）.attr（“cy”，函数（d）{return d.temperature；}）.attr（“r”，函数（d）{return 4；}）；但这不起作用。还有很多关于代码的其他变体。你能把代码添加到你的问题中吗？太棒了，谢谢。你知道我将如何将圆的颜色更改为各自线条的颜色吗？@ChristopherChiche嗨，如果我需要在圆上附加基插值，我该怎么做？我是d3js新手。@Tonyrocz你应该再写一个问题。但是插值应该在轴/域级别上进行