MapQuest.js

L.mapquest.parkingLayer(options)

The parking layer displays parking lot data on the map within pre-determined zoom levels. The parking lots are shown as a combination of markers and polygons. The markers/polygons are shaded according to the relative cost of the parking lot. When a user clicks on a marker/polygon, a parking lot summary control is displayed in the bottom right corner of the map. This control contains information about the parking lot. The layer also has an overview control that is rendered at the bottom center of the map. This control allows users to see relative cost associated to colors, the closed parking lot color, and the ability to toggle off/on the markers/polygons.

Syntax

L.mapquest.key = 'KEY';
var map = L.mapquest.map('map', {
  center: [34.0522, -118.2437],
  layers: L.mapquest.tileLayer('map'),
  zoom: 17
});

var parkingLayer = L.mapquest.parkingLayer({
  maxParkingLots: 100
});

map.addLayer(parkingLayer);

Parameters

  • options object

    An object containing parking layer options.

    minZoom: The minimum zoom that parking lots are visible. Default is 16.

    maxZoom: The maximum zoom that traffic flow lines are visible. Default is 20.

    showPolygons: A boolean that controls if polygon outlines of parking lots are rendered. Default is true.

    maxParkingLots: An integer that controls the number of parking lots rendered on the layer. Default is 100.

    markerColorCostMap: An object that maps parking lots marker/polygon colors to relative cost. If a parking lot does not have a relative cost assigned, it will be given a cost of 0.

    The default map is:

    • 0: '#0041A9'

    • 1: '#448EF6'

    • 2: '#2a74dc'

    • 3: '#0041A9'

    • 4: '#000E76'

    closedMarker: An object controlling the color of the marker/polygon of a closed parking lot.

    • primaryColor: The primary color of the marker. The color of the polygon. Default is '#df0021'.

    • secondaryColor: The secondary color of the marker. Default is '#df0021'.

    overviewControl: An object controlling the overview control that is visible at the bottom center of the map.

    • enabled: A boolean that controls if the overview control is rendered. Default is true.

    parkingControl: An object that controls if when clicking on markers/polygons, a parking lot summary container is rendered.

    • enabled: A boolean that controls if the parking control is rendered. Default is true.

    • position: The position of the control (one of the map corners). Possible values are 'topleft', 'topright', 'bottomleft' or 'bottomright'.

    Example

    {
      minZoom: 15,
      maxZoom: 20,
      showPolygons: true,
      maxParkingLots: 100,
      markerColorCostMap: {
        0: '#0041A9',
        1: '#448EF6',
        2: '#2a74dc',
        3: '#0041A9',
        4: '#000E76',
      },
      closedMarker: {
        primaryColor: '#df0021',
        secondaryColor: '#df0021',
      },
      overviewControl: {
        enabled: true,
      },
      parkingControl: {
        enabled: true,
        position: 'bottomright',
      },
    }

Return Value

An L.Layer object that can be added to a map with the addLayer() function.

Visual Example