Question

我使用Google可视化来绘制饼图。我想更改图例中颜色圆的半径。

这可能吗？

Google图表的输出如下所示：

self.collectionView.shouldGroupAccessibilityChildren = true

我要修改r =“8”。

以下是饼图的标准示例：

<circle cx="8" cy="8" r="8" stroke="none" stroke-width="0" fill="#de6913" style="
    width: 20px;
"></circle>

Answer 1

您可以在'ready'

上触发chart事件后进行修改

这样的事情会起作用

google.visualization.events.addListener(chart, 'ready', function () {
  var legendCircles = container.getElementsByTagName('circle');
  Array.prototype.forEach.call(legendCircles, function(circle) {
    circle.setAttribute('r', 10);
  });
});

但如果您希望圆圈和标签彼此一致，则使用legend.textStyle configuration option来增加fontSize

请参阅以下工作代码段...

google.charts.load('current', {
  callback: function () {
    var data = google.visualization.arrayToDataTable([
      ['Task',     'Hours per Day'],
      ['Percent',  10],
      ['Rest',     90],
    ]);

    var container = document.getElementById('chart_div');
    var chart = new google.visualization.PieChart(container);

    chart.draw(data, {
      legend: {
        textStyle: {
          fontSize: 24
        }
      }
    });
  },
  packages:['corechart']
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

图例圈半径谷歌图表

1 个答案: