無法使用highcharts-ng更新Highcharts系列點擊事件

我正在使用angular.js和highcharts-ng（https://github.com/pablojim/highcharts-ng）來顯示一組圖表。我需要根據另一個圖表的點擊事件來更新圖表。我可以在控制器中做所有我想做的事情，但是當我在click事件中有代碼時（即使$ scope可用），我似乎無法在設置系列數據後重新繪製圖表。這在控制器的方法中工作正常。無法使用highcharts-ng更新Highcharts系列點擊事件

我曾嘗試使用$ apply，並且在Highcharts.charts數組中查找圖表對象以調用圖表上的重繪，但它無效。我注意到使用highcharts-ng實例化的圖表與在JQuery樣式中實例化的圖表（例如Series.setData）似乎沒有相同的功能。

從這個小提琴（http://jsfiddle.net/gregorydickson/mJjk2/）：

var myapp = angular.module('myapp', ["highcharts-ng"]); 
myapp.controller('myctrl', function ($scope) { 

    $scope.addSeries = function() { 
     $scope.highchartsNG.series = [{ 
      data: [55, 33, 41, 23, 37] 
     }] 
    } 
    $scope.highchartsNG = { 
     options: { 
      chart: { 
       type: 'line' 
      } 
     }, 
     series: [{data: [10, 15, 12, 8, 7]}], 
     title: { 
      text: 'Hello' 
     }, 
     loading: false 
    } 

    $scope.highchartsNG2 = { 
     options: { 
      chart: { 
       type: 'line' 
      } 
     }, 
     series: [{ 
      data: [1, 2, 3, 8, 7], 
      events: { 
         click: function (e) { 
          alert("hit the click"); 
          //this does not work!! 
          $scope.highchartsNG.series = [{ 
           data: [11, 22, 33, 44, 33,22,11]}]; 
         } 
        } 
     }], 
     title: { 
      text: 'Hello 2' 
     }, 
     loading: false 
    } 

});

HTML：

<div ng-app="myapp"> 
    <div ng-controller="myctrl"> 

     <button ng-click="addSeries()">Change Data</button> 

     <highchart id="chart1" config="highchartsNG"></highchart> 
     <highchart id="chart2" config="highchartsNG2"></highchart> 
    </div> 
</div>

來源

2014-07-22 Gregory D. Dickson

我想我可能找到了一個解決方案，它可以直接訪問Highcharts.charts數組中的圖表並調用addSeries（然後刪除其他系列）。 Highcharts.charts [0] .addSeries（{[122，33，44，33，22，11]，true）; –

好的，下面是我要用的解決方案，除非我找到highcharts-ng方法：http://jsfiddle.net/gregorydickson/GCwRj/ –

在這裏使用ng-highcharts 0.0.7運行到同樣的問題。想知道現在是否有更好的解決方案？操縱Highcharts.charts [0]。系列似乎骯髒爲地獄... – saladinxu

我的最終解決方案最終創建了我自己的指令，不使用highcharts-ng並通過在Highcharts中獲取圖表來更新click事件中圖表上的數據。圖表[]（數組）。

point: { 
    events: { 
     click: function(e) { 
      Highcharts.charts[2].setTitle({text:"Load Profile "+ formattedDate},{},false); 
      Highcharts.charts[2].series[0].setData(newday[0].values, false);          
      Highcharts.charts[2].series[1].setData(newday[0].temps, false); 
      Highcharts.charts[2].redraw();

來源

2015-04-09 14:18:01

不是一個完美的，但您可以使用該解決方案：http://jsfiddle.net/mJjk2/14/

series: [{ 
     data: [1, 2, 3, 8, 7], 
     events: { 
      click: function (e) { 
       angular.element('#myselector').trigger('click'); 
      } 
     } 
    }],

但是，如果你不沒有這樣的按鈕可以觸發，它不會起作用。從開發工具，我可以說，$watch()將不會從該回調調用（不知道爲什麼，該插件的作者的好問題）。注意：我不是角度專家;）

來源

2014-07-23 10:44:05

無法使用highcharts-ng更新Highcharts系列點擊事件

回答

相關問題