1. Hands on with the Google Maps Data API
and the Google Maps API v3
Shawn Shen
May 18, 2010
2. Maps Data API - Agenda
Introduction (10 min)
Maps Javascript API V3
Maps Data API
Lab and Demo (40 min)
Ossama, Mano, Luke, Josh, Daniel
3. What is Google Maps API V3?
The Google Maps V3
API lets you create
interactive maps using
just JavaScript, HTML
and CSS.
4. What is Maps Data API
Google data infrastructure to store and retrieve
geospatial data for your applications
Geospatial data:
Latitude/Longitude
Custom data
5. Maps Data API = Google Data + Geo Signature
Use Google Data Protocol
REST-like technology
GET/POST
Feeds
http://maps.google.com/maps/feeds/maps/default/full
Create/Read/Update/Delete
Geospatial and attribute queries
Radius search
Bounding box search
6. Maps Data API: Geospatial Data Structure
Map: a layer or container of features
Features: data with location signature
Point: Lat/Long
Polyline
Polygon
10. Maps Data API Javascript Client Library
Google Account:
https://www.google.com/accounts
Javascript client using common loader
// Load the latest version of the Google Data JavaScript Client
google.load('gdata', '2.x', {packages: ['maps']});
11. Map Data API: Authentication in Javascript
Authentication of Web Client using AuthSub
var scope = 'http://maps.google.com/maps/feeds';
Login:
var token = google.accounts.user.login(scope);
Check login:
google.accounts.user.checkLogin(scope);
Logout:
google.accounts.user.logout();
12. Map Data API: Add Map Layer
var service = new google.gdata.maps.MapsService('app');
var mapFeed = 'http://maps.google.com/maps/feeds/maps/default/owned';
service.getMapFeed(mapFeed, function(feedRoot){
var newMap = new google.gdata.maps.MapEntry();
newMap.setTitle(new google.gdata.atom.Text.create(...));
newMap.setSummary(...);
feedRoot.feed.insertEntry(newMap, success, error);
}, callback);
13. Map Data API: Add Feature to Map Layer
var service = new google.gdata.maps.MapsService('app');
service.getFeatureFeed(featureFeed, function(feedRoot) {
var feature = new google.gdata.maps.FeatureEntry();
......
kmlContent.setText(kmlString);
kmlContent.setType(...);
newFeature.setContent(kmlContent);
feedRoot.feed.insertEntry(newFeature, success, error);
}, callback);
15. Maps Data API Lab - Agenda
1. Javascript V3 map
2. Authentication using AuthSub
3. Add a map layer
4. Add features to map layer and retrieve maps
5. Geospatial and attribute query
Codelab: http://bit.ly/d9Vr50
16. Maps Data API Lab - Hosting on App Engine
If you don't have your own server...
App Engine Hosting Demo
http://onebox.appspot.com
17. Resources and Links
Maps Data API:
http://code.google.com/apis/maps/documentation/mapsdata/
Maps Data API: Javascript
http://bit.ly/fTV1K
Google Data API Home:
http://code.google.com/apis/gdata/docs/developers-guide.html
Maps Javascript API V3
http://code.google.com/apis/maps/documentation/v3/
#mapsdata @sshen @googlemapsapi
18. Wrap-up
Maps Data API
My Locator: Your Favorite Location App
Earth/KML 101 coming up
#mapsdata @sshen @googlemapsapi
Thank You!
