StartPad Countdown 5 - Google Geo: Mobile Mapping
21
Mobile Mapping Mano Marks Geo Developer Advocate Startpad September 1 st , 2009
description
Mapping technologies and mobile technologies have often been at odds with each other. Mobile technologies require compact, high performance applications, and maps require massive amounts of data and special interfaces. Recently, mapping technologies have been optimized for the increased power of modern mobile devices. This talk will give an overview of what Google offers to mobile developers, including Android MapView and iPhone MapKit, and will demonstrate how to get started with the new Google Maps API version 3, which has been optimized for mobile devices.
Transcript of StartPad Countdown 5 - Google Geo: Mobile Mapping
Mobile Mapping
Mano Marks
Geo Developer Advocate
Startpad
September 1st, 2009
What are (were) the API options?
Lowest common denominator:Static Maps
Android, iPhone:Native APIs
iPhone, Android, Nokia, Palm, etc:JavaScript API
Browser Win:• Many different platforms• Let us solve the cross-device issues• Mashups available on desktop as well as mobile• No download• We can release features (and bug fixes) faster• AppStore approvale
Native API win:• Native UI• One language to learn• Easier integration with your app
• No loading browser into app
Browser vs Native APIs
• Returns a static image
• Just upgraded to v2 with lots of new features
• Doesn’t use JS
• No slippy-ness
• Wide compatibility
Static Maps API
• iPhone 3.0 SDK• Apple API (not Google, exactly)• Objective C• Less Powerful than JS API
iPhone Development with MapKit
• OK, MapView is just one class in com.google.android.maps
• Java Development• More powerful than iPhone• Iteration still requires new Android release
Android Development with MapView
What makes mobile browsers tricky?
• Screen size• User interface and interaction• Speed• Use cases
Causes of Latency
• Serving data• Download time
o Bandwidth vs latency 3G networks have reasonably high bandwidth but low
latency Loading small and big files take a surprisingly similar
amount of time• JavaScript parsing time (iPhone Safari)
What is latency?
• Page load: the time until all components of the page are loaded, visible, and usable
• User perceived: the time until the page appears to have loaded
Attempts to reduce JS page load latency
• Reduce size of JavaScripto Compile/obfuscate codeo Delay load code until required
• Combine image fetches using sprites
Attempts to reduce JS perceived latency
• Load Static map first, and then JS
JS -> Static
So, how well does Google Maps API v2 work on mobile browsers?
• Not very• Initial download: 60kB in
2006; 190kB now• Time to load tiles• Synchronous access to
state limits ability to delay-load code
• Code base not designed with mobile in mind
Maps API Version 3
Speed Comparison
v3v2
35KB190KB
How does v3 accomplish this improvement?
• Start with static map
• MVC Architecture
• Remove unneeded code, Untangle code
What does v3 look like?
var map = new google.maps.Map( document.getElementById("map_canvas"), { center: new google.maps.LatLng(37.442, -122.142), zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP });var marker = new google.maps.Marker( { position: map.get_center(), map: map });
Simple Map
What can you do with v3?
Markers, Controls, InfoWindows
Geocoding (Forward/Reverse)
Custom Overlays
Screen-Size Dependent Default UI
No Keys Required!
http://maps.google.com/maps/api/js?sensor=false
Learn more at http://code.google.com/apis/maps/
