Graph mouse events are not getting treggered

Viewed 56

I am working on an electron-angular project, In which I have to render four graphs one by one on the same screen. when the component loads you can see two of them on the screen and to see other graphs you have to scroll down the window. I've integrated hover effects and a legend box in every chart, when the component loads, the first two graph in the visible area, are properly working, all hover, zoom, and pan functionality is working fine but the zoom, pan hove effects are not working properly on other graphs which are not in visibility area at first.reference application's Image

1 Answers

Which LightningChart JS version are you using?

I tried to reproduce the issue with v.3.4.0 but could not find such an issue. This could also be an Electron specific issue.

I'll attach my JavaScript code which I used for testing, maybe you could try to confirm your issue using that? You should be able to paste it in relatively easy using this template project: https://github.com/Arction/lcjs-typescript-example

const divFull = document.createElement('div')
document.body.append(divFull)
divFull.style.width = '100vw'
divFull.style.height = '160vh'
divFull.style.display = 'flex'
divFull.style.flexDirection = 'column'

const divs = new Array(4).fill(0).map((_, i) => {
    const div = document.createElement('div')
    divFull.append(div)
    div.style.flexGrow = '1'
    return div
})

// Approach 1, using Dashboard
const dashboard = lightningChart().Dashboard({ container: divFull, numberOfColumns: 1, numberOfRows: 4 })
for (let i = 0; i < 4; i += 1) {
    dashboard.createChartXY({ columnIndex: 0, rowIndex: i })
}

// Approach 2, using standalone Charts
// for (let i = 0; i < 4; i += 1) {
//     const chart = lightningChart().ChartXY({ container: divs[i] })
// }

Related