• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Google Maps API
 

Google Maps API

on

  • 4,793 views

http://tinyurl.com/2flvsk

http://tinyurl.com/2flvsk

Statistics

Views

Total Views
4,793
Views on SlideShare
4,782
Embed Views
11

Actions

Likes
2
Downloads
104
Comments
0

1 Embed 11

http://www.slideshare.net 11

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

CC Attribution-NonCommercial LicenseCC Attribution-NonCommercial License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Google Maps API Google Maps API Presentation Transcript

    • Google Maps API Dr. Harry Chen CMSC 491S/691S March 26, 2008
    • Agenda
      • “ Fire hose” course on Google Maps API
        • HelloWorld example
        • Basic UI components
        • Loading data
      • Assignment #3
    • HelloWorld What happened here?
    • “View  Page Source” Google Maps API Key (required)
    • What’s involved
      • Define a <div/> tag where the map is to be created (“map_canvas”)
      • Load GMaps API in <head/>
      • Register the “initialize()” function to be called when the event “onload” is fired
    • The initialize() function
      • Checks if your browser is supported by the GMaps API
      • Creates a GMap2 object and initializes the map UI inside the DOM element ID “map_canvas”
      • Centers the map to a given lat/lng value
    • Key Map Controls Control: Zoom Control: Map Type Control: Overview http://code.google.com/apis/maps/documentation/controls.html#Controls_overview Control: Pan
    • Control Code Example
    • GMarker Markers : Use GMarker to create markers
    • Customize GMarker Use your own marker icon Use a smaller marker icon http://code.google.com/apis/maps/documentation/overlays.html#Markers
    • OpenInfoWindowHtml This func creates GMarker
    • On Creating GMarker
      • We have seen how to create GMarkers on a map, and our data is hardwired
      • Unless your map data is static, you will need to load location data dynamically
      • How to load data?
    • On loading data
      • Option 1: Define data in the <head/> of your map page
      • Option 2: Read from a GeoRSS file
      • Option 3: Read from a KML file
      • Option 4: Read from a custom XML file
    • Read from a GeoRSS/KML file
      • What’s GeoRSS? What’s KML?
      So easy!
    • Read from a custom XML file
      • Some app only produce proprietary data in XML
      • In order to render this data on a map, you must read and parse XML
      • Sounds complicated?
    • Read from a custom XML GDownloadUrl: Built-in for downloading any data from a remote URL GXml: XML parser!
    • Resources
      • Google Maps’ Developer Guide
        • http://code.google.com/apis/maps/documentation/index.html
      • Mike Williams’s Google Maps API Tutorial
        • http://econym.googlepages.com/index.htm
    • Assignment #3