4

I'm trying to use Google Visualization Geomap to show italian regions (Sicily, Tuscany...) and then provinces in a region (In Sicily for example Catania, Palermo...).

Showing regions isn't difficult and it works perfectly.

The problem is born when I tried to show provinces in a region centering the map in the wanted region.

Here you can find an example on jsfiddle http://jsfiddle.net/mbutubuntu/uCQRL/1/ .

I've noticed in the documentation of the GeoChart (link: https://developers.google.com/chart/interactive/docs/gallery/geochart#Configuration_Options) that the 'resolution' property can be ['countries', 'provinces', 'metros'].

The doc says also:

'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.

Could be possible that GeoMap doesn't support 'provinces' for Italy? If yes, how could I fix this problem?

Best Regards, F. Buda

Fabio Buda
  • 769
  • 2
  • 7
  • 16
  • I'm sure that GeoMap supports provinces for Italy, because I've used the googleVis package of R, and it works perfectly with Italian cities. So the problem should be somewhere in the code. – Tommaso Nov 20 '12 at 15:32

2 Answers2

2

Maybe there is a new version of Google Chart now.

In this moment, GeoChart is supporting resolution:"provinces" for Italy, but they actually correspond to Regions (Sicily, Sardinia, Piemont, etc.)

It seems that Google Chart supports only one level of subdivision inside a country, calling it equally "province".

Moreover, is not possible set a province as the visible area (param region) of the chart.

squaleLis
  • 6,116
  • 2
  • 22
  • 30
-1

you can use this code https://github.com/rarylson/geochart-geojson with this 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>