2015-08-20 82 views
0

我是新來angularjs和谷歌的圖表,我想在默認情況下,使餅圖傳說方形是circle.here是我的代碼: 這裏是我的index.html中的代碼:如何更改谷歌圖表中的圖例形狀?

  <head> 
      <script src="http://code.angularjs.org/1.2.10/angular.js"></script> 
      <script src="script.js"></script> 
      <script src="http://bouil.github.io/angular-google-chart/ng-google-chart.js"></script> 
     </head> 

     <body ng-controller="MainCtrl"> 
      <div style="padding-left:100px"> 
       my pig pie chart</div> 
     <div google-chart chart="chart" style="width:400,height:300"></div> 
     </body> 

的script.js:

var app = angular.module('myApp', [ 'googlechart' ]); 

    app.controller('MainCtrl', function($scope) { 
     var chart1 = {}; 
     chart1.type = "PieChart"; 
     chart1.data = [ 
     ['Component', 'cost'], 
     ['Software hardware and electrice', 50000], 
     ['Hardware', 80000] 
    ]; 
     chart1.data.push(['Services',20000]); 
     chart1.options = { 
     'legend':'right', 
     'width':400, 
     'height':300 
    }; 
    chart1.formatters = { 
     number : [{ 
     columnNum: 1, 
     pattern: "$ #,##0.00" 
    }] 
    }; 

    $scope.chart = chart1; 

    $scope.aa=1*$scope.chart.data[1][1]; 
    $scope.bb=1*$scope.chart.data[2][1]; 
    $scope.cc=1*$scope.chart.data[3][1]; 
}); 

任何建議,指導我,我該怎麼辦this.thanks

回答

1

有這個沒有記錄選項。餅圖呈現爲SVG,並且小圓圈是<circle>標記,所以您無法使用CSS做到這一點。

它可能做到這一點與JQuery或類似的東西在DOM操作,但由於谷歌圖表API不呈現任何類或ID的圖表元素,無論你想出了會很脆弱,可能很容易被圖表API或圖表本身的改變所破壞。

這是我認爲這屬於「事情會很好,但不值得努力」的類別。