Angular&高图表.通过程序将状态设置为悬停

Angular & Highcharts. Set state to hover programatically

本文关键字：状态 设置 悬停 程序 过程 amp 高图表 Angular      更新时间：2023-09-26

我有一个50点的图表和下面的50列的表格。50列表包含来自图表的相同数据的详细信息。

当您将鼠标悬停在序列点上时，plotOptions设置为触发悬停函数，该函数获取该点的索引并高亮显示下表行的索引，从而显示数据是相同的。另一方面，当高亮显示表列时，该时段的工具提示将变为悬停状态。使用jQuery，我是这样做的：

//Inside of a jquery mouseover event.
chart.series[0].data[pointIndexNum].setState('hover');

我的问题是我不能在我的控制器中的任何地方为highcharts ng执行setState（'over'）。所以我的问题变成了。。。如何通过Angular程序使工具提示更改悬停状态？

如何通过Angular程序使工具提示更改悬停状态？

直接使用Highcharts对象。例如：

var chart = Highcharts.charts[0];
chart.series[0].data[pointIndexNum].setState('hover');

使用常量服务来包装它，然后将它添加到模块而不是控制器中。

function foo(){
  var chart = Highcharts.charts[0];
  chart.series[0].data[pointIndexNum].setState('hover');
}
angular.module('myApp').constant('HighchartsHoverProgramatically', foo);

参考

  • Highcharts:图表阵列
  • 从遗留代码调用Angular JS
  • AngularJS中提供者之间的差异
  • 模块的AngularJS文档|常量（名称、对象）
相关文章：