AbelHeinsbroek / chartjs-plugin-crosshair

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

Hi i use plugin chartjs angular, i have error chart.crosshair is undefined how to fix this #128

Open chetdi117 opened 10 months ago

akenshaw commented 10 months ago

I had the same problem. It was a scale type that I'm using but not included in the plugin for me.

If the chart.crosshair is undefined, the plugin probably just doing a "return", before it can create "chart.crosshair";

var CrosshairPlugin = {

  id: 'crosshair',

  afterInit: function(chart) {    
    // I've checked what properties I had on "chart" with "debugger;"
    if (!chart.config.options.scales.x) {
      // make sure that your x axis named just "x", it won't allow xAxis0 or anything custom like that. 
      return  
    }

    var xScaleType = chart.config.options.scales.x.type;

    if (xScaleType !== 'linear' && xScaleType !== 'time' && xScaleType !== 'category' && xScaleType !== 'logarithmic' && xScaleType !== 'timeseries') {
      /* I had "timeseries" type x scale, which wasn't included in here, I saw no reason why on the later parts of the plugin, so after adding, seems to solved it for me. */
      return;
    }

    if (chart.options.plugins.crosshair === undefined) {
      chart.options.plugins.crosshair = defaultOptions;
    }

    chart.crosshair = {
      enabled: false,
      suppressUpdate: false,
      x: null,
      originalData: [],
      originalXRange: {},
      dragStarted: false,
      dragStartX: null,
      dragEndX: null,
      suppressTooltips: false,
      ignoreNextEvents: 0,
      reset: function() {
        this.resetZoom(chart, false, false);
      }.bind(this)
    };
// the rest of the plugin...
firebird631 commented 1 month ago

I had issue too. It does not init when using "timeseries".