1.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Google Maps Dave Ross

2.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Dave Ross “ I grew up around computers, fell in love with the Internet way back in 1994, and built a successful career around my interests in computers and business. My career focus has been on e-commerce, and in my personal time I study issues related to digital identity, trust, and reputation tracking. I’m also a cat shelter volunteer, a small business owner, an avid Scrabble player, and a b-movie junkie.” 10 years professional development experience PHP developer, certified Java developer LinkedIn Profile: http://www.linkedin.com/in/daverossfromchicago

3.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Most people know Google Maps from the website maps.google.com

4.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 It's how those of us without GPS in our cars get directions

5.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009

6.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Google Maps is also an API that you can use on your own sites

7.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Actually, it's a family of APIs that work together GMap2 GClientGeocoder GDirections GMarker GPolygon Glog

8.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Implemented in Javascript and Flash (Actionscript 3.x) Actionscript 2.x is deprecated.

9.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 <ul><li>Plusses </li></ul><ul><li>You can't beat the price </li></ul><ul><li>Most users are familiar with it </li></ul><ul><li>It's powerful </li></ul><ul><li>Google's products are generally reliable </li></ul>

10.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 <ul><li>Some Restrictions Apply! </li></ul><ul><li>Can only use it on free, public pages unless you pay </li></ul><ul><li>Geolocation API for use drawing on maps </li></ul><ul><li>You need a free API key registered to your URL </li></ul><ul><li>It's a beta, and probably will be forever </li></ul>

11.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 That's very nice. But how about some code?

12.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 <script src=&quot; http://maps.google.com/maps?file=api&amp;v=2&amp;key ={API key}&quot; type=&quot;text/javascript&quot;></script> <!-- Google Map goes here --> <div class=&quot;map&quot; id=&quot;my_map&quot; style=&quot;position: static;width: 400px;height: 400px;&quot;></div> <script type=&quot;text/javascript&quot;> // Display the Google Map in the empty div with id my_map $(document).ready(function() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById(&quot;my_map&quot;)); var geocoder = new GClientGeocoder(); geocoder.getLatLng(&quot;1600 Pennsylvania Avenue NW, Washington, DC 20500&quot;, function(point) { map.setCenter(point, 14); // “14” is the zoom level map.addOverlay(new GMarker(point, {clickable: false, draggable: false})); map.disableDragging(); }); } }); </script>

13.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Break it down!

14.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Pull in the Google Maps Javascript code <script src=&quot; http://maps.google.com/maps?file=api&amp;v=2&amp;key ={API key}&quot; type=&quot;text/javascript&quot;></script>

15.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Make a placeholder <div> (The map goes inside it) <!-- Google Map goes here --> <div class=&quot;map&quot; id=&quot;my_map&quot; style=&quot;position: static;width: 400px;height: 400px;&quot;></div>

16.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 I'm using jQuery. This just how you tell jQuery to run this when the page loads // Display the Google Map in the empty div with id my_map $(document).ready(function() {

17.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Google Maps API can check If the browser supports it if (GBrowserIsCompatible()) {

18.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 “ Hey, Google, gimme a map and put it in that <div>” var map = new GMap2(document.getElementById(&quot;my_map&quot;));

19.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 GclientGeocoder takes an address and converts to lat/long (a GPoint object) var geocoder = new GclientGeocoder(); geocoder.getLatLng(&quot;1600 Pennsylvania Avenue NW, Washington, DC 20500&quot;, function(point) { map.setCenter(point, 14); // “14” is the zoom level map.addOverlay(new GMarker(point, {clickable: false, draggable: false})); map.disableDragging(); } );

20.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 GclientGeocoder's second parameter is a function to run after geocoding the address. var geocoder = new GclientGeocoder(); geocoder.getLatLng(&quot;1600 Pennsylvania Avenue NW, Washington, DC 20500&quot;, function(point) { map.setCenter(point, 14); // “14” is the zoom level map.addOverlay(new GMarker(point, {clickable: false, draggable: false})); map.disableDragging(); } );

21.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 Displaying a non-draggable map of that location function(point) { map.setCenter(point, 14); // “14” is the zoom level map.addOverlay(new GMarker(point, {clickable: false, draggable: false})); map.disableDragging(); }

22.
Google Maps :: Dave Ross :: The West Suburban Chicago PHP Meetup :: suburbanchicagophp.org :: January 8, 2009 More information http://code.google.com/apis/maps/ http://googlegeodevelopers.blogspot.com/ http://googlemapsapi.blogspot.com/ (retired)