[Chartjs]-ChartJS tooltip when having multiple lines on a time graph

by

2👍

✅

You need to define the hover mode, like this:

options: {
  hover: {
    mode: 'nearest'
  }
}

Here is your example, with the correct hover mode:

0👍

You could explicitly define the tooltips.mode inside the chart options, 'nearest' would be a good choice.

options: {
  tooltips: {
    mode: 'nearest'
  }

nearest: Gets the items that are at the nearest distance to the point.

I’m wondering however why it doesn’t already work as expected because according to Tooltip Configuration, mode: 'nearest' is actually the default. It could be that this wasn’t the case in older versions of Chart.js. Therefore make sure to use the most recent stable version of the library (currently v2.9.3).

Leave a comment