Highcharts使用Angular和ng-highcharts數據更新的平滑過渡

Question

我最近做了一個嚴格在jquery中工作的高圖的原型。我有一堆意大利麪條代碼，但是在選擇一個可以動畫圖表並更新系列的控制器時，我也有一個很好的過渡動畫。總之，像這樣做...

var chart = new Highcharts.Chart(chartOptions); 
// ... 
$('select#dropdown').change(function(){ 
    // ... 
    chart.series[0].setData(/*data*/, false); 
    chart.series[1].setData(/*data*/, false); 
    chart.series[2].setData(/*data*/, false); 
    // ... 
    chart.redraw(); 
} 

所以，（1）在頁面加載初始化圖表，（2）從注意到一個下拉框的參數（3）決定什麼新的值是一個給定系列和（4）平滑地將圖表重新繪製爲該值。

我的問題是我有一個非常困難的時間重新生產這個角度。特別是highcharts-ng，除了更新現有點之外，它似乎在陽光下都有例子。

http://pablojim.github.io/highcharts-ng/examples/example.html

有類似的事情繫列添加，刪除系列等有關更新一系列的什麼？如果我們想要一個與範圍變量相關的系列，而這個範圍變量不斷變化呢？我如何製作一個$ scope。下拉框中的$ watch指示圖表更新點數？

Answer 1

關鍵是要更新系列中的數據數組，而高層圖會照顧到平滑過渡。 例如：

$scope.chartConfig.series[0].data = rnd; 

在這裏，我已經更新的例子，爲您展現平滑升級過渡： JsFiddle

並與下拉一個例子，看： JsFiddle

希望有所幫助。如果您對其工作方式有任何疑問，請告知我們。