如何通过点的意甲替换图线？(How to replace line in chart by seri

我试图使用“可重复使用的图表”的方法由@mbostock所描述的，使用线时，一切都很好（ <path> ）。 然而，当我尝试使用点（ <circle> ）中，只有一个元素被添加到该图表，它不是很好地形成（错cx和cy ）。

我试图代码之间小提琴的50-55线 。

Answer 1:

在利用可重复使用的图表API伟大的工作！

为了与社交圈功能，需要将数据绑定到圈集合为好。 有多种方法可以来看看选择的更多信息（搜索数组的数组的有点棘手，会给您如何以不同的方式去做一些其他的见解）。

http://jsfiddle.net/7rdU7/

以上是您的例子进行，保持它的简单和容易理解的差异是什么修复。

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元素。 如果是这样的话，你应该看看源crossfilter例子 ，看看它是如何做创建多个不同的条形图，但我真的不知道这是与它合作的理想方式。

Answer 2:

相反，改变路径，改变路径的绘制。

演示： http://jsfiddle.net/2DDuH/5/

.line {
  fill: none;
  stroke: #000;
  stroke-width: 5px;
  stroke-linecap: round;
  stroke-dasharray:0 20
}

通过使用胖中风，圆线帽，而“画”为0像素，随后差距虚线，你的路径抚摸了一系列圆。 您的stroke-width来控制你的社交圈的直径。

您可以提供任意复杂的dasharray不均匀空间他们，如果你想要的。 例如，尝试0 20 0 40 0 6 0 30 0 15 0 30 。

文章来源: How to replace line in chart by serie of dot?