Javascript D3.js获取最近的X&；面积图的Y坐标

嗨，我有一个面积图，上面有几个X（年）和Y（价格）值。正如我所发现的，当用户单击线条上的一个点时，可以很容易地获得图表的X，Y坐标值，但是单击线条外的点，即SVG/图表主体区域，只能提供X，Y坐标，它们是平面坐标，而不是数据

图表上的要点：

circles = c.svg().selectAll 'circle.dot'
circles.on 'click', (d) ->
    console.log 'POINT', 'Datum:', d

O/p:

图表外的点：

svg.on 'click', () ->
    console.log 'SVG', d3.mouse(@)

O/p:

现在有没有办法在单击SVG时获取最近的数据坐标？例如 SVG[605.5394.5]将是（类似于最近的[X，Y]使用）

或者以其他方式将SVG X，Y转换为数据X，Y

原始数据的形式为

[
    {x: Fri Jan 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 666},
    {x: Fri Feb 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 668},
    {x: Fri Mar 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 700},
    {x: Fri Apr 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 750},
    .
    .
    .
    {x: Fri Dec 01 2010 00:00:00 GMT+0000 (GMT Standard Time), y: 2000},
    .
    .
    .
]

使用d3.平分线

var mouse = d3.mouse(this);
var mouseDate = xScale.invert(mouse[0]);
var bisectDate = d3.bisector(function(d) { return d.x; }).left;
var i = bisectDate(data, mouseDate); // returns the index to the current data item

var d0 = data[i - 1]
var d1 = data[i];
// work out which date value is closest to the mouse
var d = mouseDate - d0[0] > d1[0] - mouseDate ? d1 : d0;

var x = xScale(d[0]);
var y = yScale(d[1]);

---

我已经有了十字准星；基本上，我想要的是当点击线/面积图外的面积时，从原始数据集中得到x，y（最近/绝对值）。对不起，我现在读到了。只有一个问题我不希望交叉点的“Y”值，而是希望将SVG的Y坐标转换为相对Y的数据。应该使用

x

的哪些值来计算距离？@Wh0RU抱歉，不确定您的意思。该示例获取距离光标位置最近的数据点，这不是您要查找的吗？嗨！您知道如何为

dc.js

实现它吗？

{x: Fri Feb 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 666}

[
    {x: Fri Jan 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 666},
    {x: Fri Feb 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 668},
    {x: Fri Mar 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 700},
    {x: Fri Apr 01 1980 00:00:00 GMT+0000 (GMT Standard Time), y: 750},
    .
    .
    .
    {x: Fri Dec 01 2010 00:00:00 GMT+0000 (GMT Standard Time), y: 2000},
    .
    .
    .
]

var mouse = d3.mouse(this);
var mouseDate = xScale.invert(mouse[0]);
var bisectDate = d3.bisector(function(d) { return d.x; }).left;
var i = bisectDate(data, mouseDate); // returns the index to the current data item

var d0 = data[i - 1]
var d1 = data[i];
// work out which date value is closest to the mouse
var d = mouseDate - d0[0] > d1[0] - mouseDate ? d1 : d0;

var x = xScale(d[0]);
var y = yScale(d[1]);