Google Geochart - 无法将区域设置为特定省份

Question

我正在尝试显示魁北克省地图中城市的城市标记。根据 google 文档，我们应该能够将 resolution 选项设置为 provinces 并将 region 设置为 ISO 代码（例如：US-GA..）。当我尝试使用 CA-QC 时（找到此代码 here on wikipedia。

当我尝试此操作时，地图 <div> 显示此消息：请求的地图不存在

参见Fiddle：

      google.setOnLoadCallback(drawRegionsMap);

      function drawRegionsMap() {

        var data = google.visualization.arrayToDataTable([
          ['City', 'Popularity'],
          ['Quebec', 200],
          ['Montreal', 300],
          ['Sorel-Tracy', 400],
          ['Boucherville', 500]
        ]);

        var options = {  enableRegionInteractivity: 'true',resolution: 'provinces', region:'CA-QC'};

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

        chart.draw(data, options);
      }

<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['geochart']}]}"></script>
       <div id="regions_div" style="width: 900px; height: 500px;"></div>

我有 way/workaround 可以做到这一点吗？

谢谢

Answer 1

将区域更改为 region:'CA'

Answer 2

似乎无法在该国家/地区设置地区。

根据Visualization: Geochart：

'provinces' - Supported only for country regions and US state regions. Not supported for all countries; please test a country to see whether this option is supported.

但您可以考虑另一种选择，使用 circle markers 而不是 geocharts 来吸引人气，如下所示：

function initialize() {
    var mapOptions = {
        zoom: 6,
        center: new google.maps.LatLng(46.579246, -72.024826)
    };
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    displayPopularity(map);
}


function displayPopularity(map) {
    var citymap = {};
    citymap['Quebec'] = {
        center: new google.maps.LatLng(46.769492, -71.290357),
        population: 200
    };
    citymap['Montreal'] = {
        center: new google.maps.LatLng(45.510845, -73.567888),
        population: 300
    };
    citymap['Sorel-Tracy'] = {
        center: new google.maps.LatLng(46.421575, -73.118540),
        population: 400
    };
    citymap['Boucherville'] = {
        center: new google.maps.LatLng(45.601591, -73.438919),
        population: 500
    };


    for (var city in citymap) {
        var populationOptions = {
            strokeColor: '#00FF00',
            strokeOpacity: 0.8,
            strokeWeight: 2,
            fillColor: '#00FF00',
            fillOpacity: 0.35,
            map: map,
            center: citymap[city].center,
            radius: Math.sqrt(citymap[city].population) * 1000
        };
        var cityCircle = new google.maps.Circle(populationOptions);


        (function (cityCircle,city) {

            //create info window
            var infoWindow = new google.maps.InfoWindow({
                content: city
            });

            google.maps.event.addListener(cityCircle, 'click', function(ev) {
                infoWindow.setPosition(cityCircle.getCenter());
                infoWindow.open(map);
            });
        })(cityCircle,city);
    }
}

google.maps.event.addDomListener(window, 'load', initialize);

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Popularity map</title>
    <style>
        html, body, #map-canvas {
            height: 100%;
            margin: 0px;
            padding: 0px;
        }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
</head>
<body>
    <div id="map-canvas"></div>
</body>
</html>

Google Geochart - 无法将区域设置为特定省份

Google Geochart - Unable to set region to a specific province

javascript

google-maps

google-visualization