Staticmaps cloudmade-internal-april-2009
48
Introduction API overview Implementation Future development Summary CloudMade Staticmaps: Overview API, architecture and hard decisions Andrii V. Mishkovskyi April 28, 2010
-
Upload
andrii-mishkovskyi -
Category
Technology
-
view
679 -
download
0
description
Internal tech talk on CloudMade's Staticmaps service given on 28th of April. General overview of API, design decisions and idea dump.
Transcript of Staticmaps cloudmade-internal-april-2009
Introduction API overview Implementation Future development Summary
CloudMade Staticmaps:Overview
API, architecture and hard decisions
Andrii V. Mishkovskyi
April 28, 2010
Introduction API overview Implementation Future development Summary
Introduction
What is this?Map images of various sizes and scales
Use casesJavaScript-less environmentsPrintable mapsNot using slow CloudMade tiles ;)
Introduction API overview Implementation Future development Summary
Getting maps
Overview
URLhttp://staticmaps.cloudmade.com/<API key>/staticmaps?size=<widthxheight>&styleid=<styleid>
Introduction API overview Implementation Future development Summary
Getting maps
Overview
ParametersAPI key CloudMade user API key
size Sets the width and the height of theimage
styleid Sets the style of the map
Introduction API overview Implementation Future development Summary
Getting maps
Specifying area
Specify center and zoomsize=800x600¢er=51.47,0.0&zoom=14
Introduction API overview Implementation Future development Summary
Getting maps
Specifying area
Introduction API overview Implementation Future development Summary
Getting maps
Specifying area
Specify bounding boxsize=800x600&bbox=51.475,-0.02,51.479,0.02
Introduction API overview Implementation Future development Summary
Getting maps
Specifying area
Introduction API overview Implementation Future development Summary
Getting maps
Specifying area
Implicit area calculationsize=800x600&path=51.48,-0.02|51.48,0.02|51.465,0.0|51.48,-0.02
Introduction API overview Implementation Future development Summary
Getting maps
Specifying area
Introduction API overview Implementation Future development Summary
Getting maps
Paths
Optionsweight Width of the line
color Color of the lineopacity Level of opacity of the line
fill Color of the inner polygonfill-opacity Level of opacity of the inner polygon
Introduction API overview Implementation Future development Summary
Getting maps
Paths
Line examplesize=800x600&path=color:red|weight:10|opacity:0.6|51.46,-0.02|51.48,0.02
Introduction API overview Implementation Future development Summary
Getting maps
Paths
Introduction API overview Implementation Future development Summary
Getting maps
Paths
Polygon examplesize=800x600&path=color:red|weight:10|opacity:0.6|fill:blue|51.46,-0.02|51.48,0.02|51.46,0.02
Introduction API overview Implementation Future development Summary
Getting maps
Paths
Introduction API overview Implementation Future development Summary
Getting maps
Markers
Styling optionssize Size of the marker image (small,
mid or big)label Any letter in [a-Z] range or number
in range 0-99)color 8 predefined colors
opacity 0.0 for completely transparent, 1.0for completely opaque
Introduction API overview Implementation Future development Summary
Getting maps
Markers
Examplesize=800x600¢er=51.47,0.0&zoom=14&marker=51.47731,0.0|label:S|size:big|color:red|opacity:0.6
Introduction API overview Implementation Future development Summary
Getting maps
Markers
Introduction API overview Implementation Future development Summary
Getting maps
Markers
Two markers, same stylesize=800x600¢er=51.47,0.0&zoom=14&marker=51.47731,0.0|51.465,0.15|label:S|size:big|color:red|opacity:0.6
Introduction API overview Implementation Future development Summary
Getting maps
Markers
Introduction API overview Implementation Future development Summary
Getting maps
Markers
Two markers, different stylesize=800x600¢er=51.47,0.0&zoom=14&marker=51.47731,0.0|label:A|color:red&marker=51.465,-0.005|label:B|color:darkblue
Introduction API overview Implementation Future development Summary
Getting maps
Markers
Introduction API overview Implementation Future development Summary
Getting maps
Custom markers
URL of the imagemarker=url:<url of theimage>|<coords and other options>
Upload and use assigned idmarker=id:<assigned id>|<coords andother options>
Introduction API overview Implementation Future development Summary
Getting maps
Custom markers
Examplesize=800x600¢er=51.477222,0&zoom=14&marker=51.473,0.0|opacity:0.65|url:http://i.imgur.com/s3ZfB.png
Introduction API overview Implementation Future development Summary
Getting maps
Custom markers
Introduction API overview Implementation Future development Summary
Getting maps
Custom markers
Uploading image$ curl -XPOST http://.../marker [email protected]
Introduction API overview Implementation Future development Summary
Getting maps
Custom markers
Using idsize=800x600¢er=51.477222,0&zoom=14&marker=51.477222,0.0|id:f4f539ec97354a5c9eeb8fbe464b767c
Introduction API overview Implementation Future development Summary
Getting maps
Custom markers
Introduction API overview Implementation Future development Summary
Getting maps
Custom markers
MAH FACE IZ AMAZING
Introduction API overview Implementation Future development Summary
Competitor’s services
Google Maps
ConsQuite small set of APIsLots of restrictions
ProsIntegrated geocodingAmazing speedUnbelievable performanceI mean, it’s really freaking fast
Introduction API overview Implementation Future development Summary
Competitor’s services
MapQuest
ConsNo opacity supportNo POST support
ProsDecluttering of labelsIntegrated geocoding (USA-only)Traffic information
Introduction API overview Implementation Future development Summary
Initial
Initial approach
Every request gets processed by onerenderRender simply calls Mapnik renderingutilitiesMapnik does the magic
Introduction API overview Implementation Future development Summary
Initial
Mapnik rendering
ProsEasy to useInitial implementation took 4 daysDrawing paths and labels is a built-in
ConsSlow (0.2 - 10 seconds to render oneimage)Non-scalable (depends on databasescalability)
Introduction API overview Implementation Future development Summary
Current
Why rewrite?
Mapnik-based solution is not cacheableWe need speed for staticmaps...and scalability“Render less” strategy
Introduction API overview Implementation Future development Summary
Current
Rendering from cache
Consolidation of cache managementFastScales easily when no cache available
Introduction API overview Implementation Future development Summary
Comparing
Figure: Zeus decides which instance should take care ofthe request
Introduction API overview Implementation Future development Summary
Comparing
Figure: nginx checks the cache and if none found passesrequest further through FCGI
Introduction API overview Implementation Future development Summary
Comparing
Figure: Tilman then translates HTTP request into tritonrequest and checks it
Introduction API overview Implementation Future development Summary
Comparing
Figure: Triton dispatches request to the render(s)
Introduction API overview Implementation Future development Summary
Comparing
Figure: Old implementation is pretty inefficient
Introduction API overview Implementation Future development Summary
Comparing
Figure: New implementation takes advantage of allavailable rendering capabilities
Introduction API overview Implementation Future development Summary
Performance
More caching?
Using bigger/smaller tilesBraking tiles into several layersHaving cached staticmaps images in twolayers – markers + paths and base image
Introduction API overview Implementation Future development Summary
Performance
More scalability?
Using EC2 capabilities to instantly launchnew renders in case of high loadUsing PgPool II for DB scalingUsing NoSQL databases instead ofPostGIS for ease of scaling
Introduction API overview Implementation Future development Summary
API
Overall
Geocoding integrationNon-discrete zooms (free scale selection)
Introduction API overview Implementation Future development Summary
API
More path options
Drawing primitives – circles, polylines,multipolygonsAutomatic routing integrationLine caps and joins selectionUsing geohashes for shorter requests
Introduction API overview Implementation Future development Summary
API
Markers improvements
More default markersDecluttering and groupingMarker offsetsScale and transform abilitiesShades
Introduction API overview Implementation Future development Summary
Summary
Staticmaps is a cool service to implementIt’s still a very developing piece of codeI hope it’s usable
Introduction API overview Implementation Future development Summary
?
