javascript - 如何将光标移动到图表上的任何位置，而不仅仅是系列数据点？

Question

我有 2 个点线系列，每个点线系列上都有默认光标。默认光标沿着系列数据（点）运行。我想要的是一个光标，我可以在图表中的任何位置移动，而不仅仅是在系列数据上。

标签： javascriptchartscursorlineserieslightningchart

Answer 1

谢谢你的问题。根据标签，我假设您使用的是LightningChart JS。

如果我正确理解了您想要的行为，您希望光标始终位于用户鼠标上，并在结果表中显示已解决的最近数据点。

这可以通过Chart Marker来实现，它基本上是一个可以在应用程序代码中创建和定位的光标。

这是有关如何操作的代码片段：

• 监听文档上的鼠标事件。

• 从系列中求解最近的数据点。

• 在任意位置定位图表标记。

const marker = chart.addChartMarkerXY()

document.addEventListener( 'mousemove', ( event ) => {
    // Solve nearest data point.
    const cursorPoint = chart.solveNearest( { x: event.clientX, y: event.clientY } )
    // Translate mouse location to Axis.
    const locationOnAxes = translatePoint(
        chart.engine.clientLocation2Engine( event.clientX, event.clientY ),
        chart.engine.scale,
        {
            x: chart.getDefaultAxisX().scale,
            y: chart.getDefaultAxisY().scale
        }
    )
    // Position Chart Marker, but override its location.
    marker
        .pointAt( cursorPoint )
        // Override Cursor location to that of mouse location.
        .setPosition( locationOnAxes )
} )