{"componentChunkName":"component---src-templates-developers-js","path":"/en/developers/apis/4-map-api/background-map/","result":{"data":{"childPages":{"edges":[{"node":{"fields":{"slug":"/en/developers/"},"frontmatter":{"title":"For developers","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/"},"frontmatter":{"title":"System architecture","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/api-registration/"},"frontmatter":{"title":"API portal and registration","order":-12,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/changes/"},"frontmatter":{"title":"Changes","order":-10,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/user-interfaces/"},"frontmatter":{"title":"User interfaces","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/deprecations/"},"frontmatter":{"title":"Deprecations","order":-11,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/docker-guide/"},"frontmatter":{"title":"Docker guide","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/"},"frontmatter":{"title":"APIs","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/"},"frontmatter":{"title":"Routing API","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/2-routing-data-api/"},"frontmatter":{"title":"Routing data API","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/4-map-api/"},"frontmatter":{"title":"Map API","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/x-apis/"},"frontmatter":{"title":"API architecture","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/6-api-faq/"},"frontmatter":{"title":"FAQ","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/5-realtime-api/"},"frontmatter":{"title":"Realtime APIs","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/3-geocoding-api/"},"frontmatter":{"title":"Geocoding API","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/7-terms-of-use/"},"frontmatter":{"title":"Terms of use","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/user-interfaces/1-digitransit-ui/"},"frontmatter":{"title":"Digitransit-ui","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/0-graphql/"},"frontmatter":{"title":"GraphQL","order":10,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/3-realtime-information/"},"frontmatter":{"title":"Real-time information","order":40,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/2-glossary/"},"frontmatter":{"title":"Glossary","order":30,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/canceled-trips/"},"frontmatter":{"title":"Canceled trips","order":80,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/disruption-info/"},"frontmatter":{"title":"Disruption info","order":70,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/4-translations/"},"frontmatter":{"title":"Translation","order":50,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/routes/"},"frontmatter":{"title":"Routes","order":100,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/stops/"},"frontmatter":{"title":"Stops","order":110,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/bicycles-scooters-cars/"},"frontmatter":{"title":"Bicycles, cars and e-scooters","order":60,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/itinerary-planning/"},"frontmatter":{"title":"Itinerary planning","order":90,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/x-apis/1-routing-api/"},"frontmatter":{"title":"Routing API","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/x-apis/2-routing-data-api/"},"frontmatter":{"title":"Routing Data","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/x-apis/4-map-api/"},"frontmatter":{"title":"Map API","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/x-apis/5-realtime-api/"},"frontmatter":{"title":"Real-time APIs","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/x-apis/3-geocoding-api/"},"frontmatter":{"title":"Geocoding API","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/1-routing-api/1-graphiql/"},"frontmatter":{"title":"GraphiQL","order":20,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/4-map-api/background-map/"},"frontmatter":{"title":"Background map","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/5-realtime-api/1-getting-started/"},"frontmatter":{"title":"Getting started","order":10,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/3-geocoding-api/address-search/"},"frontmatter":{"title":"Address search","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/3-geocoding-api/autocomplete/"},"frontmatter":{"title":"Autocomplete","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/5-realtime-api/trip-updates/"},"frontmatter":{"title":"Trip updates","order":30,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/5-realtime-api/service-alerts/"},"frontmatter":{"title":"Service alerts","order":20,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/3-geocoding-api/address-lookup/"},"frontmatter":{"title":"Address lookup","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/4-map-api/pois/"},"frontmatter":{"title":"Points of interest","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/5-realtime-api/vehicle-positions/"},"frontmatter":{"title":"Vehicle positions","order":40,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/x-apis/3-geocoding-api/data-container/"},"frontmatter":{"title":"Data builder and container","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/architecture/x-apis/3-geocoding-api/api/"},"frontmatter":{"title":"API","order":null,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/5-realtime-api/vehicle-positions/high-frequency-positioning/"},"frontmatter":{"title":"High-frequency positioning","order":20,"redirect":null}}},{"node":{"fields":{"slug":"/en/developers/apis/5-realtime-api/vehicle-positions/digitransit-mqtt/"},"frontmatter":{"title":"Digitransit MQTT broker","order":10,"redirect":null}}}]},"markdownRemark":{"fields":{"slug":"/en/developers/apis/4-map-api/background-map/"},"frontmatter":{"title":"Background map","redirect":null,"toc":null,"description":null,"assets":null,"technologies":null,"docker":null},"html":"<p>Background map provides <strong>HSL style</strong> map tiles for example for browser based applications.</p>\n<h2 id=\"data-format\" style=\"position:relative;\"><a href=\"#data-format\" aria-label=\"data format permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Data format</h2>\n<p><strong>Raster maps</strong> are available in <a href=\"https://wiki.osgeo.org/wiki/Tile_Map_Service_Specification\">Tile Map Service format</a></p>\n<p><strong>Note:</strong> Background map is also available as vector tiles from source <code class=\"language-text\">hsl-vector-map</code> in <a href=\"https://openmaptiles.org/\">OpenMapTiles</a> schema. Styles used by HSL can be found on: <a href=\"https://github.com/HSLdevcom/hsl-map-style\">https://github.com/HSLdevcom/hsl-map-style</a></p>\n<p>Remember to include your <code class=\"language-text\">digitransit-subscription-key</code> parameter!</p>\n<h2 id=\"endpoint\" style=\"position:relative;\"><a href=\"#endpoint\" aria-label=\"endpoint permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Endpoint</h2>\n<p><code class=\"language-text\">https://cdn.digitransit.fi/map/v3/:source/:z/:x/:y:size.png?digitransit-subscription-key={YOUR_SUBSCRIPTION_KEY}</code></p>\n<h2 id=\"tilejson-endpoint\" style=\"position:relative;\"><a href=\"#tilejson-endpoint\" aria-label=\"tilejson endpoint permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>TileJSON endpoint</h2>\n<p><code class=\"language-text\">https://cdn.digitransit.fi/map/v3/:source/index.json?digitransit-subscription-key={YOUR_SUBSCRIPTION_KEY}</code></p>\n<p>You can also include <code class=\"language-text\">digitransit-subscription-key</code> header in your request instead of the url parameters.</p>\n<h3 id=\"supported-url-parameters\" style=\"position:relative;\"><a href=\"#supported-url-parameters\" aria-label=\"supported url parameters permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Supported URL parameters</h3>\n<table>\n<thead>\n<tr>\n<th>Parameter</th>\n<th>Type</th>\n<th>Description</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>source</td>\n<td>string</td>\n<td>Source layer. See choices below. E.g., <code class=\"language-text\">hsl-map</code> or <code class=\"language-text\">hsl-vector-map</code></td>\n</tr>\n<tr>\n<td>z</td>\n<td>int</td>\n<td>Zoom level</td>\n</tr>\n<tr>\n<td>x</td>\n<td>int</td>\n<td>x-coordinate</td>\n</tr>\n<tr>\n<td>y</td>\n<td>int</td>\n<td>y-coordinate</td>\n</tr>\n<tr>\n<td>size</td>\n<td>string</td>\n<td>'@2x' for retina tiles or empty value for normal</td>\n</tr>\n</tbody>\n</table>\n<h3 id=\"sources\" style=\"position:relative;\"><a href=\"#sources\" aria-label=\"sources permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Sources</h3>\n<table>\n<thead>\n<tr>\n<th>Value</th>\n<th>Description</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td><code class=\"language-text\">hsl-map</code></td>\n<td>512px raster tiles with Finnish language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-256</code></td>\n<td>256px raster tiles with Finnish language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-sv</code></td>\n<td>512px raster tiles with Swedish language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-sv-256</code></td>\n<td>256px raster tiles with Swedish language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-en</code></td>\n<td>512px raster tiles with English language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-en-256</code></td>\n<td>256px raster tiles with English language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-fi-sv</code></td>\n<td>512px bilingual raster tiles with Finnish / Swedish language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-fi-sv-256</code></td>\n<td>256px bilingual raster tiles with Finnish / Swedish language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-greyscale</code></td>\n<td>512px grayscale raster tiles with Finnish language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-map-greyscale-256</code></td>\n<td>256px grayscale raster tiles with Finnish language</td>\n</tr>\n<tr>\n<td><code class=\"language-text\">hsl-vector-map</code></td>\n<td>Vector tiles</td>\n</tr>\n</tbody>\n</table>\n<h2 id=\"examples\" style=\"position:relative;\"><a href=\"#examples\" aria-label=\"examples permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Examples</h2>\n<h3 id=\"an-example-of-what-the-hsl-map-tiles-look-like\" style=\"position:relative;\"><a href=\"#an-example-of-what-the-hsl-map-tiles-look-like\" aria-label=\"an example of what the hsl map tiles look like permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>An example of what the HSL map tiles look like</h3>\n<p><img src=\"http://cdn.digitransit.fi/map/v3/hsl-map/16/37311/18963@2x.png\" alt=\"hsl-map-style\"></p>\n<h3 id=\"hsl-style-map-tiles\" style=\"position:relative;\"><a href=\"#hsl-style-map-tiles\" aria-label=\"hsl style map tiles permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>HSL style map tiles</h3>\n<blockquote>\n<p><a href=\"https://cdn.digitransit.fi/map/v3/hsl-map/16/37313/18958.png\">https://cdn.digitransit.fi/map/v3/hsl-map/16/37313/18958.png</a></p>\n</blockquote>\n<h3 id=\"retina-tiles\" style=\"position:relative;\"><a href=\"#retina-tiles\" aria-label=\"retina tiles permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Retina tiles</h3>\n<blockquote>\n<p><a href=\"https://cdn.digitransit.fi/map/v3/hsl-map/16/37313/18958@2x.png\">https://cdn.digitransit.fi/map/v3/hsl-map/16/37313/18958@2x.png</a></p>\n</blockquote>\n<h3 id=\"swedish-language-tiles\" style=\"position:relative;\"><a href=\"#swedish-language-tiles\" aria-label=\"swedish language tiles permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Swedish language tiles</h3>\n<blockquote>\n<p><a href=\"https://cdn.digitransit.fi/map/v3/hsl-map-sv/16/37313/18958.png\">https://cdn.digitransit.fi/map/v3/hsl-map-sv/16/37313/18958.png</a></p>\n</blockquote>\n<h3 id=\"english-language-tiles\" style=\"position:relative;\"><a href=\"#english-language-tiles\" aria-label=\"english language tiles permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>English language tiles</h3>\n<blockquote>\n<p><a href=\"https://cdn.digitransit.fi/map/v3/hsl-map-en/16/37313/18958.png\">https://cdn.digitransit.fi/map/v3/hsl-map-en/16/37313/18958.png</a></p>\n</blockquote>\n<h3 id=\"bilingual-finnish--swedish-language-tiles\" style=\"position:relative;\"><a href=\"#bilingual-finnish--swedish-language-tiles\" aria-label=\"bilingual finnish  swedish language tiles permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Bilingual Finnish / Swedish language tiles</h3>\n<blockquote>\n<p><a href=\"https://cdn.digitransit.fi/map/v3/hsl-map-fi-sv/16/37313/18958.png\">https://cdn.digitransit.fi/map/v3/hsl-map-fi-sv/16/37313/18958.png</a></p>\n</blockquote>","tableOfContents":"<ul>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#data-format\">Data format</a></li>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#endpoint\">Endpoint</a></li>\n<li>\n<p><a href=\"/en/developers/apis/4-map-api/background-map/#tilejson-endpoint\">TileJSON endpoint</a></p>\n<ul>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#supported-url-parameters\">Supported URL parameters</a></li>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#sources\">Sources</a></li>\n</ul>\n</li>\n<li>\n<p><a href=\"/en/developers/apis/4-map-api/background-map/#examples\">Examples</a></p>\n<ul>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#an-example-of-what-the-hsl-map-tiles-look-like\">An example of what the HSL map tiles look like</a></li>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#hsl-style-map-tiles\">HSL style map tiles</a></li>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#retina-tiles\">Retina tiles</a></li>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#swedish-language-tiles\">Swedish language tiles</a></li>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#english-language-tiles\">English language tiles</a></li>\n<li><a href=\"/en/developers/apis/4-map-api/background-map/#bilingual-finnish--swedish-language-tiles\">Bilingual Finnish / Swedish language tiles</a></li>\n</ul>\n</li>\n</ul>","excerpt":"Background map provides HSL style map tiles for example for browser based applications. Data format Raster maps are available in Tile Map Service format Note: Background map is also available as…"}},"pageContext":{"slug":"/en/developers/apis/4-map-api/background-map/"}},"staticQueryHashes":["3675773199","4050193485"]}