Tweet
Tweet

Slide 1

Slide 1 text

Web Map APIs Yos Riady | yosriady.com

Slide 2

Slide 2 text

http://goo.gl/s6Y1w4

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

Can you name sites with interactive maps? Maps on the Web

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

Agenda for today Interactive maps ● Brief intro on Web Map APIs ● Hands-on tutorial ● Project time ● Q&A

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

What is an API? API stands for: a. Agricultural Price Index b. Application Programmers Initiative c. Asia Pacific Institution d. Apple Products, Inc. e. Application Programming Interface

Slide 11

Slide 11 text

What is an API? API stands for: a. Agricultural Price Index b. Application Programmers Initiative c. Asia Pacific Institution d. Apple Products, Inc. e. Application Programming Interface

Slide 12

Slide 12 text

Application Programming Interface class MyWatch: def turn(self, degrees): complex_operationA() complex_operationB() complex_operationC() def display(self): complex_operationD() complex_operationE();

Slide 13

Slide 13 text

What are Web APIs? ● APIs connected through HTTP http://maps.googleapis.com/maps/api/staticmap?center=-15.800513,-47.91 378&zoom=11&size=200x200

Slide 14

Slide 14 text

What are Web APIs? ● APIs connected through HTTP (see geocoder.py) http://maps.googleapis.com/maps/api/staticmap?center=-15.800513,-47.91 378&zoom=11&size=200x200 ● API libraries/wrappers

Slide 15

Slide 15 text

What are Web APIs? ● APIs connected through HTTP http://maps.googleapis.com/maps/api/staticmap?center=-15.800513,-47.91 378&zoom=11&size=200x200 ● API libraries/wrappers ● Sometimes free, often commercial ● Commercial APIs charge based on usage

Slide 16

Slide 16 text

Web Map API Services and many others!

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

Working with Web Map APIs ● Register for an API Key (where applicable) ● Include the Map API library’s CSS and Javascript files ● Read the API documentation ● Write map features using the API/library’s methods ● PROFIT!!!

Slide 21

Slide 21 text

Today Used by Flickr, Foursquare, Pinterest, Wikipedia!

Slide 22

Slide 22 text

Introducing Leaflet

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

Hands On Time

Slide 25

Slide 25 text

What we will be covering ● Basic Maps ● Tile Providers ● Markers, Popups, and more ● Events ● Geolocation ● Geocoding ● Routing

Slide 26

Slide 26 text

github.com/Leventhan/orbital-leaflet/

Slide 27

Slide 27 text

Project Super Fun Time http://leventhan.github.io/orbital-leaflet/

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

Where do I go from here?

Slide 30

Slide 30 text

No content

Slide 31

Slide 31 text

No content

Slide 32

Slide 32 text

No content

Slide 33

Slide 33 text

Questions? Yos Riady | [email protected]