Question

我正在使用Google API中的GEO图表。我需要知道国家/地区边界的颜色是否可以更改吗？这可能有助于我根据为图表选择的填充颜色更好地区分国家/地区。

Answer 1

没有用于更改边框颜色的配置选项，
但您可以在图表的'ready'事件中进行手动更改。

每个国家/地区都将带有一个<path>元素。
每个<path>元素都有一个stroke属性，
这是边框颜色。

var countries = container.getElementsByTagName('path');
Array.prototype.forEach.call(countries, function(path) {
  path.setAttribute('stroke', 'red');
});

请参阅以下工作片段...

google.charts.load('current', {
  packages: ['geochart'],
  mapsApiKey: 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    ['Country', 'Popularity'],
    ['Germany', 200],
    ['United States', 300],
    ['Brazil', 400],
    ['Canada', 500],
    ['France', 600],
    ['RU', 700]
  ]);

  var container = document.getElementById('chart_div');
  var chart = new google.visualization.GeoChart(container);

  google.visualization.events.addListener(chart, 'ready', function () {
    var countries = container.getElementsByTagName('path');
    Array.prototype.forEach.call(countries, function(path) {
      path.setAttribute('stroke', 'red');
    });
  });

  chart.draw(data, {
    legend: 'none'
  });
});

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

Google Chart API：地理图表边界颜色

1 个答案: