How to Draw Routes and Areas on a Static Map
- API or service
- Static Maps API
- Task
- Route or area coordinates → static map image
- Examples
- Difficulty
- Intermediate
- Time
- 10 min
You have a route, service area, delivery zone, or another geometry and need it rendered on a static map. A GET request can carry short geometry definitions, but complex coordinates quickly make the URL long and difficult to maintain.
Use a Static Maps API POST request with a JSON body for routes and areas. The body keeps coordinates and styles structured, supports multiple geometries, and avoids depending on browser and proxy URL-length limits. The response is still a PNG or JPEG image.
Draw a route with a POST request
Use the route geometry returned by the Routing API instead of connecting only the waypoints with straight lines. This example encodes a 118-point driving route as a precision-6 polyline, which keeps the POST body compact while preserving the road shape.
POST https://maps.geoapify.com/v1/staticmap?apiKey=YOUR_API_KEY
Content-Type: application/json
{
"style": "osm-bright",
"width": 800,
"height": 500,
"scaleFactor": 2,
"format": "png",
"geometries": [
{
"type": "polyline6",
"value": "cwgn}@|rcowCmCzGgCfNeCfNwCtYuDh_@yKr^sHhN{FtE{Dp@cHQsY{Fa`@}Fg\\aH{m@{Jgn@qIkl@aBme@CchDr@s`MlCmtE|Dao@ViD@meAZuLQcM_@kLkA_MyAiLkBqKmCaLyCyKgEoKsE}J_FkKmGcJoGeO}LaOaOsRcVeKiPuGmMcGcMuHqSeEsMqD}M{CcNcCiOuEs]}BaV_Hcp@m@yFkCsPoEc`@oH{f@s@oFmDeSaD_Ru@eC_B_Dm@aD{Fa[gPa|@G[sQu_Ao@_Di@{C{E_XaBcJES_@qBiE_VE[uAuHuA{H_Hy_@a@yBmBqKi@}CqH}a@[cBiDoRo@oDoB_MeAmGw@aFe@uCm@oEQqA{@qGm@mEy@eGs@iFEa@y@cGOiA_@oCWmBU}AyAsK]iC_@oCoBoN[uByBoO]iCa@qCk@aEk@_EOeAoFu_@}CaVm@{Ew@eGiEq\\sDkY[gCu@{CaDkM",
"linecolor": "#1565c0",
"lineopacity": 0.9,
"linewidth": 6,
"linestyle": "solid"
}
],
"markers": [
{
"lat": 32.75596735500372,
"lon": -79.95637941825834,
"type": "circle",
"color": "#00ac17",
"size": 42,
"contentsize": 28,
"text": "A"
},
{
"lat": 32.7848373703839,
"lon": -79.93909960941784,
"type": "circle",
"color": "#e64a19",
"size": 42,
"contentsize": 28,
"text": "B"
}
]
}
Image size: with
scaleFactor: 2, the generated bitmap is 1600 × 1000 pixels (800 × 2by500 × 2).
Result:

The marker properties are the POST-body equivalent of type:circle;color:%2300ac17;size:42;contentsize:28;text:A. In JSON, write colors with #; URL encoding such as %23 is only required inside URL parameters.
Because the request omits center and zoom, the Static Maps API fits the viewport to the route and markers automatically. Use polyline5 or polyline6 according to the precision of the encoded route returned by your Routing API request.
Draw an area with a POST request
Use a polygon geometry for a service area or boundary. The Static Maps renderer closes the polygon automatically.
POST https://maps.geoapify.com/v1/staticmap?apiKey=YOUR_API_KEY
Content-Type: application/json
{
"style": "positron",
"width": 800,
"height": 500,
"scaleFactor": 2,
"format": "png",
"center": {
"lat": 52.5225,
"lon": 13.39
},
"zoom": 13,
"geometries": [
{
"type": "polygon",
"value": [
{ "lat": 52.5100, "lon": 13.3650 },
{ "lat": 52.5100, "lon": 13.4150 },
{ "lat": 52.5350, "lon": 13.4150 },
{ "lat": 52.5350, "lon": 13.3650 }
],
"linecolor": "#6a1b9a",
"lineopacity": 1,
"linewidth": 3,
"linestyle": "solid",
"fillcolor": "#ab47bc",
"fillopacity": 0.25
}
]
}
Image size: with
scaleFactor: 2, the generated bitmap is 1600 × 1000 pixels (800 × 2by500 × 2).
Result:

Add several objects to geometries when the image contains multiple areas or a mixture of polygons, lines, rectangles, and circles. Omit center and zoom when the API should fit the view to all geometry; use area when the image must always show a fixed bounding box.