使用D3 JavaScript扩展Axis

Question

我绘制了X轴和Y轴。我有几点要在轴上显示。我的点在X轴上从4.5到8变化，Y轴在2到4之间变化。

你可以找到我所做的DEMO。

function kmeans(){
    x_means[0] = 5.9;

    plotMeans();
}

问题是此图表显示的是0.59等点。但是，当我从图表中删除时，我看不到何时给出5.9的值。

关于如何解决这个问题的任何想法？

谢谢！

Answer 1

如果你检查你的javascript控制台，你会看到这个错误：

Error: Invalid value for <circle> attribute cy="NaN"

这是因为您输入的数据d3是：

> numeric.transpose([[0.59],[]])
    Array[2]
      0: 0.59
      1: undefined

那样：

.attr("cy", function(d, i){return Y(d[1]);});

是未定义的操作。

<强> EDITS

不，只是重新阅读你的问题。您的比例需要域，这是您的坐标空间的用户空间范围。 范围则是坐标空间的像素范围。比例图将两者结合在一起：

var X = d3.scale.linear()
    .range([0, width]) //<-- 0 to 960 pixels
    .domain([0,10]); //<-- maps to coordinates 0 to 10

请参阅更新here。

我还修改了它以使用正确的轴，因此更容易可视化。