如何在谷歌图表中更改图例形状?

问题描述 投票:0回答:1

我是angularjs和谷歌排行榜的新手,我想让饼图的图例形状正方形默认为圆形。这是我的代码:这是我在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];
});

任何建议指导我如何做到这一点。谢谢

angularjs google-visualization pie-chart
1个回答
1
投票

没有记录的选项。饼图呈现为SVG,小圆圈是<circle>标记,因此您无法使用CSS执行此操作。

有可能在JQuery或类似的东西中使用DOM操作来做这件事,但由于谷歌图表API不会在任何内容上呈现带有类或ID的图表元素,因此无论你想出什么都会非常脆弱并且可能很容易被破坏更改图表API或图表本身。

我认为这属于“事情本来不错,但不值得努力”的范畴。

© www.soinside.com 2019 - 2024. All rights reserved.