Static Images Guide
API description
If you want to build your own application, there are two basic options of how to define the area of your interest. The first one is called a Center-based URL, where the area displayed on an image is defined by the longitude/latitude of the image’s center point and zoom level (can be fractional). The other option, Bounds-based URL, is defined by a couple of coordinates defining the bottom left and top right corner.
Autofitting the area
It is also possible to use auto
instead of the region specification (center or bounds) in the URL. In such a case, the area will be automatically calculated based on a path from the query (at least one polygon or marker has to be specified). See the documentation of the format and possible values below.
Adding polygons and lines
The polygon or polyline can be passed in a path
query parameter (it can be used more than once). Coordinates of the individual path vertices are comma-separated lat,lng
pairs. The vertices are separated with a pipe symbol. Additionally, these following special "commands" can be used (in a form of key:value
appended before the path coordinates):
- fill - color to use as the fill (e.g. red, rgba(255,255,255,0.5), #0000ff, none, false)
- stroke - the color of the path stroke
- width - width of the stroke (in pixels)
- enc - Path encoded according to Google Encoded Polyline Format
- e.g.
_p~iF~ps|U_ulLnnqC_mqNvxq`@
- If used, do not specify the coordinate pairs -- the rest of this path parameter is considered to be part of the encoded polyline string.
You can also use fill
, stroke
and width
as a separate query parameters to specify default styling for all the paths.
Examples:
path=5.9,45.8|5.9,47.8|10.5,47.8|10.5,45.8|5.9,45.8
- a polygon with default colors
path=stroke:green|width:3|fill:none|5.9,45.8|5.9,47.8|10.5,47.8|10.5,45.8|5.9,45.8
- the same polygon, but with 3px green stroke a no fill
path=stroke:red|fill:none|enc:_p~iF~ps|U_ulLnnqC_mqNvxq`@
- draws a red line based on the encoded polyline
Adding markers
The markers can be passed in a markers
query parameter (it can be used more than once). Each marker is a comma-separated lat,lng
pair. Individual markers are separated with a pipe symbol. Each marker can also have a different color - specified as the 3rd parameter (e.g. 14.4,50.1,red|8.6,47.4,blue
). Additionally, these following special "commands" can be used (in a form of key:value
appended before the marker coordinates):
icon
- URL to a remote image (URL-encoded)- You can use a URL shortener service to create more compact queries.
- Icon has to be at most 64 kB and 4096 pixels (e.g. 64x64 image).
- If used, the specified colors of the markers are ignored.
anchor
- the anchor point of the custom icon, possible values:top, left, bottom, right, center, topleft, bottomleft, topright, bottomright
- the default value is
bottom
scale
- the scale of the image (useful if you want to provide a HiDPI image that scales down correctly), the default value is1
Examples:
markers=14.4,50.1|8.6,47.4|2.4,48.9
- 3 separate markers will be displayedmarkers=14.4,50.1,red|8.6,47.4,blue
- 1 red and 1 blue markermarkers=icon:https://tinyurl.com/yakrjl3t|anchor:center|14.4,50.1|8.6,47.4
- 2 markers with the specified custom icon centered at their positions
Other
- attribution
- change the location of the attribution text:
topleft, bottomleft, topright, bottomright
attribution=false
orattribution=0
to disable attribution (make sure to display the correct attribution yourself in case you use this)lnglat
(lnglat=true
orlnglat=1
) - indicates the polygon and marker coordinates are in lat,lng order rather than the usual lng,latpadding
- “percentage” padding for fitted endpoints (bounds-based and auto)- e.g. value of
0.1
means “add 10% size to each side to make sure the area of interest is nicely visible”