Chart is not interactable

If you run into the issue where you have a scrollable layout containing a chart, and the chart becomes temporarily un-interactable after scrolling on the webpage, this happens because the chart is not aware that it is moving.

The solution to this problem is to add a scroll event handler to your scrollable DIV, and inform the chart(s) that they are moving.

// Example
div.onscroll = () => {
    chart.engine.layout()
}

tip

This issue received some out of the box improvements in v7.0.0.

In React or other UI frameworks, you may not have access to a Chart object in this scenario, so you can also call layout on the LightningChart context, which affects all charts created using that context:

// Example 2
const lc = useContext(LCContext);
return (
    <div
        className="plots"
        onScroll={() => {
            lc?.layout();
        }}
    >
)