Google Chart AGL

An example of a Google Geo Chart.

by Alejandro Hernández

HTML

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

JavaScript

google.setOnLoadCallback(drawRegionsMap);

      function drawRegionsMap() {

        var data = google.visualization.arrayToDataTable([
          ['Provincia', 'Cobrado'],
          ['Provincia de Buenos Aires', 3942226.69],
          ['CABA', 7981101.62],
          ['Catamarca', 579.57],
          ['Chaco', 670678.44],
          ['Chubut', 218508.95],
          ['Córdoba', 1706902.88],
          ['Entre Rios', 940101.04],
          ['Formosa', 1771316.68],
          ['Jujuy', 638594.56],
          ['La Pampa', 877779.14],
          ['La Rioja', 463779.96],
          ['Mendoza', 1327981.07],
          ['Misiones', 165429.06],
          ['Neuquén', 626455.22],
          ['Río Negro', 2031157.73],
          ['Santiago del Estero', 4975974.24],
          ['Salta', 381.40],
          ['San Juan', 403430.50],
          ['San Luis', 137061.22],
          ['Santa Cruz', 1922434.86],
          ['Santa Fe', 2486951.21],
          ['Tierra del fuego', 1939.89],
          ['Tucumán', 5931391.32],
        ]);

        var options = {
          region: 'AR',
          displayMode: 'regions',
          resolution: 'provinces',
          displayMode: 'markers',       
          colorAxis: {
            colors: ['#B9F2BD', '#88e38d', '#3DBC45', '#1CAA25']
          },
          datalessRegionColor: 'white',
        };

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

        chart.draw(data, options);
      }