将鼠标悬停在图例标签上并突出显示特定的数据集索引

Question

我目前正在面对react chartjs2的问题。当鼠标悬停在图例LABEL上时，我想突出显示一个特定的数据集。 ？

我无法使用react chartjs-2函数通过单击图例/轴来捕获事件。 （getDatasetAtEvent，onElementsClick，getElementAtEvent）。以下代码适用于普通的chartjs库。是否有使用反应库做类似事情的等效方法

                    legend: {
                        display: true,
                        position: 'bottom',
                        labels: {
                          fontColor: isDarkMode ? theme.palette.common.black : theme.palette.common.white,
                          usePointStyle: true,
                          padding: 10,
                          fontSize:12
                        },
                        onHover: function(event, legendItem) {
                          var options = this.options || {};
                          var hoverOptions = options.hover || {};
                          var ci = this.chart;
                          hoveredDatasetIndex = legendItem.datasetIndex;
                          ci.updateHoverStyle(ci.getDatasetMeta(hoveredDatasetIndex).data, hoverOptions.mode, true);
                          ci.render();
                        }
                      },

我也尝试过在LEGEND上打印onHover元素。我只能打印文本，但不能打印索引。

             onHover: (e, item) => {
                            alert(`Item with text ${item.text} and index 
                            ${item.index} hovered`)
                            console.log(e)

              },

这似乎比我想的要难。