Maps for web developers and enthusiasts 1. Projections 2. Providers 3. Own map server

1. Maps
For web developers and enthusiasts

2. Who?
Konstantin Delchev
http://gis.stackexchange.com/users/8174/kode
https://twitter.com/kdelchev

3. Contents
1. Map projections
2. Map providers
3. How to create your own map

4. Earth…

5. …is flat…

6. …when using projections.
• Projections
• Datums
• Geocentric datums
• WSG84
• Local datums
• NAD83
• NAD27
• ED1950

7. Degrees Minutes Seconds

8. Latitude and Longitude
• Latitude, Longitude = 42° 41' 53.0916" , 23° 19' 18.894“ (geographic
coordinates)
• Latitude = 42 + 41/60 + 53.0916/3600 = 42.698081 (decimal)
• Longitude = 23 + 19/60 + 18.894/3600 = 23.317191 (decimal)
• Latitude, Longitude = 42.698081, 23.317191 (in decimal)
• 1 min ≈ 1.85km
• 1 sec ≈ 31m
• Latitude distance ≈ 42.67 * 60 * 1.85 ≈ 4 736km
• Longitude distance ≈ 23.32 * 60 * 1.85 ≈ 2 588km

9. • Use at least 6
symbols after
the dot for keeping
max precision
• Degrees vary in
different places
in the world
by 21.5km

10. Universal Traverse Mercator
UTM – 328204 E (easting), 4746040 N (northing)

11. Aspects of projections
•
•
•
•
•
•
•
Distance
Scale
Direction
Bearing
Shape
Area
Distance

13. Equidistant cylindrical map
• Showing distances (km) between lines connected by identical lines. Each graphic scale
is only valid along its own parallel, or the one symmetrically opposite the Equator.
Only the vertical scale is valid anywhere, and none of the four is valid if rotated.

14. Equatorial van der Grinten III map
• Parallels are straight but not standard lines.

15. Equatorial cylindrical equidistant map
• Equatorial cylindrical equidistant map showing standard lines.
Markers divide segments proportionally.

16. Transverse cylindrical equidistant map
• Transverse cylindrical equidistant map showing standard
lines, which no more coincide with meridians and the Equator
except accidentally. Markers divide segments proportionally.

17. Equatorial sinusoidal map
• Equatorial sinusoidal (Sanson-Flamsteed) map showing
standard lines. Markers divide segments proportionally.

18. Normal Werner map
• Normal Werner map showing standard lines. Markers divide
segments proportionally.

19. Polar azimuthal equidistant map
• Polar azimuthal equidistant map showing standard lines.
Markers divide segments proportionally.

20. Which projection is best
•
•
•
•
•
Depends on the purpose
What we want to show on the map
Know target audience
Put important information on map
More in “How to lie with maps”
http://imgs.xkcd.com/comics/map_projections.png

21. Tools
• Proj4 – conversions between cartographic projections
• http://trac.osgeo.org/proj/
• GEOS – geometry processing and analysis
• http://trac.osgeo.org/geos/
• GDAL – geometry data abstraction, translation and processing
• http://www.gdal.org/

22. More information

23. Map providers

24. Google Maps
• https://www.google.com/maps/preview
• Free for commercial use with public access with 25 000
requests per day
• Zoom level up to 18-23 depend on area
• Started 2004 as C++ application by Lars and Jens Rasmussen
from Sydney’s Where 2 Technologies
• 2005 first announced
• Satellite images updated regularly, not older than 3y
• 54% usage of mobile apps

25. Bing Maps
•
•
•
•
•
http://www.bing.com/maps/
API with 90 days trial
December 2005 first release
2009 rebranded from Live Search Maps to Bing Maps
Based on MS MapPoint (.NET application to view, edit and
integrate maps) and TerraServer (free repository of aerial
imagery and topographic maps provided by USGS, known as
MS Research Maps as of 2010)

26. MapQuest
• http://www.mapquest.com/
• API, free with app key
• Free map tiles
• Static map
•
•
•
•
Founded 1967 as Cartographic Services
1994 Renamed to GeoSystems Global Corporation
1996 launched as a web service
2000 Acquired by AOL

27. ArcGIS Online (ESRI)
• http://www.arcgis.com/home/webmap/viewer.html
• ESRI
• Founded 1969, California USA
• API, paid
• ArcGIS desktop application
•
•
•
•
Load data from database
Creating and using maps as shape file
Compiling geographic data
Analyzing mapped information
• ArcGIS reader
• 40% market share in GIS software
• Paid license
• Proprietary data formats

28. HERE maps
• http://here.com/
• API
• Map tiles
• Static maps
•
•
•
•
•
•
•
•
2001 as SmartGo
2006 acquired gate 5 – Berlin-based route planning software
2007 acquired NAVTEQ
2008 acquired Plazes, Plum, Dopplr - geo related web sites
2010 acquired Metacarta
2011 bought earthmine
2011 Former Ovi Maps (2007-2010) renamed to Nokia Maps (2011-2012)
2012 rebranded to HERE Maps

29. CloudMade
•
•
•
•
http://maps.cloudmade.com/
Co-founded by Steve Coast in 2007
Many OSM based GIS APIs and services
Map style editor

30. OpenStreetMap
•
•
•
•
•
•
http://www.openstreetmap.org/
Collaborative project starter by Steve Coast in UK in 2004
2006 OpenStreetMap Foundation created to support the project
2006 OSM reuses Yahoo aerial photography
AND donated road data
The State of the Map conference
• first held 2007
• 9 000 registered users
• Sponsored by Google, Yahoo and Multimap
• 1 million users (not all contributing)
• Open Database License
• Uses Ruby On Rails for back end
Registered users

31. Creating own map server

32. What we need
• Tiles - images of 256 x 256 pixels each
• Already pre-rendered or rendered on demand from map
database
• Use from 3rd party provider (at charge or free)
• JavaScript API library
• OpenLayers – powerful and long-established
• Leaflet – lightweight and easy-to-learn

35. Open layers

36. Leaflet

37. Mapstraction
•
•
•
•
•
•
•
•
•
•
http://mapstraction.com/
CloudMade
ESRI ArcGIS
Google
MapQuest and MapQuest Open
Microsoft Bing
Nokia HERE
OpenLayers
Ordnance Survey OpenSpace
Yandex

38. What is in the black box
•
•
•
•
•
Planet file (33Gb of data so far) or extract (Geofabrik, Metro Extracts, CloudMade)
PostgreSQL + PostGIS
Apache + mod_tile for serving tiles
Mapnik
slippy_map

39. Put data in database
•
•
•
•
•
Get planet file or extract
Use osm2pgsql to import the data into Postgres
Add world boundaries, coastlines etc.
Modify stylesheets (not required)
render_list to pre-render tiles

41. Example maps
• http://en.wikipedia.org/wiki/List_of_online_map_services
• http://alpha.map1.eu/
• http://bihor-county.map2web.eu/

42. Stamen watercolor

43. Stamen toner

44. Example of Mars