Create: a map

Use Fusion Tables' new look with this tutorial

This 2-3 minute tutorial steps you through uploading data to generate a map with placemarks in the new version of Fusion Tables.

Tutorial Contents:

 

For this tutorial, a sample dataset is provided containing records of insects collected in Costa Rica by ecologists. Each location is recorded with a latitude and longitude point.

Import the sample dataset

  1. Download this sample insect dataset.
  2. Go to Google Drive. Sign in to your Google Account or create a Google Account if you don't already have one.
  3. Click the "Create" button.
  4. Click the "Connect more apps" bar at the bottom of the resulting list.
  5. Type "fusion tables" in the "Search Apps" box and hit the "Enter" key.
  6. Click the blue "+ CONNECT" button, then click the "OK" button in the confirmation dialog box.
  7. Click "Create > Fusion Table (experimental)".
  8. In the Import new table dialog box, click "Choose File".
  9. Select the "Astraptes fulgerator complex sample data.csv" file you downloaded, and click "Next".
  10. Check that the data is formatted correctly and click "Next".
  11. Give your table a name and click "Finish".

    Your uploaded data now appears in a new Fusion Table with thumbnail images in the two columns of URL links:

 

Map the data

Fusion Tables auto-detects location data in a table and displays a tab called "Map of <location column name>." In this case, the Map tab is titled "Map of latitude."

  1. Click "Map of latitude."


  2. The map appears, with several small red placemarks scattered across the countryside.
  3. Click a placemark to view the default info window for that row.

That's it!   You've mapped a spreadsheet of data.

Customize the info window template [Optional]

The default info window template automatically uses the first ten columns for this table, but you can customize which data appears and how it is displayed:

  1. Click on the Map tab and choose "Tools > Change map", then click the "Change info window" button.
  2. You can experiment by checking column checkboxes to add or remove information from the Automatic info window template.
  3. To customize the overall style and content of the info window template, click the "Custom" tab. The HTML for the default (automatic) columns is displayed to get you started.

  4. To see how you can change the info window display, copy and paste the code below.
    Tip: To display the same text in every info window, just add the text to the template here.
    Tip: To insert the value contained in a column, indicate the column by using its name inside curly brackets. For example, to display the species name in the info window, put {herbivore species} into the template. 
    <div class="googft-info-window"
    style="font-family: sans-serif; width: 330px; height: 20em; overflow-y: auto;">
  <img src="{URL cp lateral}" 
       style="width: 150px; vertical-align: top; margin-right: .5em" />
  <img src="{URL adult}" 
       style="width: 150px; vertical-align: top" />
  <h2 style="color: brown">{herbivore species}</h2> 
  <p>Caterpillar found feeding on host plant
     <em>{host plant species}</em>,
      {host plant family} in the {primary eco},{year}.</p>
  <p>See specimen record {voucher} at 
      <a href="http://janzen.sas.upenn.edu/">
      Caterpillars, pupae, butterflies and moths of the A.C.G.
      </a>
  </p>
</div>
  5. Click "Save".

    Now click a placemark on the map to see your styled info window. This template is much easier to read.

You've uploaded a data file, mapped it, and customized the way each placemark's information is displayed. Good job!