chartjs-plugin-crosshair
chartjs-plugin-crosshair copied to clipboard
When `sync` is enabled, hiding/showing dataset is also sync'ed?
Situation
I have multiple charts in my page that show different datasets.
I want to use chartjs-plugin-crosshair
to be able to show vertical lines on hover.
I also want to sync the vertical lines so that I can the vertical on the same date.
Bug
Both of the above work, except I noticed a weird bug where enabling sync: {enabled: true}
means hiding/showing a dataset of one chart hides/shows a dataset of another (even though they have different keys)
When I make sync: {enabled: false}
, the weird bug stops, but then I lose the feature of syncing the vertical lines.
I looked through the code of the plugin but I don't see anything that changes the hidden property of datasets.
Plugin config
The plugin config is simple:
crosshair: {
...
sync: {
enabled: true, // enable trace line syncing with other charts
group, // chart group
suppressTooltips: false, // suppress tooltips when showing a synced tracer
},
zoom: {
enabled: false,
},
},
For confidentiality reasons I had to hide some info with red boxes. When I toggle a label on the first chart (top left) some of the labels of the others ones also get toggled. I never touch any of the labels of the remaining charts.
What gives?
Hi Mehdi,
It seems that all mouse interactions, including ones outside the chart area, are synced across charts. This can be fixed by adding a check for event position somewhere here: https://github.com/AbelHeinsbroek/chartjs-plugin-crosshair/blob/92640f4e2166fc2dd8c899940a35f0a2c620a372/src/trace.js#L195
Due to a broken wrist I'm not able to do it myself easily soon I'm afraid.
@AbelHeinsbroek is there any reason to propagate any clicks to other charts? I'm not sure what goal syncing the clicks would accomplish.
Would filtering out the click event in that if
seem like a valid fix? I could submit a PR with that.
Opened a PR, I tested the tweak in my project and it fixed this particular issue. I couldn't see any side effects.