Create an interaction mode, that will be the point interaction + index interaction

[victorkardel]

I want help to create a interaction mode for tooltip.

When the user hover to an exact point will show the data for this point like that.

And everywhere else that is not a exactly point show index mode interaction:

Any one ever had to do something like that ?

[rushikesh-nage]

[victorkardel]

You might not get into what I need, I don't need a proper position! I need a new interaction mode that is the merge between the point interaction mode and the index interaction mode!

[stockiNail]

@vcctm you should create a custom interaction which should invoke the point interaction, and if the result is empty then invoke the index one.

Here is the code:

Interaction.modes.pointIndex = function(chart, e, options, useFinalPosition) {
  const pointItems = Interaction.modes.point(chart, e, {axis: 'xy', intersect: true}, useFinalPosition);
  if (!pointItems.length) {
    return Chart.Interaction.modes.index(chart, e, {axis: 'x', intersect: false}, useFinalPosition);
  }
  return pointItems;
};

Here is the codepen to see it in action: https://codepen.io/stockinail/pen/ExeomVx

[Udemology]

Absolutely gold, you make it look so easy. I tried to figure it out as well but could not get any result.