title: Chart JS Crosshair - Linked Charts without linked Legends
body: <p>I have an application using Chart JS and the great extension <a href="https://github.com/AbelHeinsbroek/chartjs-plugin-crosshair" rel="nofollow noreferrer">chartjs-plugin-crosshair</a> to provide zoom and a vertical line on hover. It's ability to 'link' charts is critical as it highlights values on separate charts across the same x-axis.</p>
  <p>The issue is the linked charts also have linked legends. I've created a simple example: <a href="https://codepen.io/sheixt/pen/JjGvbVJ" rel="nofollow noreferrer">https://codepen.io/sheixt/pen/JjGvbVJ</a></p>
  <p>Here is an extract of the Chart <code>option</code> config (see the link for the full script):</p>
  <pre><code>const options = {
    plugins: {
      crosshair: {
        sync: {
          enabled: true
        }
      }
    },
    tooltips: {
      mode: &quot;interpolate&quot;,
      intersect: false,
      callbacks: {
        title: function (a, d) {
          return a[0].xLabel.toFixed(2);
        },
        label: function (i, d) {
          return d.datasets[i.datasetIndex].label + &quot;: &quot; + i.yLabel.toFixed(2);
        }
      }
    }
  };
  </code></pre>
  <p>As you can see, if you &quot;turn off&quot; a dataset (e.g. Dataset 1, <strong>A</strong> in <em>chart 1</em>, <strong>D</strong> in <em>chart 2</em>, and <strong>G</strong> in <em>chart 3</em>), the dataset is removed from all of the linked charts.</p>
  <p>I have a series of charts that are based on the same x-axis data so the crosshair line &amp; the tooltip appearing on all of the linked charts is ideal. But as each dataset that is plotted is not the same across the various charts, I do not want it to disappear on click.</p>
  <p>So in my example deselecting Dataset 1 on <em>chart 1</em> <strong>A</strong> would be removed but <strong>D</strong> in <em>chart 2</em>, and <strong>G</strong> in <em>chart 3</em> should remain.</p>
  <p>Is this feasible?</p>