Google Maps Training Course

This course teaches students how to build applications using the Google Maps API. The course utilizes Ruby on Rails for the server-side technology, but the majority of the code is in JavaScript, so it is transferable to other server platforms.

Students will learn how to make a simple map with clickable markers, and apply good CSS and JavaScript coding practices to enhance their mapping pages. They will learn to use multiple geocoding web services to translate physical addresses into latitudes and longitudes, and utilize location data in their applicaiton.

The couse will cover topics related to scalability, including marker clustering and on-the-fly image rendering techniques to display thousands of points on the map.

Advanced topics include: building your own info windows and tooltips, creating your own map tiles, and utilizing publicly available census data to populate your own geocoding database.

Prerequisites:

Students should be familiar with basic HTML and CSS, and have some programming experience.

About the instructor:

Google Maps Applications Training Outline

Google Maps and Rails

• KML: Your First Map
• Google My Maps: Your Second Map
  • Adding Points
  • Adding Polygons and ploylines
  • Exporting via KML
• Got Rails?

Getting Started

• On JavaScript, Helpers, and Plug-ins
• Creating Your Rails Application
• The First Map
  • Keying Up
  • Examining the Sample Map
  • Specifying a New Location
  • Separating Code from Content
  • Cleaning Up
• Basic User Interaction
  • Using Map Control Widgets
  • Creating Markers
  • Detecting Marker Clicks
  • Opening the Info Window
• A List of Points
  • Using Arrays and Objects
  • Iterating

Interacting with the User and the Server

• Adding Interactivity
• Going on a Treasure Hunt
• Reviewing Application Structure
• Building on Your Application
  • Creating a New Controller
  • Creating a Marker Model and Migration
  • Creating the Database, Connecting via Rails, and Running the Migration
  • Creating the Map View
• Creating the Map and Marking Points
• Listening to User Events
• Asking for More Information with an Info Window
  • Creating an Info Window on the Map
  • Embedding a Form into the Info Window
  • Avoiding an Ambiguous State
  • Controlling the Info Window Size
• Implementing Ajax
  • Google's GXmlHttp vs. Prototype's Ajax.Request
  • Using Google's Ajax Object
  • Saving Data with GXmlHttp
  • Parsing the JSON Structure
• Retrieving Markers from the Server
• Adding Some Flair
• Ajax with Prototype

Geocoding Addresses

• Introducing GeoKit
  • functionality provided by GeoKit
  • Installing the GeoKit plugin
  • Configuring GeoKit
  • Creating a model with geocoding functionality
• Using Geocoding Web Services
  • Server-side vs client-side geocoding
  • The Google JavaScript Geocoder
  • The Google Maps API Geocoder
  • The Yahoo Geocoding API
  • Geocoder.us
  • Geocoder.ca
  • Services for Geocoding Addresses Outside Google's Coverage
• Building a Store Location Map

Manipulating Third-Party Data

• Using Downloadable Text Files
  • Downloading the Database
  • Working with Files
  • Correlating and Importing the Data
  • Using Your New Database Schema
• Screen Scraping
  • Our Scraping Tool: scrAPI
  • Screen Scraping Considerations

Improving the User Interface

• CSS: A Touch of Style
  • Maximizing Your Map
  • Adding Hovering Toolbars
  • Creating Collapsible Side Panels
• Scripted Style
  • Switching Up the Body Classes
  • Resizing with the Power of JavaScript
  • Populating the Side Panel
  • Getting Side Panel Feedback
• Data Point Filtering
• RJS and Draggable Toolbars
  • RJS Templates and Partials
  • Draggable Toolbars

Optimizing and Scaling for Large Data Sets

• Understanding the Limitations
• Streamlining Server-Client Communications
• Optimizing Server-Side Processing
  • Server-Side Boundary Method
  • Server-Side Common-Point Method
  • Server-Side Clustering
  • Custom Detail Overlay Method
  • Custom Tile Method
• Optimizing the Client-Side User Experience
  • Client-Side Clustering
  • Further Client-Side Optimizations

Advanced Tips and Tricks

• Debugging Maps
• Interacting with the Map from the API
  • Helping You Find Your Place
  • Force Triggering Events with GEvent
  • Creating Your Own Events
• Creating Map Objects with GOverlay
  • Choosing the Pane for the Overlay
  • Creating a Quick Tool Tip Overlay
• Creating Custom Controls
  • Creating the Control Object
  • Creating the Container
  • Positioning the Container
  • Using the Control
• Adding Tabs to Info Windows
  • Creating a Tabbed Info Window
  • Gathering Info Window Information and Changing Tabs
• Creating a Custom Info Window
  • Creating the Overlay Object and Containers
  • Drawing a LittleInfoWindow
• Implementing Your Own Map Type, Tiles, and Projection
  • GMapType: Gluing It Together
  • GProjection: Locating Where Things Are
  • GTileLayer: Viewing Images
  • The Blue Marble Map: Putting It All Together
• Driving Directions
  • Simple Driving Directions
  • Multiple waypoints

YM4R

• Introduction to YM4R
• Using YM4R/GM to generate maps in Rails
• Mapstraction (YM4R/Mapstraction)
• Yahoo! Maps Building Block APIs
• YM4R vs. the Google Maps API
  

Advanced Geocoding Topics

• Where Does the Data Come From?
  • Sample Data from Government Sources
  • Sources of Raw GIS Data
• Geocoding Based on Postal Codes
• Using the TIGER/Line Data
  • Understanding the data sources
  • Parsing and Importing the Data
  • Building a Geocoding Service