The simplest way for my students and community partners to create thematic data maps is with Google Fusion Tables (GFT), a freely accessible tool for managing, merging, and visualizing data on the web. GFT requires a free Google Drive account (use a regular Google username; avoid limited-access Google Apps account). For general information, see the GFT tour and also the GFT Help Page. Acknowledgement: This tutorial was originally based on Create A Map, kh-samples, Google Code.
The goal of this tutorial is to upload and merge two tables (data and boundaries), create an interactive thematic map (without legend), and embed it in a WordPress post:
Percent minority students in Hartford-area school districts, 2009-10
click map to view underlying data Sources: CT Dept of Ed, MAGIC UConn Libraries
Download and understand your data
Before starting to map, closely examine your data files to understand their meaning, sources of origin, and limitations.
1) Click on the sample spreadsheet data to download to your desktop, open the file, and examine it.
spreadsheet data (in Excel .xls format) racial composition of Hartford-area school districts, 2009-10, from the Connecticut Department of Education, CEDAR data site
2) Click on the sample map boundary data to download to your your desktop, open the file, and examine it.
boundary data (.kml format) Connecticut town boundaries, Census 2010, from MAGIC UConn Libraries, boundary data page
Advanced tip: This file is in .kml format, Keyhole Markup Language, and will automatically open if you have downloaded the free Google Earth application. If you download other boundary files from the MAGIC site, they will first appear in a compressed kml format (labeled as .kmz), which must be converted to .kml for GFT. Open the .kmz file in Google Earth, right-click on desired layer in Places window, then Save Places As in .kml format.
Upload spreadsheet and boundary data to Google Fusion Tables account
1) Sign in to your Google Drive account, and go to Create > More > Fusion Table (beta).
2) Import your spreadsheet table by selecting the Browse button and navigating to the file you previously downloaded. Click Next to confirm the data, click Next again to add any source information you desire, then click Finish.
3) Repeat the steps above to upload the .kml boundary data.
Merge the spreadsheet table with the boundary table (the “fusion” part)
1) In your web browser, go to the Google Fusion Table spreadsheet tab (which should already be open; if not, click on it in your Google Drive tab). Click on File > Merge:
2) Select the table you wish to merge with your spreadsheet table. (In this example, choose the geographic boundary table.)
3) Confirm the data columns that are common to both tables to complete the merge. In this example, select “Name” under the boundary table to match up school districts with town boundaries. (The list of names in each column is not identical, but the TYPE of data they represent matches.) Click Next, merge all columns, and View the newly merged table.
Create and Style a Thematic Map with Info Windows
1) To modify the thematic map in your new merged table, select Map of Geometry > Change map styles.
2) To modify the thematic map, select Polygons > Fill Color, and experiment with Buckets and Gradients to modify the thematic map shading. Hint: for this exercise, if you choose to map a racial percentage column (rather than raw numbers), change the scale from 0 to 1 (or 0% to 100%).
See also Mark Monmonier, How to Lie with Maps, Second Edition (University of Chicago Press, 1996), pp. 39-42 excerpt on how same data can be spatially represented in very different ways, by modifying thematic map categories and cut-offs.
See also ColorBrewer for advice on designing thematic map colors and categories.
3) To modify the data displayed in map pop-up windows, go to Map of Geometry > Change Info Window Layout.
Embed the interactive map in a WordPress post (or any web page)
1) Click the Share button in upper-right corner to change the visibility settings of the merged table from the default (Private) to Anyone with the Link, or Public:
2) Modify map position and zoom level, then select Map of Geometry > Publish.
3) Modify the map width and height to match space allocated by your WordPress theme. (My theme works best with 600 x 400.) Copy code in the “Paste HTML to embed” field.
4) Some WordPress platforms (such as TrinityCommons) require the activation of a special plugin, such as iframe, to correctly process the HTML embedded map code. If you have not already done so, install or activate this plugin, located near bottom of the plugins list.
5) In the WordPress editor, switch from the Visual to the HTML tab, and paste the embed code from above. Add square brackets at beginning and end, and edit a few characters to match this format (called a “shortcode”), then publish to view post.
Next steps to come:
how to create a legend for Google Fusion Tables map — in meantime, see sample














I like the design of laying the photos/screenshots into the text without a border and on a white background. It is literally seamless, and easy to follow the images.
Love the post. Any tips on how to add Google map with 2 overlayed fusion table layers and a custom CSS legend. The code includes javascript to use the GFT API.
Johnathan, you’re in terrain that’s a bit beyond my current skill set. Perhaps check out Derek Eder’s site, if you haven’t done so already.
Thank you for the suggestion!
Pingback: Visual journalism is ‘not just for the big boys’ « MDLF Knowledge Bridge
readers of this will also like the tool http://fusion-tables-api-samples.googlecode.com/svn/trunk/FusionTablesLayerWizard/src/index.html for embed options of the data generated