文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在谷歌图表中改变图例形状？

问如何在谷歌图表中改变图例形状？
EN

Stack Overflow用户

提问于 2015-08-20 07:40:54

回答 1查看 1.9K关注 0票数 0

我对angularjs和google图表很陌生，我想把饼图的图例形状变成方形，默认情况下是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

angularjs

google-visualization

pie-chart

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-08-20 17:45:45

这方面没有记录在案的选项。饼图呈现为SVG，并且这个小圆圈是一个<circle>标记，所以您不能用CSS完成这个任务。

在JQuery中使用DOM操作或类似的操作是可能的，但是由于google不会在任何东西上呈现带有类或ID的图表元素，所以您想出的任何内容都是非常脆弱的，并且很容易被图表API或图表本身的更改所破坏。

我认为这属于“美好但不值得付出的努力”的范畴。

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/32112291

复制

相似问题

问如何在谷歌图表中改变图例形状？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在谷歌图表中改变图例形状？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在谷歌图表中改变图例形状？
EN