THE EXPERT’S VOICE ® IN WEB DEVELOPMENT Beginning Google Maps API 3 Gabriel Svennerberg Learn how to build lightning fast mapping applications with the latest, totally remade, version of the Google Maps API [...]... GLatLng (36 .1 131 , new GLatLng (34 .0485, ]; points -122.4206), -115.17 63) , -118.2568) // Create a new polygon var polygon = new GPolygon(points, '#ff0000', 5, 0.7, '#ff0000', 0 .3) ; // Add the polygon to the map using map.addOverlay() map.addOverlay(polygon); Version 3 // Create an array with points var points = [ new google. maps. LatLng (37 .7671, -122.4206), new google. maps. LatLng (36 .1 131 , -115.17 63) , new google. maps. LatLng (34 .0485,... Deepwater Horizon oil spill visualized in Google Maps This book is about the Google Maps JavaScript API Other APIs are available, such as the Maps API for Flash and the Static Maps API These are both great additions but are not covered in this book A Brief History Google Maps was introduced in a blog post on Google in February 2005 It revolutionized the way maps on web pages work by letting the user... including Yahoo! Maps and Bing Maps, but the most popular one is Google Maps In fact, according to Programmableweb.com, it’s the most popular API on the Internet According to the site’s May 2010 statistics, 43 percent of all mashups use the Google Maps API (www.programmableweb.com/apis) In comparison, the second most popular API was Flickr with 11 percent, and the second most popular mapping API was VirtualEarth... 22,29, 17 ,35 , 16 ,35 , 10,29, 4,29, 4,4] 13 CHAPTER 2 ■ TRANSFERRING FROM VERSION 2 TO 3 // Create a marker and add it to the map var marker = new GMarker(new GLatLng(54, 12), { icon: myIcon }); map.addOverlay(marker); Version 3 var marker = new google. maps. Marker({ position: new google. maps. LatLng(54, 12), map: map, icon: 'icon.png', shape: { type: 'poly', coord: [4,4, 29,4, 29,29, 22,29, 17 ,35 , 16 ,35 , 10,29,... google. maps. LatLng (37 .7671, -122.4206), new google. maps. LatLng (36 .1 131 , -115.17 63) , new google. maps. LatLng (34 .0485, -118.2568), ]; // Create a new polyline and instantly add it to the map var polyline = new google. maps. Polyline({ path: points, strokeColor: '#ff0000', strokeWeight: 5 strokeOpacity: 0.7, map: map }); Encoded Polylines Apart from the syntax changes, polylines work just about the same in v3 as in v2 with one... Chapter 7: InfoWindow Tips and Tricks 131 Setting a Starting Point 131 Style Sheet 132 JavaScript 133 Adding Rich Content to the InfoWindow 133 Providing the HTML As a String 134 The Complete Code 137 Inserting a Video Using HTML5 139 Browser Support . 139 Altering the HTML .140... incorporate maps on their own web sites This led Google to the conclusion that there was a need for a public API, and in June 2005 it was publically released The first mashup on the Internet is often considered to be 2 CHAPTER 1 ■ INTRODUCING THE GOOGLE MAPS API Housingmaps.com, a combination of Google Maps with realty listings from Craiglist.org plotted on it It was in fact created before the public API was... GLatLng (37 .7671, new GLatLng (36 .1 131 , new GLatLng (34 .0485, ]; points -122.4206), -115.17 63) , -118.2568) // Create a new polyline var polyline = new GPolyline(points, '#ff0000', 5, 0.7); // Add the polyline to the map using map.addOverlay() map.addOverlay(polyline); 16 CHAPTER 2 ■ TRANSFERRING FROM VERSION 2 TO 3 Version 3 // Create an array with points var points = [ new google. maps. LatLng (37 .7671,... Google Maps API so that you can create your own map solutions In fact, after reading this book, I hope that you’re not only able to create your own maps but that you’re also able to deal with many of the common pitfalls most developers encounter when building Google Maps solutions Who This Book Is For This book is primarily for web designers/developers who want to learn how to use the Google Maps API. .. interactivity Google Maps was originally developed by two Danish brothers, Lars and Jens Rasmussen They cofounded Where 2 Technologies, a company dedicated to creating mapping solutions The company was acquired by Google in October 2004, and the two brothers then created Google Maps (They are also the men behind Google Wave.) Before there was a public API, some developers figured out how to hack Google Maps . h11" alt="" Beginning Google Maps API 3 ■ ■ ■ Gabriel Svennerberg Beginning Google Maps API 3 Copyright © 2010 by Gabriel. 1: Introducing the Google Maps API 1 A Brief History 2 How It Works 3 A New API 3 Slimmed-Down Feature Set 3 Focus on Performance 3 Mapping Fundamentals