lightningchartlightning

How to configure LightningChart JS mouse interactions similar to TradingView

Is it possible to click on the chart and drag around like tradingview panning ?

Right now its creating rectangle only.

const chart = lightningChart().ChartXY()
// Method for adding OHLCSeries takes one argument: seriesConstructor.
const ohlcSeries = chart.addOHLCSeries(
    // Specify type of figure used
    { seriesConstructor: OHLCFigures.Candlestick }
)
Solution

  • You can pan the chart with right click of the mouse. Right now it's not possible to switch the panning of the chart to left click but we are planning to implement a solution to remap the mouse/touch interactions in future.

    You can also remove an axis from the panning interaction by calling axis.setChartInteractionPanByDrag(false).

    EDIT: With the new v3.0.0 release, ChartXY mouse interaction buttons can now be explicitly configured. For example, changing panning to left mouse button, and rectangle zoom/fit to right mouse button:

    const lcjs = lightningChart({
        overrideInteractionMouseButtons: {
            chartXYPanMouseButton: 0,
            chartXYRectangleZoomFitMouseButton: 2,
        },
})

const chart = lcjs.ChartXY()