Geo Chart Country Example
An example of a Google Geo Chart.
HTML
<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['geochart']}]}"></script>
<h1>Urban areas by population in New Zealand</h1>
<p>June 2014</p>
<div id="regions_div" style="width: 800px; height: 500px;"></div>
<p class="refer">reference: <a href="http://en.wikipedia.org/wiki/List_of_cities_in_New_Zealand">List of cities in New Zealand / wikipedia</a></p>
CSS
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);
body {
padding:10px;
text-align:center;
font-family:"Open Sans Condensed",Helvetica,sans-serif;
font-size:16px;
color:#737373;
background:#fff;
}
h1 {
font-size:1.5em;
letter-spacing:0.1em;
}
p {
letter-spacing:0.1em;
}
a {
color:#737373;
}
#regions_div {
margin:auto;
}
.refer {
font-size:0.9em;
text-align:right;
}
JavaScript
google.setOnLoadCallback(drawRegionsMap);
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['Voivodeship', 'Turnout'],
['Podlaskie', 75],
['Świętokrzyskie', 25],
['Mazowieckie', 25],
['Malopolskie', 10],
['Lubelskie', 10],
['Lubuskie', 10]
]);
var options = {
region: 'PL',
displayMode: 'regions',
resolution: 'provinces',
backgroundColor: '#e2e2e2',
colorAxis: {colors: ['yellow', 'orange']},
//resolution:'provinces',
};
var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
chart.draw(data, options);
}