Skip to content

Bike Infrastructure

Query and style bikelanes, bike parking, repair stations, and bike shops.

---
title: Bike Infrastructure
description: Query and style bikelanes, bike parking, repair stations, and bike shops.
options:
  zoom: 14
  center: [-77.4705, 37.5686]
style:
  extends: https://styles.trailsta.sh/openmaptiles-osm.json
  layers:
    - type: line
      beforeLayerId: road_path_oneway
      filter:
        - any
        - [ ==, [ get, cycleway ], track ]
        - [ ==, [ get, 'cycleway:right' ], track ]
        - [ ==, [ get, 'cycleway:left' ], track ]
      paint: &paint
        line-width:
          stops: [ [ 13, 2.5 ], [ 16, 4 ] ]
        line-color: blue
    - type: line
      beforeLayerId: road_path_oneway
      filter:
        - any
        - [ ==, [ get, cycleway ], lane ]
        - [ ==, [ get, 'cycleway:right' ], lane ]
        - [ ==, [ get, 'cycleway:left' ], lane ]
      paint:
        <<: *paint
        line-dasharray: [ 4, 2 ]
    - type: line
      beforeLayerId: road_path_oneway
      filter:
        - any
        - [ ==, [ get, cycleway ], shared_lane ]
        - [ ==, [ get, 'cycleway:right' ], shared_lane ]
        - [ ==, [ get, 'cycleway:left' ], shared_lane ]
      paint:
        <<: *paint
        line-dasharray: [ 1, 2 ]
    - type: line
      beforeLayerId: road_path_oneway
      filter: [ ==, [ get, highway ], cycleway ]
      paint:
        <<: *paint
        line-color: darkblue
    - type: symbol
      filter: [ ==, [ geometry-type ], Point ]
      icon-halo-width: 2
      icon-halo-blur: 1
      icon-halo-color: white
      icon-size:
        - case
        - [ ==, [ get, amenity ], bicycle_repair_station ]
        - 0.75
        - [ ==, [ get, amenity ], bicycle_parking ]
        - 0.5
        - [ ==, [ get, bicycle_rental ], docking_station ]
        - 0.75
        - 1
      icon-color:
        - case
        - [ ==, [ get, amenity ], bicycle_repair_station ]
        - rgb(0, 146, 218)
        - [ ==, [ get, amenity ], bicycle_parking ]
        - rgb(0, 146, 218)
        - [ ==, [ get, bicycle_rental ], docking_station ]
        - rgb(0, 146, 218)
        - [ ==, [ get, shop ], bicycle ]
        - rgb(172, 57, 172)
        - [ ==, [ get, amenity ], bicycle_rental ]
        - rgb(172, 57, 172)
        - black
      symbol-sort-key:
        - case
        - [ ==, [ get, amenity ], bicycle_repair_station ]
        - 30
        - [ ==, [ get, amenity ], bicycle_parking ]
        - 40
        - [ ==, [ get, amenity ], bicycle_rental ]
        - 10
        - [ ==, [ get, shop ], bicycle ]
        - 0
        - 50
      icon-image:
        - case
        - [ ==, [ get, amenity ], bicycle_repair_station ]
        - temaki:bicycle_repair
        - [ ==, [ get, amenity ], bicycle_parking ]
        - temaki:bicycle_parked
        - [ ==, [ get, amenity ], bicycle_rental ]
        - temaki:bicycle_rental
        - [ ==, [ get, shop ], bicycle ]
        - maki:bicycle
        - maki:circle
---
[bbox:{{bbox}}];
(
nwr[shop=bicycle];
nwr[amenity=bicycle_rental];
nwr[amenity=bicycle_repair_station];
nwr[amenity=bicycle_parking];
);
out center;
(
way[cycleway][cycleway!=no];
way["cycleway:right"]["cycleway:right"!=no];
way["cycleway:left"]["cycleway:left"!=no];
way[highway=cycleway];
);
out geom;


View Map on Ultra
Edit Query on Ultra