未在反应式Google图表的地理位置图表中标记加拿大省

Question

[我正在尝试在反应Google图表中通过geochart显示加拿大的省。但是，即使对应于该省份的abv是正确的，这些省份也不会突出显示。但是“人口百分比”的值会显示在图表中（图表底部的栏）

下面是我的代码。

 <Chart
        width={"100%"}
        height={"100%"}
        chartType="GeoChart"
        data={[
          ["abv", "population%"],
          ["AB", 2],
          ["NS", 3]
        ]}
        mapsApiKey={GOOGLE_API_KEY}
        //rootProps={{ "data-testid": "1" }}
        options={{
          region: "CA",
          resolution: "provinces"
        }}
      />

但是当我尝试通过为区域和美国省份提供"US"作为数据来尝试相同的代码时，它就可以很好地工作！

我在这里缺少什么吗？无法弄清楚我做错了什么。

谢谢

Answer 1

选项-> resolution: "provinces"-使各省成为概述并且应该可以在加拿大正常使用-> region: "CA"

为了突出显示一个省，在abv之前加上-> "CA-"-在-> "CA-AB"

中

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

google.charts.load('current', {
  'packages': ['geochart'],
  'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
});
google.charts.setOnLoadCallback(drawRegionsMap);

function drawRegionsMap() {
  var data = google.visualization.arrayToDataTable([
    ["abv", "population%"],
    ["CA-AB", 2],
    ["CA-NS", 3]
  ]);

  var options = {
    region: "CA",
    resolution: "provinces",
    colors: ['blue', 'green']
  };

  var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));

  chart.draw(data, options);
}

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