意大利各省（非地区）的谷歌地理地图可视化答案

【问题标题】：Google Geomap visualization for Italian Provinces (not regions)意大利各省（非地区）的谷歌地理地图可视化
【发布时间】：2012-06-24 18:19:28
【问题描述】：

我正在尝试使用 Google Visualization Geomap 显示意大利地区（西西里岛、托斯卡纳...），然后显示某个地区的省份（在西西里岛，例如卡塔尼亚、巴勒莫...）。

显示区域并不难，而且效果很好。

当我试图在地图中心显示区域中的省份时，问题就出现了。

您可以在此处找到关于 jsfiddle http://jsfiddle.net/mbutubuntu/uCQRL/1/ 的示例。

我在 GeoChart 的文档（链接：https://developers.google.com/chart/interactive/docs/gallery/geochart#Configuration_Options）中注意到“分辨率”属性可以是 ['countries'、'provinces'、'metros']。

文档还说：

'provinces' - 仅支持国家地区和美国州地区。并非所有国家/地区都支持；请测试一个国家，看看是否支持此选项。

GeoMap 可能不支持意大利的“省”吗？如果是，我该如何解决这个问题？

最好的问候， F.布达

【问题讨论】：

我确信 GeoMap 支持意大利的省份，因为我使用了 R 的 googleVis 包，它与意大利城市完美配合。所以问题应该出在代码的某个地方。

标签： javascript google-visualization geomap

【解决方案1】：

也许现在有一个新版本的谷歌图表。

此时，GeoChart 支持意大利的resolution:"provinces"，但它们实际上对应于地区（西西里岛、撒丁岛、皮埃蒙特等）

Google Chart 似乎只支持一个国家内部的一级细分，同样称其为“省”。

另外，无法将省份设置为图表的可见区域（参数region）。

【讨论】：

【解决方案2】：

您可以使用此代码 https://github.com/rarylson/geochart-geojson 有了这个geojson https://github.com/Dataninja/geo-shapes/blob/master/italy/provinces.geojson

    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?key=<YOURKEY>"
    </script>
    <script type="text/javascript" src="https://cdn.rawgit.com/rarylson/geochart-geojson/master/build/geochart-geojson.min.js"></script>

    <script type="text/javascript">
      google.charts.load("current");
      google.charts.setOnLoadCallback(drawVisualization);

      function drawVisualization() {

        // Create and populate a data table
        var data = new google.visualization.DataTable();
        data.addColumn("string", "City");
        data.addColumn("number", "Value");
        data.addRows([
          ["VERCELLI", 10],
          ["NOVARA", 5],
        ]);

        // Instantiate our Geochart GeoJSON object
        var vis = new geochart_geojson.GeoChart(document.getElementById("mydiv"));

        // Set Geochart GeoJSON options
        var options = {
          mapsOptions: {
            center: {lat: 42, lng: 12},
            zoom:6

          },
          geoJson: "https://raw.githubusercontent.com/Dataninja/geo-shapes/master/italy/provinces.geojson",
          geoJsonOptions: {
            idPropertyName: "NOME_PRO"
          }
        };

        // Draw our Geochart GeoJSON with the data we created locally
        vis.draw(data, options);
      }
    </script>
  </head>

  <body>
    <div id="mydiv" style="width: 900px; height: 560px;"></div>
  </body>

【讨论】：