角度餅圖

Question

使用哪個角度包我們可以設計這種類型的餅圖？

PIE Chart（打開這對於餅圖模型）

注：需要標籤以同樣的方式

在此先感謝

Answer 1

使用nvd3庫，使用起來非常簡單，易於注入您的控制器。

這裏有一個例子來理解

app.controller('MainCtrl', function($scope) { 
$scope.options = { 
      chart: { 
       type: 'pieChart', 
       height: 450, 
       donut: true, 
       x: function(d){return d.key;}, 
       y: function(d){return d.y;}, 
       showLabels: true, 
       labelsOutside: true, 
       pie: { 
        startAngle: function(d) { return d.startAngle/2 -Math.PI/2 }, 
        endAngle: function(d) { return d.endAngle/2 -Math.PI/2 } 
       }, 
       duration: 500, 
       legend: { 
        margin: { 
         top: 5, 
         right: 70, 
         bottom: 5, 
         left: 0 
        } 
       } 
      } 
     }; 

     $scope.data = [ 
      { 
       key: "One", 
       y: 5 
      }, 
      { 
       key: "Two", 
       y: 2 
      }, 
      { 
       key: "Three", 
       y: 9 
      }, 
      { 
       key: "Four", 
       y: 7 
      }, 
      { 
       key: "Five", 
       y: 4 
      }, 
      { 
       key: "Six", 
       y: 3 
      }, 
      { 
       key: "Seven", 
       y: .5 
      } 
     ]; 
}); 

http://plnkr.co/edit/OlROrZ?p=preview