Skip to main content
MapTogether.org logo
  • about
  • blog
  • resources
  • services
  • sandboxes
  • contact
Home » Blogs » lily's blog

HOWTO: Quick and Dirty Google Maps

Submitted by lily on Mon, 2009-07-20 17:57

The Little Village Environmental Justice Organization (LVEJO) has long since been a hero to me: the dedication, the participatory politics and the clear and open campaigns that are respectfully fought. It seems only fitting to use their fabulous community resource map - created in conjunction with the Open Youth Network - as an example for this article. First, take a look at what it has going for itself:

community-generated map of Little Village neighborhood

There are colorful areas and graphics representing different types of places. For example, you can click on a "movie projector" icon and be taken to a video clip and info box describing what that location represents.

video embedded in google map

image embedded in google map

Videos, pictures, links are all spatially linked to icons for users to click and explore. Want to know how they did it and how you can use maps to represent your cause and information?

  • First log in to your Google account. You must be logged in to save and create a map of your own using Google's My Maps feature. If you don't have a Google account, the link above will also give you an option to create one.
  • Once logged in, visit http://maps.google.com and click the "My Maps" link. (Hint: it's in the upper left corner of the screen, to the left of the map itself.)
  • Select "create a new map" and enter a title and a brief description of your new map. The "privacy and sharing settings" allow you to control whether your map is visible to the public. Remember: unless the map is unlisted, your map is visible to the public and you should keep privacy concerns in mind at all times, especially if any of your data identifies individuals or households!

    entering a title and description of a new google map
  • Collaboration between your co-workers, community members, partners, and stakeholders is important for most organizations and projects. Click the "Collaborate" button in the side bar of the screen and add the email addresses as shown in the image below.

    collaboration features in google maps
  • OK, so location - let's define the area our map will cover. Use the drag-and-zoom controls or the search bar to find the location your map will cover. Zoom in close enough so that you will be able to see the area you're working on: if you need to map at the neighborhood level, make sure you can see the streets and building clearly.
  • Here are your tools, found in the upper-left hand part of the map.
    highlighting google maps toolbars
  • Start the clicking! We're going to start by using the pushpin tool, which is used to mark a single point on the map. Select this tool from your toolbar.
  • Putting down a pushpin is easy, just point at the map and click. An info-box will pop up allowing you to describe the location: what it is, who is, and any other information you want to share. In this example, I chose the University of Illinois Geography Department in Urbana, IL. describing a point in google maps
  • Now we'll select the icon used to represent this point on the map. As a cyclist, this is one of my favorite icons - it's a default Google-supplied icon. If you have your own icons hosted somewhere else on the Internet, you can link to them with an external URL. You should not just type in links to random images on websites - if those images are moved or deleted, your map will break.
    selecting an icon for a point in google maps

Adding pictures and video

  • Adding pictures to the point's info-box is easy. Select the Rich Text option and then the picture frame icon. Enter the URL of the image you want to include.
    adding an image to google maps
  • Adding a link to the push pin is just as easy. Enter the text you want to represent the link - this could be the URL itself (e.g., "http://example.com") or underlined text the user will click on to go to the URL (e.g., "click here to visit our website!"). Highlight the text with your mouse, then select the chain-link icon from the toolbar. Enter the URL of the link and select "OK" to complete your link!
  • Adding a video is the last attachment we'll examine in this article, and we'll use YouTube as an example. First, find a YouTube video that you want to embed into your pushpin's info-box. Off to the side of the screen is a text box labeled "Embed." Copy the embed text:
    youtube embed code example
      and paste it into your pushpin's info-box. Make sure the box is in HTML editing mode.
    pasting youtube embed code into google maps
  • Select the "OK" button to save your progress and the video will appear inside the info-box.resulting embedded video in google maps

Adding a shape or region
Sometimes we want to map areas that aren't just individual points, such as a neighborhood or voting district. Google Maps allows us to create shapes, such as squares and rectangles, which we can "overlay" on top of the map.

  • To create a shape, find the "line" tool button on the toolbar in the corner of the map window - it looks like a little chart. On the button for the line tool is a tiny arrow - click the arrow itself and a small drop-down menu will appear. You can choose to draw a "line" on top of the map, a "line along a road" for tracing routes, or "draw a shape."
    google maps line and shape drawing tools
  • Select "draw a shape" and notice that your mouse cursor changes from an arrow to an "X" indicator. Click the "X" on the map where you want to draw the first corner of your shape - then click the other corners of your shape, noting that little points and lines are being drawn on the map. You can click as many corners as you'd like, so you can have a simple square or a complicated voting district map. To complete your shape, click the "X" on the first corner you drew, and the shape will be completed.
    triangle region drawn in google maps
  • Once you've created a shape, you can use the same techniques we learned above to add rich text, images, videos, links, and more to your shape's info-box.
    video embedded in google map, attached to shape

Conclusion
Hopefully this has been helpful - check our resources page for more articles. You may also want to visit Google Maps for Nonprofits, a tutorial site created by the Google team.

 

  • Article
  • best
  • google maps
  • howto
  • mapmaking
  • mashup
  • npo
  • participatory gis
  • Software
  • lily's blog

* YOU ARE HERE!

Feeling ironically lost in a world of maps?  These critical resources will help you get your bearings!

  • The Illustrated Guide to Nonprofit GIS and Online Mapping
  • Examples of Nonprofit Maps
  • Geo-Glossary
  • MapTogether.org Website Map

Recent blog posts

  • Gerrymandering - creating the maps of politics
  • Mapnificent - How Far Can You Get In An Hour?
  • NPO Mapping Case Study: Illinois Network of Centers for Independent Living
  • NPO Mapping Case Study: Arthritis Foundation
  • Accessibility Map Project - Geneva
  • @DigiDem helps NYC students map their community and future!
  • Mapping the US Community Health Data Initiative
  • National Shelter System Maps For Tennessee Flood Victims From Red Cross and FEMA
  • News Maps: Unauthorized Immigrants and Gulf Oil Spill
  • NatGeo's Global Action Atlas Connects People and Projects Around The World
more

MapTogether RSS

Syndicate content

MapTogether.org is a CCP project. All content © 2008-2011, Community Cartography Project, all rights reserved. || this site is drupal-powered.