@lowswaplab/leaflet-control-hud NPM

leaflet-control-hud

Leaflet Head-Up Display (HUD) Control

NPM

This package is available on npm:

This package can be installed by performing:

npm install @lowswaplab/leaflet-control-hud

JavaScript

Example, with options (and defaults):

import "@lowswaplab/leaflet-control-hud";

L.control.HUD(
  {
  terrainEl: undefined,     // leaflet-tilelayer-terrainel layer
  style: "...",             // HUD box style (see source for default)
  title: "",                // title to display on first line of HUD
  unitsDistance: "metric",  // distance units
                            // "metric" (meters, km)
                            // "USCS" (feet, yards, miles; US customary),
                            // "nautical" (feet, yards, nautical miles)
  unitsElevation: "meters", // elevation units
                            // "meters"
                            // "feet"
  }).addTo(map);

This module can also use leaflet-tilelayer-terrainel to display terrain elevation:

import "@lowswaplab/leaflet-tilelayer-terrainel";
import "@lowswaplab/leaflet-control-hud";

var te=L.tileLayer.terrainEl("https://api.mapbox.com/v4/mapbox.terrain-rgb/{z}/{x}/{y}.pngraw?access_token=" + mapboxAccessToken,
  {
  maxNativeZoom: 14,
  maxZoom: 23,
  opacity: 0
  }).addTo(map);
L.control.HUD(
  {
  terrainEl: te
  }).addTo(map);