2013-04-10 61 views
0

我正試圖在angularjs應用程序中初始化多個highchart。 問題是,只有第一個圖表初始化...有人可以幫助我嗎?Angularjs multiple highcharts

這是我的指令:

app.directive('widget', function() { 
return { 
restrict: 'AC', 
scope: { widgetModel: '=' }, 
replace: true, 
template: 
    '<li id="{{widgetModel.class}}" chartType="{{widgetModel.chartType}}" data-col="{{widgetModel.col}}" data-row="{{widgetModel.row}}" data-sizex="{{widgetModel.sizex}}" data-sizey="{{widgetModel.sizey}}" style="width:200px; height:100px;">'+ 
    '{{widgetModel.text}}, ({{widgetModel.row}},{{widgetModel.col}})'+ 
    '</li>', 
link: function(scope, element, attrs) { 

    var chart1 = new Highcharts.Chart({ 
     chart: { 
     renderTo: attrs.id, 
     type: attrs.chartType, 
     height: attrs.chartheight, 
     animation: false 
     }, 
     xAxis: { 
     categories: [12,13,14,15], 
     labels: { 
      step: attrs.chartStep 

     } 
     }, 
     yAxis: { 
     title: { 
      text: '' 
     } 
     }, 
     series: [{ 
     data: [1,2,3,4], 
     name: "ciccio" 
     }] 
    }); 
} 
    }; 
}); 

編輯:

我創建了一個小提琴:http://jsfiddle.net/Tropicalista/mtKJ8/33/

+0

控制檯中的任何錯誤?另外,放在'var chart1 = ..'之前就是這樣:'console.log('dummy')'讓我們知道你可以在控制檯中看到它多少次。如果一次,'link'只被調用一次。 – 2013-04-10 14:39:12

+0

控制檯沒有錯誤。我在我的控制檯中看到Dummy 4 ... – Tropicalista 2013-04-10 14:43:30

+0

好的,你的小提琴有很多錯誤..一般來說,Highcharts需要下列其中之一:jQuery/prototype/mooTools。 Angularjs不被支持,所以你需要或者適配angularjs,或者包含jQuery。 – 2013-04-10 15:31:22

回答

相關問題