Options
All
  • Public
  • Public/Protected
  • All
Menu

@maplibre/maplibre-gl-directions - v0.1.6

MapLibreGlDirections

For the sakes of your convenience, make sure you've enabled the "Public" filter:

Enabling the "Public" filter


Basic Usage

Start by importing the plugin. Then, when the map is loaded, create an instance of the imported MapLibreGlDirections class passing to the constructor a map instance and optionally a {@link MapLibreGlDirectionsOptions|configuration object}.

import MapLibreGlDirections from "@maplibre/maplibre-gl-directions";

map.on("load", () => {
const directions = new MapLibreGlDirections(map, {
// optional configuration
});
});

If needed, enable the interactivity.

directions.interactive = true;

Use the plugin's public interface to set, add and remove waypoints.

// Set the waypoints programmatically
directions.setWaypoints([
[-73.8271025, 40.8032906],
[-73.8671258, 40.82234996],
]);

// Remove the first waypoint
directions.removeWaypoint(0);

// Add a waypoint at index 0
directions.addWaypoint([-73.8671258, 40.82234996], 0);

Listen to the plugin's events.

directions.on("movewaypoint", () => {
console.log("A waypoint has been moved!");
});

Call the clear method to remove all the plugin's traces from the map.

directions.clear();

If you need to completely disable the plugin, make sure to call the destroy method first.

directions.destroy();
directions = undefined;

Controls

LoadingIndicatorControl

The LoadingIndicatorControl adds a spinning wheel that appears whenever there's an ongoing routing requests and automatically disappears as soon as the request is finished.

The loading indicator's appearance is configurable via the LoadingIndicatorControlConfiguration object that is (optionally) passed as the second argument to the @{link LoadingIndicatorControl} constructor.

See the respective Demo.


Customization

For the sakes of your convenience, make sure you've enabled the "Public/Protected" filter:

Enabling the "Public/Protected" filter

WIP...

Generated using TypeDoc