So erstellen Sie Donut Highchart mit Winkel JS

Question

Ich möchte ein Donut Highchart mit Winkel js erstellen.

Javascript iS

$(function() { 
    $('#container').highcharts({ 
     chart: { 
      plotBackgroundColor: null, 
      plotBorderWidth: 0, 
      plotShadow: false 
     }, 
     title: { 
      text: 'Browser<br>shares<br>2015', 
      align: 'center', 
      verticalAlign: 'middle', 
      y: 40 
     }, 
     tooltip: { 
      pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' 
     }, 
     plotOptions: { 
      pie: { 
       dataLabels: { 
        enabled: true, 
        distance: -50, 
        style: { 
         fontWeight: 'bold', 
         color: 'white', 
         textShadow: '0px 1px 2px black' 
        } 
       }, 
       startAngle: -180, 
       endAngle: 180, 
       center: ['50%', '55%'] 
      } 
     }, 
     series: [{ 
      type: 'pie', 
      name: 'Browser share', 
      innerSize: '50%', 
      data: [ 
       ['Firefox', 10.38], 
       ['IE',  56.33], 
       ['Chrome', 24.03], 
       ['Safari', 4.77], 
       ['Opera',  0.91], 
       { 
        name: 'Proprietary or Undetectable', 
        y: 0.9, 
        dataLabels: { 
         enabled: false 
        } 
       } 
      ] 
     }] 
    }); 
}); 

html is-

<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div> 

und ich bin auch dieser Skripte Dateien -

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script> 
    <script src="https://code.highcharts.com/highcharts.js"></script> 
    <script src="https://code.highcharts.com/modules/exporting.js"></script> 

Wie würde ich das Skript in Winkel js konvertieren. Kann mir jemand dabei helfen? Ich denke, einige Direktive-Funktion muss erstellt werden. Ich bin neu zu benutzerdefinierten Direktiven in eckigen, kann jemand helfen, wie wir dies in eckigen für den Donut Highchart tun?

Answer 1

Keine Notwendigkeit, die Highcharts in Winkel umzuwandeln, wie es bereits existiert. Keine Notwendigkeit, die Abhängigkeiten zu injizieren. Sie können es direkt verwenden. Nur spritzen die highcharts Dateien

<script src="script/chart/highcharts.js"></script> 
<script src="script/chart/highcharts-more.js"></script> 
<script src="script/chart/drilldown.js"></script> 
<script src="script/chart/highcharts-3d.js"></script> 
<script src="script/chart/exporting.js"></script> 

nach Bedarf. und in Controller verwenden Sie direkt das Highcharts.chart ({// Code geht hier}). Hier ist der Link for donut highchart