Trendline z-index is too high
Opened this issue · 6 comments
To fix it I had to register ChartTrendline
before the Tooltip
plugin, ie
Chart.register(
// ...otherPlugins
ChartTrendline,
Tooltip,
// ...otherPlugins
)
order matters here.
caveat: we're using Chartjs v3 & forked chartjs-plugin-trendline
to make it work with Chartjs v3
To fix it I had to register
ChartTrendline
before theTooltip
plugin, ieChart.register( // ...otherPlugins ChartTrendline, Tooltip, // ...otherPlugins )order matters here.
caveat: we're using Chartjs v3 & forked
chartjs-plugin-trendline
to make it work with Chartjs v3
Hello,
Could you elaborate a little more the answer please? Do we first have to de-register the integrated ChartJS tooltip plugin and then re-register it after the ChartTrendline?
Thanks,
I know nothing about your codebase, but in ours, changing this order helped, i.e. moving ChartTrendline
before Tooltip
.
Chart.register(
// ...otherPlugins
- Tooltip,
- ChartTrendline,
+ ChartTrendline,
+ Tooltip,
// ...otherPlugins
)
Maybe it doesn't work like this in Chartjs v2, I've never used it 🤷♂️
Hi,
Thanks for your answer. So I understand you are using a custom tooltip plugin, because as far as I know there's an embedded tooltip plugin within the ChartJS core that can only be enabled/disbled but not registered/unregistered.
Am I missing something here?
I am using the VueJS ChartJS wrapper from here (that btw is using ChartJS version 2.8): https://github.com/apertureless/vue-chartjs
Not sure how to proceed, I already tried some hacks with no luck at all. Any advice will be very welcome.
Best,
On the topic of z-index, would it be possible to add an option to draw trend line with a lower z index than the graph itself (ie. visually behind)? Can provide a PR if anyone else needs this.
Great plugin btw!
Heads up for anyone else with this issue, I just copied the plugin source to my project (one file) and adjusted it to render on beforeDatasetDraw
instead of afterDatasetDraw