Skip to content

Instantly share code, notes, and snippets.

@gerryster
Created December 8, 2012 23:13
Show Gist options
  • Save gerryster/4242467 to your computer and use it in GitHub Desktop.
Save gerryster/4242467 to your computer and use it in GitHub Desktop.
US State Map using the GeoChart from the Google Chart Tools
// GeoChart from https://google-developers.appspot.com/chart/interactive/docs/gallery/geochart
// Try out by pasting code into: https://code.google.com/apis/ajax/playground/?type=visualization#geo_chart
function drawVisualization() {
var data = google.visualization.arrayToDataTable([
['State', 'Foo Factor'],
['US-IL', 200],
['US-IN', 300],
['US-IA', 20],
['US-RI', 150]
]);
var geochart = new google.visualization.GeoChart(
document.getElementById('visualization'));
geochart.draw(data, {width: 556, height: 347, region: "US", resolution: "provinces"});
}
@mrbrianevans
Copy link

If you do resolution: "metros" in options it divides each state into districts.
The only thing I can't find is a list of the name of the districts that are recognized by Google Charts. If anyone can find this it would be very helpful! Ideally, I would like to use county names

@mdesoto
Copy link

mdesoto commented Mar 16, 2024

If you do resolution: "metros" in options it divides each state into districts. The only thing I can't find is a list of the name of the districts that are recognized by Google Charts. If anyone can find this it would be very helpful! Ideally, I would like to use county names

Check out what I found about metros: google/google-visualization-issues#938 (comment).

@RobertSeymour1
Copy link

Fantastic!! Thanks. I could not find this anywhere.
I created a world one for the BirdBreath countries. https://birdbreath.com/scripts/map.php :)

@RobertSeymour1
Copy link

RobertSeymour1 commented Jul 2, 2025

var options = {
      defaultColor: 'red'
};

Is this allowed, like on countries? If so, it is not working. If not what should it be?

@RobertSeymour1
Copy link

It returns green.....

@RobertSeymour1
Copy link

Problem solved!!
var options = {
defaultColor: "red",
width: 900,
height: 500,
region: "US",
resolution: "provinces"
};

var geochart = new google.visualization.GeoChart(document.getElementById('visualization'));
      geochart.draw(data, options);
  }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment