React Highcharts piechart show tooltip on click outside of highcharts container - reactjs

Question

I am having a "Donutchart" using highcharts and a selfmade legend for that chart. When i click on an element of the legend, i want to trigger the "mouseOver" or "click" event of that container, so that the chart shows the respective area, belonging to the element of the legend. Basically i want the tooltip to show up.
The Piechart Code:
let chartOptions = {
chart: {
plotBackgroundColor: null,
plotBorderWidth: 0,
plotShadow: false,
},
title: {
text: `Title`,
},
plotOptions: {
pie: {
dataLabels: {
enabled: false,
distance: -125,
y: -5,
format: "{y}%",
style: {
fontWeight: "bold",
color: "black",
fontSize: "12px",
},
},
borderWidth: 3,
},
series: {
animation: false,
},
},
tooltip: {
shared: true,
},
series: [
{
type: "pie",
name: "",
tooltip: {
valueDecimals: 2,
valueSuffix: " USD",
},
innerSize: "60%",
data: data_array,
},
],
};
Example button:
<div className='mb_3px mt_3px cursor_pointer color_blue'
onClick={() => {
handleSimulateMouseOver(
item.index
);
}}
>
{truncate(
object[
item.index
].name,
39
)}
</div>
In older posts i found a function called setState('hover'), which i can't bring to work in react, that looks like the following:
let handleSimulateMouseOver= (index) => {
chartOptions.series[0].data[index].setState('hover');
chartOptions.tooltip.refresh(chartOptions.series[0].data[index]);
};

Answer 1

There is an event to trigger callback after legend item click - API: https://api.highcharts.com/highcharts/series.line.events.legendItemClick
Have you tried to use it?