Skip to content

Map OpenLayers 6 Canvas

Jump to bottom
alexgao1 edited this page Sep 13, 2023 · 3 revisions

Map Canvas Documentation

The map canvas is based on the OpenLayers 6 library. This provides a lot of functionality not available in the old OpenLayers 2 map configuration. This new canvas is still in active development but is in use in production atlases.

Required configuration

canvasType

"canvasType": "map"
Selects this canvas

canvasName

"canvasName": "<string>"
Name of this canvas for widgets and anything else to register against

coordinates

"coordinates": {
    "initialBounds":
      "<minX>",
      "<minY>",
      "<maxX>",
      "<maxY>"
    ],
    "autoInitialBounds": <boolean>
  }

Initial coordinates to fit into the map view when the module loads. If no bounds are provided the map will load, but will not be in a useful location. autoInitialBounds can be set to true or false but currently isn't working, see issue https://github.com/GCRC/nunaliit/issues/1082

backgrounds

"backgrounds": [<array of background configs>]
Every map should have at least on background layer. Each background config has fields name, type and options.

    "backgrounds": [
    {
      "name": "<string>",
      "type": "<string>",
      "options": {<options>}
    }
    ]
  • name: Label for this background layer
  • type: One of "bing", "wms", "wmts", "osm","stamen".

bing

Provide options with keys:

osm

Provide options with keys:

stamen

Provide options with keys:

  • "url": <string>: URL template to use. See http://maps.stamen.com/#toner/ for details on URL structure. An example URL that will work is "https://stamen-tiles-{s}.a.ssl.fastly.net/toner/{z}/{x}/{y}{r}.png"
  • "layerName": "<string>": One of "toner", "terrain", "watercolor". See http://maps.stamen.com/ for details

stadia

Stadia backgrounds require the use of an account in order to set up domain authentication or an API key. It is recommended that domain-based authentication is used.
Provide options with keys:

  • "layerName": "<string>": One of alidade_smooth, alidade_smooth_dark, outdoors, stamen_toner, stamen_terrain, stamen_watercolor, or osm_bright. See https://docs.stadiamaps.com/themes/ for (free) themes

wms

Provide options with keys:

  • "url": "<string>": WMS url
  • "layers": "<string>": WMS layer
  • "srs": "<string>": Source reference system projection (e.x. "EPSG:3338")
  • "styles": "<string>": (optional) WMS styles
  • "wmsLegend": "<boolean>": (optional) defaults to false. If true a legend will be fetched and displayed in the legend widget.
  • "WIDTH": "<string>": (optional) WMS width parameter.
  • "HEIGHT": "<string>": (optional) WMS height parameter.
  • "VERSION": "<string>": (optional) WMS version parameter.
  • "BBOX": "<bbox>": (optional) WMS bbox parameter.
  • "CRS": "<string>": (optional) WMS CRS (coordinate reference system) parameter.
  • `"bgcolor": "": (optional) Background color parameter (e.x. -9999).

wmst

Provide options with keys:

  • "url": "<string>": The URL of the WMTS server
  • "layer": "<string>": A string containing the layer name, to be assembled by the WMTS server.
  • "style": "<string>": A string containing the style name, to apply style to each named layer.
  • "requestEncoding": "<string>": Sets the encoding (REST|KVP) of the tile requests.
  • "numZoomLevels": "<integer>": Sets the number of zoom levels associated with the service.
  • "matrixSet": "<string>": Sets the matrixSet/projection name associated with the layer.
  • "srsName": "<string>": (optional) Sets the projection associated with the layer.
  • "layername": "<string>": (optional) Sets the layername associated with the layer.
  • "opacity": "<string>": (optional) Sets the opacity associated with the layer.
  • "isBaseLayer": "<boolean>": (optional) true or false.

Overlays

Overlays to show on the map. Each entry in the overlay array has configuration for that overlay.

    "overlays": [
    {
      "name": "2070's - RCP8.5 (in.)",
      "type": "wms",
      "visibility": false,
      "swipe": "right",
      "options": {}    
     ]
  • "name": "<string>": Name of the layer type : String that specifies the type of overlay. Possible values are: "couchdb", "model" and "wms". options : Object defining parameters. Based on the type of overlay. clustering : (optional) true or false swipe: (optional) leftorright. Defaults to showing on both sides. Requires that layerSwipeistrue. visibility: (optional) if truethe layer is visible by default, iffalse` it is hidden by default.

couchdb

Gets features from couchdb query. Options:

  • "layerName": <string>: String that specifies the layer identifier.

model

Fetch features to display from a model (https://github.com/GCRC/nunaliit/wiki/Nunaliit-Documentation-for-Atlas-Builders#atlas_model). Options:

  • "sourceModelId": <string>: The model ID to get features from.

wms

Same options as for WMS background, see: https://github.com/GCRC/nunaliit/wiki/OpenLayers-6-Canvas#wms

styles

See the conditional map styling documentation at https://github.com/GCRC/nunaliit/wiki/Nunaliit-Documentation-for-Atlas-Builders#conditional-map-styling

Optional configuration

Configuration that can be provided but has defaults.

  • "layerSwipe": <boolean>: Defaults to false. When set to true the map will have a slider in the middle that can be moved left and right to show layers based on their config. Overlay layers will be displayed on the right, left or both depending on the swipe config. Valid options are:
    • "swipe": "right": Overlay displayed on the right side of the slider.
    • "swipe": "left": Overlay displayed on the left side of the slider.
    • swipe config set to any other value or left out: Overlay displayed on both sides of the slider.
  • "wmsGetFeatureInfo": <boolean>: true or false, defaults to false. If true then clicking on the WMS overlays will request feature info from the WMS service and display the value in a popup dialog.
  • "couchDbSourceTitle": <string>: Title to use for the couchDb layer in the layer chooser`
Clone this wiki locally