AbelHeinsbroek / chartjs-plugin-crosshair

Crosshair plugin for ChartJS
https://chartjs-plugin-crosshair.netlify.com/samples/
MIT License
144 stars 87 forks source link

chartjs3 version automatically enabled on all scripts upon script load #79

Open vincepolston opened 2 years ago

vincepolston commented 2 years ago

I've been playing with the build from the chartjs3 branch and ran into an issue. It appears the plugin is registered and enabled for all charts by default. This causes problems because of some compatibility issues with other chartjs plugins.

I have tinkered with it and don't see a way to either A) not have it automatically enabled for all charts or B) disable it on charts that I don't want it on.. so far I have been unsuccessful at both.

I have tried setting Chart.register(crosshairPlugin); to Chart.unregister(crosshairPlugin); which does not work. This just causes the plugin to not be usable at all.

vincepolston commented 2 years ago

Temporary workaround is to disable the plugin on all charts that you don't want it activated on

options: { plugins: { crosshair: false, // disables the crosshair plugin }, },

AbelHeinsbroek commented 2 years ago

Hi @vincepolston,

In the newest version the plugin is no longer auto-registered, can you check whether that works for you?

Sinu5oid commented 2 years ago

Hi @AbelHeinsbroek Checked with Chart.js 3.4.1 (the newest version available) and chartjs-plugin-crosshair 1.2.0 Seems to be auto-registered unless options: { plugins: { crosshair: false, } } is set

Registered as:

import { Chart, registerables, Interaction } from 'chart.js';
import { CrosshairPlugin, Interpolate } from 'chartjs-plugin-crosshair';
Chart.register(...registerables, CrosshairPlugin);
Interaction.modes.interpolate = Interpolate;

I am using the Bar Chart on the one Vue Router page and Line Chart (which should have a crosshair plugin enabled) on the other Chart.js instances are separate but the plugin affects both of them

Sinu5oid commented 2 years ago

May it be related to:

Even though initial enabled flag is set as false the defaultOptions object has everything to provide fallback enabled: true values so the plugin will behave as activated even though it's not

BTW, for some reason Chart.js 3.4.0+ has internal unsafe check and it throws an error if option.plugins.* entry in the new Chartjs(el, options) initialization is not an object, so disabling the plugin explicitly as was shown by @vincepolston leads to the error being thrown It may be wrong, at least that's what I am experiencing right now using Chart.js and Vue 2.6.4+ single file component as a wrapper