Skip to content

Create a custom map style

Define an entire MapLibre GL style in a query document.

---
title: Create a custom map style
description: Define an entire MapLibre GL style in a query document.
type: vector
style:
  version: 8
  layers:
    - type: background
      background-color: white
    - type: fill
      source-layer: landuse
      filter:
        - any
        - [==, 'pmap:kind', park]
        - [==, 'pmap:kind', protected_area]
        - [==, 'pmap:kind', national_park]
        - [==, 'pmap:kind', nature_reserve]
      fill-color: rgba(174, 210, 151, .5)
    - type: line
      source-layer: water
      filter: [==, $type, LineString]
      line-color: rgba(119, 187, 234, 1)
    - type: fill
      source-layer: water
      filter: [==, $type, Polygon]
      fill-color: rgba(119, 187, 234, 1)
    - type: line
      source-layer: boundaries
      line-dasharray: [4, 4]
      line-width: 0.5
      line-color: rgba(39, 39, 39, 1)
    - type: fill
      source-layer: buildings
      fill-color: rgba(206, 206, 206, 1)
    - type: line
      source-layer: transit
      filter: [==, 'pmap:kind', rail]
      line-color: rgba(160, 160, 160, 1)
    - type: line
      source-layer: transit
      filter: [==, 'pmap:kind', rail]
      line-color: rgba(119, 119, 119, 1)
      line-dasharray: [4, 4]
    - type: line
      source-layer: highway
      filter:
        - any
        - [==, type, path]
        - [==, type, steps]
        - [==, type, sidewalk]
      line-color: black
      line-width: 0.7
      line-dasharray: [10, 3]
    - type: line
      source-layer: highway
      filter:
        - any
        - [==, type, trail]
        - [==, type, track]
      line-color: black
      line-width: 0.7
      line-dasharray: [3, 3]
    - type: line
      source-layer: highway
      filter:
        - none
        - [==, type, path]
        - [==, type, trail]
        - [==, type, steps]
        - [==, type, cut]
        - [==, type, sidewalk]
        - [==, type, track]
      line-color:
        - case
        - [==, type, freeway]
        - darkgrey
        - black
      line-width:
        - case
        - [==, type, freeway]
        - 4
        - [==, type, highway]
        - 3
        - [==, type, major]
        - 2
        - 1
    - type: line
      source-layer: highway
      filter:
        - all
        - [==, type, path]
        - [==, bike, designated]
      line-width: 4
      line-color: rgba(11, 50, 213, 1)
    - type: line
      source-layer: highway
      filter: [==, cycleway, bikelane]
      line-color: rgba(0, 154, 18, 1)
      line-width: 4
    - type: line
      source-layer: highway
      filter: [==, cycleway, sharrows]
      line-color: rgba(242, 134, 60, 1)
      line-width: 4
    - type: line
      source-layer: highway
      filter: [==, cycleway, cycletrack]
      line-color: rgba(125, 24, 152, 1)
      line-width: 4
options:
  zoom: 14
  center: [-77.4723, 37.5193]
---
https://tiles.trailstash.net/opentrailstash.json


View Map on Overpass Ultra
Edit Query on Overpass Ultra