Javascript 如何用点的系列替换图表中的线？

我正在尝试使用@mbostock所描述的，当使用一行（

）时，一切都很好。 但是，当我尝试使用点（

）时，图表中只添加了一个元素，而且格式不正确（错误的

cx

和

cy

）

---

我尝试的代码介于之间。

在利用可重用图表API方面做了大量工作

为了使用圆，还需要将数据绑定到圆集合。您可以通过多种方式查看更多信息（搜索数组数组中的棘手部分，这将为您提供有关如何以不同方式进行操作的其他见解）

以上是对您的示例进行的修复，使其保持简单且易于理解差异

g.selectAll('.circle').data(data).enter().append("circle")
            .attr("class", "dot")
            .attr("cx", function(d) {return xScale (d.date); })
            .attr("cy", function(d) {return yScale (d.ySpeed); })
            .attr("r", function(d) {return rScale (d.xSpeed); });

---

如果您希望在一个可视化（一条线）到一组点之间转换。这是一个非常棘手的游戏，它要弄清楚如何创建一组大小不同的圆，所有这些圆都利用

svg:path

元素。如果是这种情况，您应该查看的源代码，看看如何创建多个不同的条形图，尽管我真的不知道这是否是使用它的理想方法。

与其更改路径，不如更改路径的绘制方式

演示：

.line{
填充：无；
行程：#000；
笔画宽度：5px；
笔划线头：圆形；
笔划数组：0 20
}

通过使用较粗的笔划、圆线帽和“绘制”0px的虚线，然后是一个间隙，您的路径将被一系列圆所笔划。您的

笔划宽度

控制圆的直径

---

如果需要，可以提供任意复杂的dasharray来不均匀地分隔它们。例如，尝试

02004000603015030

+1以获得一个好的演示，尽管我不确定它是OP想要的。查看结果chrt:a historic of wind（direction/strength）>为什么这与另一个用户提出的问题完全相同？这在视觉上是正确的，但我需要自治对象，以便编辑它们的属性。