Chart.js 条形图：在标签悬停时显示工具提示

Question

我正在使用Chart.js库绘制条形图，并希望在鼠标悬停在x轴标签上时，不仅在条形上显示工具提示，而且也能显示。我找到了onHover方法进行配置，但它只允许我访问当前悬停条的数组，这并没有什么用。

那么，我该如何访问鼠标事件，或者从中获取位置以与条形标签位置进行比较？还有另一种方法吗？

我的当前配置：

const countryChartOptions = {
    hover: {
         onHover: this.onChartHover,
    },
};

const onHover = (activeElements) => {
    console.log(activeElements);
};

它只会打印悬停的条形数据，但我卡在如何扩展它以满足我需要的行为上。

- kemsbe

Answer 1

关于什么：

options: {
  tooltips: {
    // Add this..
    intersect: false
  }
}

- l2aelba

Answer 2

这对我有效

  options: {
      tooltips:{
      intersect : false,
      mode:'index'
      }
   }

- Shivam Vyas

---

选项“index：'mode'”起了决定性作用。没有它，工具提示与光标不对齐。例如，光标位于“9”上，工具提示显示标签“5”的值（或类似的内容）。在我看来，这是正确的答案。 - Almir Campos