angularjs和highcharts/highchartsNG - renderTo不起作用

在Angular中使用HighChartsNG。我想明確地呈現我的圖表中給定的股利，所以我用了options.chart.renderTo =「DIVID」，但似乎並不奏效angularjs和highcharts/highchartsNG - renderTo不起作用

JSFiddle Demo

HTML：

<div ng-app="myapp"> 
    <div ng-controller="myctrl"> 
     <div>top</div> 
     <hr/> 
     <div id="middle">middle</div> 
     <hr/> 
     <div>bottom</div> 
     <hr/> 
     <highchart id="chart1" config="highchartsNG"></highchart> 
    </div> 
</div>

var myapp = angular.module('myapp', ["highcharts-ng"]); 

myapp.controller('myctrl', function ($scope) { 
    $scope.highchartsNG = { 
     options: { 
      chart: { 
       type: 'bar', 
       renderTo: 'middle' 
      } 
     }, 
     series: [{ 
      data: [10, 15, 12, 8, 7] 
     }], 
     title: { 
      text: 'Hello' 
     }, 
     loading: false 
    } 

});

在上面的例子中，我想明確地呈現在圖表中「中等」的div，但這並不似乎發生。我究竟做錯了什麼？

來源

2015-04-15 sppc42

簡短的回答是，你不應該使用renderTo用角度，這個選項是違反主角/唯一規則的一個角度，這不會讓你的控制器知道或需要特定的視圖。在想要顯示的地方使用highcharts指令有什麼問題？ – shaunhusain

看看是否有幫助http://jsfiddle.net/csTzc/ – Reena

就我所見，這是不可能的。 highcharts-ng.js總是將圖表呈現爲element[0]。這是在角度指令的link函數內初始化的。覆蓋配置選項中提供的值。

這是一個減少調用堆棧，並從highcharts-ng.js

link: function (scope, element, attrs) { 
... 
    var mergedOptions = getMergedOptions(scope, element, config); 
... 
} 

var getMergedOptions = function (scope, element, config) { 
... 
    mergedOptions.chart.renderTo = element[0]; //line 96 
... 
}

來源

2015-04-16 06:23:39 Ahmad

提取既然你的狀態，你想你的圖表呈現從highcharts使用renterTo定格，問你在做什麼錯，最好的答案可能是你根本不應該使用renderTo。正如在另一個答案中，它似乎不適用於HighChartsNG。

給你仍然解決當前的問題：只需將HighChartsNg的指令到哪裏如下它應該顯示在div：

<div ng-app="myapp"> 
    <div ng-controller="myctrl"> 
     <div>top</div> 
     <hr/> 
     <div id="middle">middle 
      <highchart id="chart1" config="highchartsNG"></highchart> 
     </div> 
     <hr/> 
     <div>bottom</div> 
     <hr/> 
    </div> 
</div>

來源

2015-04-16 06:58:13 Amstutz

angularjs和highcharts/highchartsNG - renderTo不起作用

回答

相關問題