Highcharts - 手动触发点上的悬停事件

Sco*_*ain 19 javascript highcharts

当您将鼠标悬停在Highcharts图表中的某个点上时,您会在光标(或其他符号)下获得一个漂亮的放大圆圈.我想做什么手动触发悬停效果.

我知道我可以在点上手动触发mouseOver事件,但这并没有给我图表上的放大符号.

Sco*_*ain 31

我通过查看源代码找到了答案 - 调用"setState('hover');" 在你想要突出显示的点上.

  • 这是一个设置悬停状态并显示工具提示的jsfiddle:http://jsfiddle.net/xW2MW/(通过[HighCharts论坛](http://highslide.com/forum/viewtopic.php?f=9&t=7094) )). (7认同)
  • 并删除悬停状态,调用"setState();" 没有参数 (4认同)

JMa*_*ues 12

只是添加一个重要信息:

对于StockChart,此解决方案不起作用:

此示例中,您必须替换此:

chart.tooltip.refresh(chart.series[0].data[i]);
Run Code Online (Sandbox Code Playgroud)

对此:

chart.tooltip.refresh([chart.series[0].points[i]]);
Run Code Online (Sandbox Code Playgroud)

这里有一个可能的解决方案.


Do *_*ync 5

以下是如何以编程方式选择(悬停)系列中最后一个有效点的示例:

  // Find last not-null point in data
  let last = data.indexOf(null) - 1;
  last = (last === -2) ? data.length - 1 : last;
  const lastPoint = this.series[0].points[last];

  // Trigger the hover event 
  lastPoint.setState('hover');
  lastPoint.state = '';  // You need this to fix hover bug
  this.tooltip.refresh(lastPoint); // Show tooltip
Run Code Online (Sandbox Code Playgroud)

完整的 JSFiddle 示例

在此输入图像描述