ChartJS v2:点击坐标的比例值(时间比例）

ChartJS v2: Scale value at click coordinates (time scale)

本文关键字：时间 v2 坐标 ChartJS      更新时间：2023-09-26

我有一个时间基线图，我正试图获得点击坐标处每个刻度的值。

ChartJS选项中指定的我的onClick函数：

onClick: function(event, elementsAtEvent)
{
    console.log(event, elementsAtEvent, this);
    var valueX = null, valueY = null;
    for (var scaleName in this.scales) {
        var scale = this.scales[scaleName];
        console.log(scale.id, scale.isHorizontal());
        if (scale.isHorizontal()) {
            valueX = scale.getValueForPixel(event.offsetX);
        } else {
            valueY = scale.getValueForPixel(event.offsetY);
        }
    }
    console.log(event.offsetX, valueX, null, event.offsetY, valueY);
},

JSFiddle：https://jsfiddle.net/AllenJB/dmebo9g5/1/

上面的代码似乎适用于Y轴，但不适用于X轴（时间刻度）——无论您在图表中单击什么位置，它都会返回最后一个值。

我可能做错了什么？

这段代码实际上运行得很好。唯一的问题是，我查看了moment对象的_I值来检查它的值（这是创建对象时用作初始输入的值，不一定是当前值）。

将console.log行更改为以下行将产生预期/正确的结果：

console.log(event.offsetX, valueX.format('YYYY-MM-DD HH:mm:ss'), null, event.offsetY, valueY);

如果你想获得最接近的x轴值，你可以这样做：

onClick: function (event) {
    const activeElements = this.getElementsAtXAxis(event);
    const xval = this.scales['x-axis-0']._timestamps.data[activeElements[0]._index];
    console.log(xval)
}
相关文章：