chart.js - I want the tooltip of the chart to be shown when a button is pressed

Question

I made a donut chart in chart.js (3.9.1) using vue2. (In fact, I made it using primevue, but primevue says chart.js) I made as many buttons as the length of data in the data set, and when I mouse hover this button, I want the tooltip of the chart sequence corresponding to the index of the button to be displayed. So I made a function that works when the button is pressed, and the logic inside the function is as follows.

I put only part of the text below. but you will understand. I was hoping this would cause the third tooltip of the chart to appear when hovering over the button.

But the following error pops up. Uncaught TypeError: Cannot read properties of null (reading 'getLabelAndValue') The location where this error occurs was function createTooltipItem (line 8443) in chart.mjs.

As I guess, it seems to be an error because the controller object of the createTooltipItem function is not created because the button outside the chart is hovered. How to solve it?

I wish you could help me.

ps. I wrote this article using translator. I hope you understand.

let chartValue = this.$refs.doughnut.chart;

document.getElementById(button_x).onmouseover = function (event) {
  chartValue.tooltip.setActiveElements([
    {datasetIndex: 0, index: 3}
  ]);

  this.$refs.doughnut.refresh();
}