有没有办法将重点放在chart.js中的图表上?
像它们悬停在上方会变大还是可见?

我正在尝试构建固定的工具提示,您将不断捕获悬停的点,并且在画布上单击时将捕获单击的点或最接近的点,并强调它并固定工具提示的值。
再次单击时,工具提示应继续捕获悬停的点,并且重点应消失。

我试图找到一种方法来做到这一点,但无法得出任何结论。使用getPointsAtEvent可以获取积分,但是随后更改属性并在画布上进行更新似乎没有结果。我尝试更新或重新绘制画布,但没有以任何方式更改画布。

任何帮助都是最欢迎的。

编辑

我有办法做些事。
通过自定义工具提示,我创建了一个固定的工具提示(根据要求)。
然后,我在画布的div上使用click事件,该事件将使用getPointsAtEvent。
这样做有一些问题,首先它返回许多值而不是一个值,这使其不精确(增加精度的一种方法会很不错)。

为了强调起见,我应该在顶部创建一个画布,但是随后调用showtooltip会将其删除。

再次欢迎任何帮助。

最佳答案

以下是在ChartJS中强调悬停图表点的3种方法:


ChartJS具有built-in tooltips-将其签出!
通过设置图表的高亮属性,ChartJS还具有内置的悬停强调功能。高亮属性在某些图表类型上为hightlight,在其他图表类型上为highlightFill + highlightStroke
另外,如果要进行一些自定义的强调,则可以在画布上的mousemove处理程序内使用getPointsAtEvent。您需要侦听画布的mousemove事件,因为画布上的单个图形(图表点)不会引发自己的单个事件。此方法“昂贵”,因为每次鼠标移动时都必须切换点属性。您可以通过在统计图画布上分层放置第二个画布并将重点放在该第二个顶部画布上来降低“昂贵”。每次移动鼠标都可以轻松清除顶部画布,从而使其维护起来“便宜”一些。

09-16 16:51