[Chartjs]-Position tooltip based on mouse position

12👍

This isn’t exactly what you asked for, but it’s close:

Chart.Tooltip.positioners.cursor = function(chartElements, coordinates) {
  return coordinates;
};

Then in your graph options:

options: {
  tooltips: {
    mode: 'index',
    position: 'cursor',
    intersect: false
  }
}

7👍

like Devon Sams said, you can use this :

    Chart.Tooltip.positioners.cursor = function(chartElements, coordinates) {
      return coordinates;
    };

But in your graph options you put the mode on ‘label’ and intersect on ‘true’ :

    options: {
      tooltips: {
        mode: 'label',
        position: 'cursor',
        intersect: true
      }
    }

the tooltip pointer will always be over the chart bar/line in the position of the mouse pointer when hovering the data.

Here is an exemple I made on CodePen : Link

Leave a comment