以编程方式缩小highcharts-ng

时间:2014-04-09 17:02:04

标签: javascript jquery angularjs highcharts highcharts-ng

我正在使用Highcharts-ng https://github.com/pablojim/highcharts-ng

查看源代码,我看到指令中有一些事情正在使用范围。$ on我可以用来广播。例如......

scope.$on('highchartsng.reflow', function () {
  chart.reflow();
});

然后在我的控制器中,我可以在范围内调用监视功能:

$scope.$watch("someElement", function(nV,oV){
  if(nV===oV) return;
  $scope.$broadcast('highchartsng.reflow');
});

这很好用,很有意义。我不明白的是为什么我不能在指令中添加额外的东西。例如,如果我可以从指令调用.reflow(),我应该能够轻松地调用.zoomOut(),对吗?

// This doesn't work when I add it to the directive..
scope.$on('zoomOut', function() {
  chart.zoomOut();
});

// And broadcast the change from a scope in the controller
$scope.$watch('someElement', function(nV,oV){
    if(nV===oV) return;
    $scope.$broadcast('zoomOut');
});

可以做些什么来完成这项工作?如果它不能完成,我怎样才能让jQuery控制它呢? (甚至可以让jQuery接管指令的某些方面而不是依赖于角度来处理所有事情吗?)

1 个答案:

答案 0 :(得分:2)

那应该有用。正如上面的评论所说,请确保您在正确的范围内调用它。

您可以使用jquery来获取图表的句柄,然后调用您想要的任何方法。请参阅:How can i get access to a Highcharts chart through a DOM-Container

我很难添加许多类型的活动,因为它们会应用于网页上的所有图表,而且看起来并不是一种非常有角色的做事方式。