Overview

  • Introduction (me, you, Maps APIs)
  • Do I really need to code? - No! (or: Image APIs)
  • But I love coding! (or: JavaScript API)
  • More: Web services, libraries, Google Places API

Introduction

Me, you, Maps APIs.

+Anna Chernova

You

  • Who uses Google Maps?
  • Who have heard about Google Maps APIs?
  • Who has a Maps API key?

Examples

Meet the family of Google Maps APIs

Do I really need to code? - No!

Image APIs: Static Maps, Street View

I want to put a map into my website!

Think simplicity

The Static Maps API may be all you need.

http://maps.googleapis.com/maps/api/staticmap
           ?center=14.553844,121.017877&zoom=17
           &markers=14.553844,121.017877
           &size=1200x300&sensor=false

But I'm going on a beer crawl!

But I'm going on a beer crawl!

Static Maps support many visual elements

http://maps.googleapis.com/maps/api/staticmap?
      center=-37.818429,145.008931&zoom=15&size=600x300
      &markers=color:yellow|label:S|-37.819495,145.007077
      &markers=color:red|label:G|-37.816582,145.012043
      &markers=color:blue|label:R|-37.816531,145.013309
      &path=color:0x00800080|weight:8
          |-37.81943,145.00708|-37.82003,145.01274|-37.81655,145.01337|-37.81645,145.01209
      &sensor=false

My smartphone has too many pixels!

My smartphone has too many pixels!

Add the scale parameter.

http://maps.googleapis.com/maps/api/staticmap?
      center=-37.818429,145.008931&zoom=15&size=600x300
      &markers=color:yellow|label:S|-37.819495,145.007077
      &markers=color:red|label:G|-37.816582,145.012043
      &markers=color:blue|label:R|-37.816531,145.013309
      &path=color:0x00800080|weight:8
          |-37.81943,145.00708|-37.82003,145.01274|-37.81655,145.01337|-37.81645,145.01209
      &scale=2
      &sensor=false

But I really want Street View

But I really want Street View

The Street View Image API allows static views of SV Imagery.

http://maps.googleapis.com/maps/api/streetview
           ?size=600x500&location=-37.816537,145.012565
           &heading=-174.47667368404316
           &pitch=-3.7044103524331756
           &fov=180
           &sensor=false
      

Meet the family of Google Maps APIs

But I love coding!

JavaScript API v3, Places API, web services.

What you need to know (a bit, to start)

  • HTML + CSS
  • JavaScript
  • HTTP Services
  • JSON

How do I start?

Aside: usage limit and licensing

Testing

  • This is important!
  • Unit testing
    • Tests a single component in isolation.
  • Automated integration testing
    • Tests the application as a whole.

Testing

Examples of what you can do with JavaScript API

Styling the map

Styling the map

More...

Web services, libraries

Web services

Geocoding

When geocoding a fixed set of addresses, you should use the Geocoding web service and cache these results instead of geocoding dynamically in the client.

http://maps.googleapis.com/maps/api/geocode/json?address=Bondi+Beach+Australia&sensor=false
http://maps.googleapis.com/maps/api/geocode/json?address=Byron+Bay+Australia&sensor=false
http://maps.googleapis.com/maps/api/geocode/json?address=Bells+Beach+Australia&sensor=false
      

Libraries

Google Places API

Google Places API

Google Places API

Summary

  • Try it out!
  • Follow good programming practices. (Yes, even in JS!)
  • developers.google.com/maps
  • Participate in Google Places API Developer Challenge.

Google Places API Developer challenge

How would you make your community or local government run better?


In our first Google Places API Developer Challenge, we’re inviting developers around the world to make something that improves their communities or governments by using the Google Places API and its database of places and tools.


The developers of the winning applications will receive a VIP experience at Google I/O 2013.

Questions?

Thank You!