Leaflet

https://leafletjs.com/reference-2.0.0.html
Admin
Leaflet is an open-source JavaScript library designed for mobile-friendly interactive maps.
Tokens:43,174
Snippets:509
Trust Score:9.5
Update:2 months ago
Show doc for...
Tokens:
Raw
### once

Source: https://leafletjs.com/reference-2.0.0.html

Behaves as on(), except the listener will only get fired once and then removed.

```APIDOC
## once(...)

### Description
Behaves as on(), except the listener will only get fired once and then removed.
```

--------------------------------

### getBounds()

Source: https://leafletjs.com/reference-2.0.0.html

Get the bounds that this ImageOverlay covers.

```APIDOC
## getBounds()

### Description
Get the bounds that this ImageOverlay covers.

### Returns
- **LatLngBounds**
```

--------------------------------

### getBounds()

Source: https://leafletjs.com/reference-2.0.0.html

Get the bounds that this ImageOverlay covers.

```APIDOC
### getBounds()

Get the bounds that this ImageOverlay covers.

**Returns:** `LatLngBounds`
```

--------------------------------

### Initialize a VideoOverlay

Source: https://leafletjs.com/reference-2.0.0.html

Instantiate a new video overlay by providing the video source URL and the geographical bounds, then add it to the map instance.

```javascript
const videoUrl = 'https://www.mapbox.com/bites/00188/patricia_nasa.webm',
    videoBounds = [[ 32, -130], [ 13, -100]];
new VideoOverlay(videoUrl, videoBounds ).addTo(map);
```

--------------------------------

### Initialize and configure a FeatureGroup

Source: https://leafletjs.com/reference-2.0.0.html

Demonstrates creating a FeatureGroup with multiple layers, binding a popup, and attaching a click event listener.

```javascript
new FeatureGroup([marker1, marker2, polyline])
    .bindPopup('Hello world!')
    .on('click', function() { alert('Clicked on a member of the group!'); })
    .addTo(map);
```

--------------------------------

### Create and use a DivIcon

Source: https://leafletjs.com/reference-2.0.0.html

Demonstrates initializing a DivIcon with a custom CSS class and assigning it to a marker.

```javascript
const myIcon = new DivIcon({className: 'my-div-icon'});
// you can set .my-div-icon styles in CSS

new Marker([50.505, 30.57], {icon: myIcon}).addTo(map);
```

--------------------------------

### getWheelPxFactor()

Source: https://leafletjs.com/reference-2.0.0.html

Gets the wheel pixel factor based on the devicePixelRatio.

```APIDOC
## getWheelPxFactor()

### Description
Gets the wheel pixel factor based on the devicePixelRatio.
```

--------------------------------

### Initialize and add a TileLayer

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new TileLayer with a URL template and attribution, then adds it to the map instance.

```javascript
new TileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar', attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'}).addTo(map);
```

--------------------------------

### getWheelDelta(ev)

Source: https://leafletjs.com/reference-2.0.0.html

Gets the normalized wheel delta from a wheel DOM event.

```APIDOC
## getWheelDelta(ev)

### Description
Gets normalized wheel delta from a wheel DOM event, in vertical pixels scrolled (negative if scrolling down). Events from pointing devices without precise scrolling are mapped to a best guess of 60 pixels.

### Parameters
- **ev** (DOMEvent) - Required - The wheel DOM event.
```

--------------------------------

### new VideoOverlay(video, bounds, options)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new VideoOverlay object to display a video on the map.

```APIDOC
## new VideoOverlay(video, bounds, options)

### Description
Instantiates an image overlay object given the URL of the video (or array of URLs, or even a video element) and the geographical bounds it is tied to.

### Parameters
- **video** (String|Array|HTMLVideoElement) - Required - The URL of the video, an array of URLs, or a video element.
- **bounds** (LatLngBounds) - Required - The geographical bounds the video is tied to.
- **options** (VideoOverlay options) - Optional - Configuration options for the video overlay.

### Options
- **autoplay** (Boolean) - Default: true - Whether the video starts playing automatically when loaded.
- **loop** (Boolean) - Default: false - Whether the video will loop back to the beginning when played.
- **keepAspectRatio** (Boolean) - Default: true - Whether the video will save aspect ratio after the projection.
- **muted** (Boolean) - Default: false - Whether the video starts on mute when loaded.
- **playsInline** (Boolean) - Default: true - Whether mobile browsers will play the video inline instead of fullscreen.
- **opacity** (Number) - Default: 1.0 - The opacity of the overlay.
- **alt** (String) - Default: '' - Text for the alt attribute.
- **interactive** (Boolean) - Default: false - If true, the overlay will emit pointer events.
- **crossOrigin** (Boolean|String) - Default: false - Whether the crossOrigin attribute will be added.
- **errorOverlayUrl** (String) - Default: '' - URL to the overlay image to show if the video fails to load.
- **zIndex** (Number) - Default: 1 - The explicit zIndex of the overlay layer.
- **className** (String) - Default: '' - A custom class name to assign to the element.
- **decoding** (String) - Default: 'auto' - The decoding attribute for the element.
- **bubblingPointerEvents** (Boolean) - Default: true - Whether pointer events bubble to the map.
- **pane** (String) - Default: 'overlayPane' - The map pane where the layer is added.
- **attribution** (String) - Default: null - Attribution string for the layer.
```

--------------------------------

### getPointerPosition(ev, container?)

Source: https://leafletjs.com/reference-2.0.0.html

Gets the normalized pointer position relative to a container or the page.

```APIDOC
## getPointerPosition(ev, container?)

### Description
Gets normalized pointer position from a DOM event relative to the `container` (border excluded) or to the whole page if not specified.

### Parameters
- **ev** (DOMEvent) - Required - The DOM event.
- **container** (HTMLElement) - Optional - The container element.
```

--------------------------------

### Initialize a WMS Tile Layer

Source: https://leafletjs.com/reference-2.0.0.html

Instantiate a new WMS layer by providing the service base URL and a configuration object containing required layers and format settings.

```javascript
const nexrad = new TileLayer.wms("http://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi", {
    layers: 'nexrad-n0r-900913',
    format: 'image/png',
    transparent: true,
    attribution: "Weather data © 2012 IEM Nexrad"
});
```

--------------------------------

### new Tooltip(options?, source?)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a Tooltip object with optional configuration and a reference to a source layer.

```APIDOC
## new Tooltip(options?, source?)

### Description
Instantiates a `Tooltip` object given an optional `options` object that describes its appearance and location and an optional `source` object that is used to tag the tooltip with a reference to the Layer to which it refers.

### Parameters
- **options** (Tooltip options) - Optional - Object describing appearance and location.
- **source** (Layer) - Optional - The layer to which the tooltip refers.
```

--------------------------------

### new Control.Scale(options?)

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new scale control instance with optional configuration settings.

```APIDOC
## new Control.Scale(options?)

### Description
Creates a scale control with the given options.

### Parameters
#### Options
- **position** (String) - Optional - The position of the control (default: 'bottomleft'). Possible values: 'topleft', 'topright', 'bottomleft', 'bottomright'.
- **maxWidth** (Number) - Optional - Maximum width of the control in pixels (default: 100).
- **metric** (Boolean) - Optional - Whether to show the metric scale line (default: True).
- **imperial** (Boolean) - Optional - Whether to show the imperial scale line (default: True).
- **updateWhenIdle** (Boolean) - Optional - If true, the control is updated on 'moveend', otherwise it's always up-to-date (default: false).
```

--------------------------------

### new Popup(latlng, options?)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a Popup object given latlng where the popup will open and an optional options object that describes its appearance and location.

```APIDOC
## new Popup(latlng, options?)

### Description
Instantiates a Popup object given latlng where the popup will open and an optional options object that describes its appearance and location.

### Parameters
- **latlng** (LatLng) - Required - The location where the popup will open.
- **options** (Popup options) - Optional - Object describing appearance and location.
```

--------------------------------

### Instantiate and Add ImageOverlay

Source: https://leafletjs.com/reference-2.0.0.html

Creates an image overlay using a URL and geographical bounds, then adds it to the map instance.

```javascript
const imageUrl = 'https://maps.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
    imageBounds = [[40.712216, -74.22655], [40.773941, -74.12544]];
new ImageOverlay(imageUrl, imageBounds).addTo(map);
```

--------------------------------

### new Icon(options)

Source: https://leafletjs.com/reference-2.0.0.html

Creates an icon instance with the given options to be used with markers.

```APIDOC
## new Icon(options)

### Description
Creates an icon instance with the given options.

### Parameters
#### Options
- **iconUrl** (String) - Required - The URL to the icon image.
- **iconRetinaUrl** (String) - Optional - The URL to a retina sized version of the icon image.
- **iconSize** (Point) - Optional - Size of the icon image in pixels.
- **iconAnchor** (Point) - Optional - The coordinates of the "tip" of the icon.
- **popupAnchor** (Point) - Optional - The coordinates of the point from which popups will open.
- **tooltipAnchor** (Point) - Optional - The coordinates of the point from which tooltips will open.
- **shadowUrl** (String) - Optional - The URL to the icon shadow image.
- **shadowRetinaUrl** (String) - Optional - The URL to the shadow retina image.
- **shadowSize** (Point) - Optional - Size of the shadow image in pixels.
- **shadowAnchor** (Point) - Optional - The coordinates of the "tip" of the shadow.
- **className** (String) - Optional - A custom class name to assign to both icon and shadow images.
- **crossOrigin** (Boolean|String) - Optional - Whether the crossOrigin attribute will be added to the tiles.
```

--------------------------------

### new Popup(options?, source?)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a Popup object given an optional options object that describes its appearance and location and an optional source object that is used to tag the popup with a reference to the Layer to which it refers.

```APIDOC
## new Popup(options?, source?)

### Description
Instantiates a Popup object given an optional options object that describes its appearance and location and an optional source object that is used to tag the popup with a reference to the Layer to which it refers.

### Parameters
- **options** (Popup options) - Optional - Object describing appearance and location.
- **source** (Layer) - Optional - Layer to which the popup refers.
```

--------------------------------

### new TileLayer.WMS(baseUrl, options)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new WMS tile layer object using the specified base URL and configuration options.

```APIDOC
## new TileLayer.WMS(baseUrl, options)

### Description
Instantiates a WMS tile layer object given a base URL of the WMS service and a WMS parameters/options object.

### Constructor
`new TileLayer.WMS(<String> baseUrl, <TileLayer.WMS options> options)`

### Options
- **layers** (String) - Required - Comma-separated list of WMS layers to show.
- **styles** (String) - Optional - Comma-separated list of WMS styles.
- **format** (String) - Optional - WMS image format (default: 'image/jpeg').
- **transparent** (Boolean) - Optional - If true, the WMS service will return images with transparency (default: false).
- **version** (String) - Optional - Version of the WMS service to use (default: '1.1.1').
- **crs** (CRS) - Optional - Coordinate Reference System to use for the WMS requests.
- **uppercase** (Boolean) - Optional - If true, WMS request parameter keys will be uppercase (default: false).

### Usage Example
```javascript
const nexrad = new TileLayer.wms("http://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi", {
    layers: 'nexrad-n0r-900913',
    format: 'image/png',
    transparent: true,
    attribution: "Weather data © 2012 IEM Nexrad"
});
```
```

--------------------------------

### Create and use a custom Icon

Source: https://leafletjs.com/reference-2.0.0.html

Instantiate an Icon with specific configuration options and apply it to a Marker.

```javascript
const myIcon = new Icon({
    iconUrl: 'my-icon.png',
    iconSize: [38, 95],
    iconAnchor: [22, 94],
    popupAnchor: [-3, -76],
    shadowUrl: 'my-icon-shadow.png',
    shadowSize: [68, 95],
    shadowAnchor: [22, 94]
});

new Marker([50.505, 30.57], {icon: myIcon}).addTo(map);
```

--------------------------------

### enable()

Source: https://leafletjs.com/reference-2.0.0.html

Enables the dragging ability for the instance.

```APIDOC
## enable()

### Description
Enables the dragging ability for the associated DOM element.
```

--------------------------------

### create(name)

Source: https://leafletjs.com/reference-2.0.0.html

Returns an instance of SVGElement corresponding to the class name passed.

```APIDOC
## create(name)

### Description
Returns an instance of SVGElement, corresponding to the class name passed. For example, using 'line' will return an instance of SVGLineElement.

### Parameters
- **name** (String) - Required - The SVG element tag name.
```

--------------------------------

### Map Options

Source: https://leafletjs.com/reference-2.0.0.html

Configuration options available when initializing a Map instance.

```APIDOC
## Map Options

### Description
Configuration settings that define the behavior and appearance of the map upon initialization.

### Options
- **preferCanvas** (Boolean) - Default: false - Whether Paths should be rendered on a Canvas renderer instead of SVG.
- **attributionControl** (Boolean) - Default: true - Whether an attribution control is added to the map by default.
- **zoomControl** (Boolean) - Default: true - Whether a zoom control is added to the map by default.
- **closePopupOnClick** (Boolean) - Default: true - Whether popups close when the user clicks the map.
- **boxZoom** (Boolean) - Default: true - Whether the map can be zoomed to a rectangular area via shift-drag.
- **doubleClickZoom** (Boolean|String) - Default: true - Whether the map zooms on double-click.
- **dragging** (Boolean) - Default: true - Whether the map is draggable.
- **zoomSnap** (Number) - Default: 1 - Forces the map's zoom level to be a multiple of this value.
- **zoomDelta** (Number) - Default: 1 - Controls the zoom level change increment.
- **trackResize** (Boolean) - Default: true - Whether the map automatically handles browser window resize.
```

--------------------------------

### new ImageOverlay(imageUrl, bounds, options)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates an image overlay object given the URL of the image and the geographical bounds it is tied to.

```APIDOC
## new ImageOverlay(imageUrl, bounds, options)

### Description
Instantiates an image overlay object given the URL of the image and the geographical bounds it is tied to.

### Parameters
- **imageUrl** (String) - Required - The URL of the image to display.
- **bounds** (LatLngBounds) - Required - The geographical bounds the image is tied to.
- **options** (ImageOverlay options) - Optional - Configuration options for the overlay.

### Options
- **opacity** (Number) - Default: 1.0 - The opacity of the image overlay.
- **alt** (String) - Default: '' - Text for the alt attribute of the image.
- **interactive** (Boolean) - Default: false - If true, the image overlay will emit pointer events.
- **crossOrigin** (Boolean|String) - Default: false - Whether the crossOrigin attribute will be added to the image.
- **errorOverlayUrl** (String) - Default: '' - URL to the overlay image to show if the primary image fails to load.
- **zIndex** (Number) - Default: 1 - The explicit zIndex of the overlay layer.
- **className** (String) - Default: '' - A custom class name to assign to the image.
- **decoding** (String) - Default: 'auto' - Tells the browser whether to decode the image in a synchronous fashion.
```

--------------------------------

### new Polyline(latlngs, options)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new Polyline object. The constructor accepts an array of LatLng points or an array of arrays for MultiPolyline shapes, along with an optional configuration object.

```APIDOC
## new Polyline(latlngs, options)

### Description
Instantiates a polyline object given an array of geographical points and optionally an options object. You can create a Polyline object with multiple separate lines (MultiPolyline) by passing an array of arrays of geographic points.

### Parameters
- **latlngs** (LatLng[]) - Required - An array of geographical points.
- **options** (Polyline options) - Optional - Configuration options for the polyline.

### Options
- **smoothFactor** (Number) - Optional - How much to simplify the polyline on each zoom level. Default: 1.0.
- **noClip** (Boolean) - Optional - Disable polyline clipping. Default: false.

### Inherited Options
- **stroke** (Boolean) - Optional - Whether to draw stroke along the path. Default: true.
- **color** (String) - Optional - Stroke color. Default: '#3388ff'.
- **weight** (Number) - Optional - Stroke width in pixels. Default: 3.
- **opacity** (Number) - Optional - Stroke opacity. Default: 1.0.
- **interactive** (Boolean) - Optional - If false, the layer will not emit pointer events. Default: true.
- **pane** (String) - Optional - Map pane where the layer is added. Default: 'overlayPane'.
```

--------------------------------

### Initialize and Add LayerGroup

Source: https://leafletjs.com/reference-2.0.0.html

Create a new LayerGroup with initial layers and add it to the map instance.

```javascript
new LayerGroup([marker1, marker2])
    .addLayer(polyline)
    .addTo(map);
```

--------------------------------

### new Tooltip(latlng, options?)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a standalone Tooltip at a specific geographic location.

```APIDOC
## new Tooltip(latlng, options?)

### Description
Instantiates a `Tooltip` object given `latlng` where the tooltip will open and an optional `options` object that describes its appearance and location.

### Parameters
- **latlng** (LatLng) - Required - The geographic location where the tooltip will open.
- **options** (Tooltip options) - Optional - Object describing appearance and location.
```

--------------------------------

### Initialize Bounds and Intersect with Array

Source: https://leafletjs.com/reference-2.0.0.html

Demonstrates creating a Bounds object from two points and passing bounds as an array to a method.

```javascript
const p1 = new Point(10, 10),
p2 = new Point(40, 60),
bounds = new Bounds(p1, p2);
```

```javascript
otherBounds.intersects([[10, 10], [40, 60]]);
```

--------------------------------

### Initialize a Marker

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new marker at the specified coordinates and adds it to the map instance.

```javascript
new Marker([50.5, 30.5]).addTo(map);
```

--------------------------------

### new SVG(options?)

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new instance of the SVG renderer with optional configuration.

```APIDOC
## new SVG(options?)

### Description
Creates a SVG renderer with the given options.

### Constructor
`new SVG(<Renderer options> options?)`

### Options
- **padding** (Number) - Optional - How much to extend the clip area around the map view (relative to its size). Default: 0.1.
- **continuous** (Boolean) - Optional - When false, the blanket updates only when the map state settles. When true, it updates during animations. Default: false.
- **pane** (String) - Optional - The map pane where the layer is added. Default: 'overlayPane'.
- **attribution** (String) - Optional - String to be shown in the attribution control.
```

--------------------------------

### Initialize Control.Layers

Source: https://leafletjs.com/reference-2.0.0.html

Create and add a layers control to a map using base layers and overlays.

```javascript
const baseLayers = {
    "Mapbox": mapbox,
    "OpenStreetMap": osm
};

const overlays = {
    "Marker": marker,
    "Roads": roadsLayer
};

new Control.Layers(baseLayers, overlays).addTo(map);
```

--------------------------------

### Perform Affine Transformations with Transformation

Source: https://leafletjs.com/reference-2.0.0.html

Demonstrates creating a transformation object and applying forward and reverse coordinate transformations.

```javascript
const transformation = new Transformation(2, 5, -1, 10),
    p = new Point(1, 2),
    p2 = transformation.transform(p), //  new Point(7, 8)
    p3 = transformation.untransform(p2); //  new Point(1, 2)
```

--------------------------------

### Initialize a Point object

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new Point instance with specified x and y pixel coordinates.

```javascript
const point = new Point(200, 300);
```

--------------------------------

### bindTooltip(content, options?)

Source: https://leafletjs.com/reference-2.0.0.html

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners.

```APIDOC
## bindTooltip(content, options?)

### Description
Binds a tooltip to the layer with the passed content and sets up the necessary event listeners.

### Parameters
- **content** (String|HTMLElement|Function|Tooltip) - Required - The content to display in the tooltip.
- **options** (Tooltip options) - Optional - Configuration options for the tooltip.

### Returns
- **this** (Layer) - The layer instance.
```

--------------------------------

### new DivIcon(options)

Source: https://leafletjs.com/reference-2.0.0.html

Creates a DivIcon instance which uses a simple div element instead of an image.

```APIDOC
## new DivIcon(options)

### Description
Creates a DivIcon instance for markers that uses a simple <div> element instead of an image.

### Parameters
#### Options
- **html** (String|HTMLElement) - Optional - Custom HTML code to put inside the div element.
- **bgPos** (Point) - Optional - Optional relative position of the background, in pixels.
- **className** (String) - Optional - A custom class name to assign to the icon.
```

--------------------------------

### bringToFront

Source: https://leafletjs.com/reference-2.0.0.html

Brings the layer to the top.

```APIDOC
## bringToFront()

### Description
Brings the layer to the top of all path layers.
```

--------------------------------

### bringToFront()

Source: https://leafletjs.com/reference-2.0.0.html

Brings the tile layer to the top of all tile layers.

```APIDOC
## bringToFront()

### Description
Brings the tile layer to the top of all tile layers.

### Returns
- **this** (TileLayer) - Returns the instance of the layer.
```

--------------------------------

### bringToFront()

Source: https://leafletjs.com/reference-2.0.0.html

Brings the tile layer to the top of all tile layers.

```APIDOC
## bringToFront()

### Description
Brings the tile layer to the top of all tile layers.

### Returns
- **this** (Layer) - The layer instance.
```

--------------------------------

### bringToFront()

Source: https://leafletjs.com/reference-2.0.0.html

Brings the layer to the top of all overlays.

```APIDOC
### bringToFront()

Brings the layer to the top of all overlays.

**Returns:** `this`
```

--------------------------------

### bringToFront()

Source: https://leafletjs.com/reference-2.0.0.html

Brings the layer to the top of all overlays.

```APIDOC
## bringToFront()

### Description
Brings the layer to the top of all overlays.

### Returns
- **this**
```

--------------------------------

### bringToFront()

Source: https://leafletjs.com/reference-2.0.0.html

Brings this overlay in front of other overlays in the same map pane.

```APIDOC
### bringToFront()

Returns: `this`
```

--------------------------------

### new PosAnimation()

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new instance of the PosAnimation class.

```APIDOC
## new PosAnimation()

### Description
Creates a `PosAnimation` object used for animating element positions.

### Constructor
`new PosAnimation()`
```

--------------------------------

### new Canvas(options?)

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new instance of the Canvas renderer. You can optionally provide an options object to configure the renderer's behavior.

```APIDOC
## new Canvas(options?)

### Description
Creates a Canvas renderer with the given options.

### Parameters
#### Options
- **tolerance** (Number) - Optional - How much to extend the click tolerance around a path/object on the map. Default: 0
- **padding** (Number) - Optional - How much to extend the clip area around the map view. Default: 0.1
- **continuous** (Boolean) - Optional - When true, updates during pan/zoom animations. Default: false
- **pane** (String) - Optional - The map pane where the layer is added. Default: 'overlayPane'
- **attribution** (String) - Optional - String to be shown in the attribution control.
```

--------------------------------

### Binding and Managing Popups

Source: https://leafletjs.com/reference-2.0.0.html

Shows how to bind a popup to a layer and programmatically open or close it.

```javascript
const layer = new Polygon(latlngs).bindPopup('Hi There!').addTo(map);
layer.openPopup();
layer.closePopup();
```

--------------------------------

### Initialize and Enable Draggable

Source: https://leafletjs.com/reference-2.0.0.html

Create a new Draggable instance for a specific element and activate its dragging capability.

```javascript
const draggable = new Draggable(elementToDrag);
draggable.enable();
```

--------------------------------

### new SVGOverlay(svg, bounds, options?)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates an SVGOverlay object. The SVG element must have a viewBox attribute defined for proper scaling.

```APIDOC
## new SVGOverlay(svg, bounds, options?)

### Description
Instantiates an image overlay object given an SVG element and the geographical bounds it is tied to. A viewBox attribute is required on the SVG element to zoom in and out properly.

### Parameters
- **svg** (String|SVGElement) - Required - The SVG element or string to display.
- **bounds** (LatLngBounds) - Required - The geographical bounds the SVG is tied to.
- **options** (SVGOverlay options) - Optional - Configuration options for the overlay.

### Options
- **opacity** (Number) - Default: 1.0 - The opacity of the image overlay.
- **alt** (String) - Default: '' - Text for the alt attribute of the image.
- **interactive** (Boolean) - Default: false - If true, the image overlay will emit pointer events.
- **crossOrigin** (Boolean|String) - Default: false - Whether the crossOrigin attribute will be added to the image.
- **errorOverlayUrl** (String) - Default: '' - URL to the overlay image to show if the primary fails to load.
- **zIndex** (Number) - Default: 1 - The explicit zIndex of the overlay layer.
- **className** (String) - Default: '' - A custom class name to assign to the image.
- **decoding** (String) - Default: 'auto' - Tells the browser whether to decode the image in a synchronous fashion.
- **bubblingPointerEvents** (Boolean) - Default: true - When true, a pointer event on this layer will trigger the same event on the map.
- **pane** (String) - Default: 'overlayPane' - The map pane where the layer will be added.
- **attribution** (String) - Default: null - String to be shown in the attribution control.
```

--------------------------------

### Instantiate LatLngBounds

Source: https://leafletjs.com/reference-2.0.0.html

Create a rectangular area using two LatLng corners.

```javascript
const corner1 = new LatLng(40.712, -74.227),
corner2 = new LatLng(40.774, -74.125),
bounds = new LatLngBounds(corner1, corner2);
```

--------------------------------

### Create a simple polygon

Source: https://leafletjs.com/reference-2.0.0.html

Initializes a red polygon from an array of LatLng points and fits the map view to its bounds.

```javascript
// create a red polygon from an array of LatLng points
const latlngs = [[37, -109.05],[41, -109.03],[41, -102.05],[37, -102.04]];

const polygon = new Polygon(latlngs, {color: 'red'}).addTo(map);

// zoom the map to the polygon
map.fitBounds(polygon.getBounds());
```

--------------------------------

### Use custom keys in URL template

Source: https://leafletjs.com/reference-2.0.0.html

Demonstrates using custom keys in the URL template that are evaluated from the TileLayer options object.

```javascript
new TileLayer('https://{s}.somedomain.com/{foo}/{z}/{x}/{y}.png', {foo: 'bar'});
```

--------------------------------

### Initialize GeoJSON Layer

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new GeoJSON layer with custom styling and popup binding.

```javascript
new GeoJSON(data, {
    style: function (feature) {
        return {color: feature.properties.color};
    }
}).bindPopup(function (layer) {
    return layer.feature.properties.description;
}).addTo(map);
```

--------------------------------

### isOpen()

Source: https://leafletjs.com/reference-2.0.0.html

Returns true when the overlay is visible on the map.

```APIDOC
### isOpen()

Returns: `Boolean`
```

--------------------------------

### new Marker(latlng, options?)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new Marker object at the specified geographical location with optional configuration settings.

```APIDOC
## new Marker(<LatLng> latlng, <Marker options> options?)

### Description
Instantiates a Marker object given a geographical point and optionally an options object.

### Options
- **icon** (Icon) - Optional - Icon instance to use for rendering the marker. If not specified, a common instance of Icon.Default is used.
- **keyboard** (Boolean) - Optional - Whether the marker can be tabbed to with a keyboard and clicked by pressing enter. Default is true.
- **title** (String) - Optional - Text for the browser tooltip that appear on marker hover. Useful for accessibility.
- **alt** (String) - Optional - Text for the alt attribute of the icon image. Default is 'Marker'.

### Usage Example
```javascript
new Marker([50.5, 30.5]).addTo(map);
```
```

--------------------------------

### new Polygon(latlngs, options)

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new Polygon object with the specified LatLng points and optional configuration.

```APIDOC
## new Polygon(latlngs, options)

### Description
Instantiates a new Polygon object. The `latlngs` parameter can be an array of LatLng points, an array of arrays (for holes), or a multi-dimensional array (for MultiPolygon).

### Constructor
`new Polygon(<LatLng[]> latlngs, <Polyline options> options?)`

### Parameters
- **latlngs** (LatLng[] | LatLng[][] | LatLng[][][]) - Required - Array of points defining the polygon shape.
- **options** (Polyline options) - Optional - Configuration options for the polygon appearance and behavior.
```

--------------------------------

### new Circle(latlng, options)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new Circle object on the map.

```APIDOC
## new Circle(latlng, options)

### Description
Instantiates a circle object given a geographical point and an options object which contains the circle radius.

### Parameters
- **latlng** (LatLng) - Required - The geographical point for the center of the circle.
- **options** (Circle options) - Optional - An object containing configuration options like radius.

### Options
- **radius** (Number) - Required - Radius of the circle, in meters.
- **stroke** (Boolean) - Optional - Whether to draw stroke along the path.
- **color** (String) - Optional - Stroke color.
- **weight** (Number) - Optional - Stroke width in pixels.
- **opacity** (Number) - Optional - Stroke opacity.
- **fill** (Boolean) - Optional - Whether to fill the path with color.
- **fillColor** (String) - Optional - Fill color.
- **fillOpacity** (Number) - Optional - Fill opacity.
- **interactive** (Boolean) - Optional - If false, the layer will not emit pointer events.
- **pane** (String) - Optional - Map pane where the layer is added.
```

--------------------------------

### Define and instantiate a Leaflet class

Source: https://leafletjs.com/reference-2.0.0.html

Create a new class using Class.extend and instantiate it with the new keyword.

```javascript
const MyClass = Class.extend({
    initialize(greeter) {
        this.greeter = greeter;
        // class constructor
    },

    greet(name) {
        alert(this.greeter + ', ' + name)
    }
});

// create instance of MyClass, passing "Hello" to the constructor
const a = new MyClass("Hello");

// call greet method, alerting "Hello, World"
a.greet("World");
```

--------------------------------

### new TileLayer(urlTemplate, options?)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new TileLayer object to display map tiles. The URL template supports placeholders for subdomains, zoom levels, tile coordinates, and custom options.

```APIDOC
## new TileLayer(urlTemplate, options?)

### Description
Instantiates a tile layer object given a URL template and optionally an options object. This layer is used to load and display tile layers on the map.

### Constructor
`new TileLayer(<String> urlTemplate, <TileLayer options> options?)`

### URL Template
A string of the form: `'https://{s}.somedomain.com/blabla/{z}/{x}/{y}{r}.png'`
- `{s}`: Subdomain (a, b, or c by default).
- `{z}`: Zoom level.
- `{x}`, `{y}`: Tile coordinates.
- `{r}`: Optional '@2x' for retina tiles.
- Custom keys: Can be used in the template and evaluated from the provided options object.

### Usage Example
```javascript
new TileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {
  foo: 'bar', 
  attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
```
```

--------------------------------

### bindPopup(content, options?)

Source: https://leafletjs.com/reference-2.0.0.html

Binds a popup to the layer with the passed content and sets up the necessary event listeners.

```APIDOC
## bindPopup(content, options?)

### Description
Binds a popup to the layer with the passed content and sets up the necessary event listeners.

### Parameters
- **content** (String|HTMLElement|Function|Popup) - Required - The content to display in the popup.
- **options** (Popup options) - Optional - Configuration options for the popup.

### Returns
- **this** (Layer) - The layer instance.
```

--------------------------------

### openTooltip

Source: https://leafletjs.com/reference-2.0.0.html

Opens the bound tooltip at the specified latlng or at the default tooltip anchor.

```APIDOC
## openTooltip(latlng?)

### Description
Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

### Parameters
- **latlng** (LatLng) - Optional - The location to open the tooltip.
```

--------------------------------

### openTooltip

Source: https://leafletjs.com/reference-2.0.0.html

Opens the bound tooltip at the specified latlng or at the default tooltip anchor.

```APIDOC
## openTooltip(latlng?)

### Description
Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

### Parameters
- **latlng** (LatLng) - Optional - The geographic location to open the tooltip.
```

--------------------------------

### Create Standalone Tooltip

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a standalone tooltip using the constructor or fluent API methods.

```javascript
const tooltip = new Tooltip()
    .setLatLng(latlng)
    .setContent('Hello world!<br />This is a nice tooltip.')
    .addTo(map);
```

```javascript
const tooltip = new Tooltip(latlng, {content: 'Hello world!<br />This is a nice tooltip.'})
    .addTo(map);
```

--------------------------------

### Class.extend

Source: https://leafletjs.com/reference-2.0.0.html

Extends the current class with the provided properties. Returns a new class constructor.

```APIDOC
## Class.extend(<Object> _props_)

### Description
Extends the current class given the properties to be included. Returns a Javascript function that is a class constructor.

### Parameters
- **_props_** (Object) - Required - The properties and methods to include in the new class.
```

--------------------------------

### getContent()

Source: https://leafletjs.com/reference-2.0.0.html

Returns the content of the overlay.

```APIDOC
### getContent()

Returns: `String|HTMLElement|Function`
```

--------------------------------

### new Rectangle(latLngBounds, options)

Source: https://leafletjs.com/reference-2.0.0.html

Constructor for creating a new Rectangle instance on the map.

```APIDOC
## new Rectangle(latLngBounds, options)

### Description
Creates a new rectangle overlay defined by the provided geographical bounds and optional styling configurations.

### Parameters
- **latLngBounds** (LatLngBounds) - Required - The geographical bounds of the rectangle.
- **options** (Polyline options) - Optional - Configuration options for the rectangle, including stroke, fill, and rendering properties.
```

--------------------------------

### Initialize Canvas Renderer

Source: https://leafletjs.com/reference-2.0.0.html

Configure the map to use the Canvas renderer for all vector paths by default.

```javascript
const map = new Map('map', {
    renderer: new Canvas()
});
```

--------------------------------

### new CircleMarker(latlng, options)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new CircleMarker object at a specific geographical location with optional configuration.

```APIDOC
## new CircleMarker(latlng, options)

### Description
Instantiates a circle marker object given a geographical point and an optional options object.

### Parameters
- **latlng** (LatLng) - Required - The geographical point where the marker is placed.
- **options** (CircleMarker options) - Optional - Configuration object for the marker.

### Options
- **radius** (Number) - Default: 10 - Radius of the circle marker, in pixels.
- **stroke** (Boolean) - Default: true - Whether to draw stroke along the path.
- **color** (String) - Default: '#3388ff' - Stroke color.
- **weight** (Number) - Default: 3 - Stroke width in pixels.
- **opacity** (Number) - Default: 1.0 - Stroke opacity.
- **fill** (Boolean) - Default: depends - Whether to fill the path with color.
- **fillColor** (String) - Default: * - Fill color.
- **fillOpacity** (Number) - Default: 0.2 - Fill opacity.
- **interactive** (Boolean) - Default: true - If false, the layer will not emit pointer events.
```

--------------------------------

### new Map(id, options)

Source: https://leafletjs.com/reference-2.0.0.html

Instantiates a new map object by providing a DOM element ID or reference and an optional configuration object.

```APIDOC
## Constructor: new Map(id, options)

### Description
Instantiates a map object given the DOM ID of a `<div>` element or an instance of a `<div>` HTML element, and optionally an object literal with `Map options`.

### Parameters
- **id** (String|HTMLElement) - Required - The DOM ID or element instance where the map will be initialized.
- **options** (Map options) - Optional - An object literal containing map configuration settings.

### Usage Example
```javascript
const map = new Map('map', {
    center: [51.505, -0.09],
    zoom: 13
});
```
```

--------------------------------

### Manage class options

Source: https://leafletjs.com/reference-2.0.0.html

Use the options property for automatic merging of configuration values during inheritance or initialization.

```javascript
const MyClass = Class.extend({
    options: {
        myOption1: 'foo',
        myOption2: 'bar'
    }
});

const MyChildClass = MyClass.extend({
    options: {
        myOption1: 'baz',
        myOption3: 5
    }
});

const a = new MyChildClass();
a.options.myOption1; // 'baz'
a.options.myOption2; // 'bar'
a.options.myOption3; // 5
```

```javascript
const MyClass = Class.extend({
    options: {
        foo: 'bar',
        bla: 5
    },

    initialize(options) {
        Util.setOptions(this, options);
        ...
    }
});

const a = new MyClass({bla: 10});
a.options; // {foo: 'bar', bla: 10}
```

--------------------------------

### Create a custom GridLayer synchronously

Source: https://leafletjs.com/reference-2.0.0.html

Extend GridLayer and implement createTile to return a DOM element for a specific coordinate.

```javascript
class CanvasLayer extends GridLayer {
    createTile(coords) {
        // create a <canvas> element for drawing
        const tile = DomUtil.create('canvas', 'leaflet-tile');

        // setup tile width and height according to the options
        const size = this.getTileSize();
        tile.width = size.x;
        tile.height = size.y;

        // get a canvas context and draw something on it using coords.x, coords.y and coords.z
        const ctx = tile.getContext('2d');

        // return the tile so it can be rendered on screen
        return tile;
    }
}
```

--------------------------------

### new Control.Layers

Source: https://leafletjs.com/reference-2.0.0.html

Creates a layers control with the given base layers and overlays. Base layers are switched with radio buttons, while overlays are switched with checkboxes.

```APIDOC
## new Control.Layers(baseLayers, overlays, options)

### Description
Creates a layers control with the given layers. Base layers will be switched with radio buttons, while overlays will be switched with checkboxes.

### Parameters
- **baseLayers** (Object) - Optional - Object literal with layer names as keys and Layer objects as values.
- **overlays** (Object) - Optional - Object literal with layer names as keys and Layer objects as values.
- **options** (Control.Layers options) - Optional - Configuration options for the control.
```

--------------------------------

### Tooltip Methods

Source: https://leafletjs.com/reference-2.0.0.html

Methods for binding, opening, and managing tooltips associated with a layer.

```APIDOC
## bindTooltip(content, options?)

### Description
Binds a tooltip to the layer with the passed content and sets up the necessary event listeners.

## unbindTooltip()

### Description
Removes the tooltip previously bound with bindTooltip.

## openTooltip(latlng?)

### Description
Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

## closeTooltip()

### Description
Closes the tooltip bound to this layer if it is open.

## toggleTooltip()

### Description
Opens or closes the tooltip bound to this layer depending on its current state.

## isTooltipOpen()

### Description
Returns true if the tooltip bound to this layer is currently open.

## setTooltipContent(content)

### Description
Sets the content of the tooltip bound to this layer.

## getTooltip()

### Description
Returns the tooltip bound to this layer.
```

--------------------------------

### new Control.Zoom

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new zoom control instance with customizable buttons for zooming in and out.

```APIDOC
## new Control.Zoom(options)

### Description
Creates a zoom control with two buttons (zoom in and zoom out).

### Parameters
- **options** (Control.Zoom options) - Required - Configuration object for the zoom control.

### Options
- **position** (String) - Optional - The position of the control ('topleft', 'topright', 'bottomleft', 'bottomright').
- **zoomInText** (String) - Optional - The text set on the 'zoom in' button.
- **zoomInTitle** (String) - Optional - The title set on the 'zoom in' button.
- **zoomOutText** (String) - Optional - The text set on the 'zoom out' button.
- **zoomOutTitle** (String) - Optional - The title set on the 'zoom out' button.
```

--------------------------------

### Define a URL template

Source: https://leafletjs.com/reference-2.0.0.html

Standard format for tile layer URL templates including placeholders for subdomains, zoom, and coordinates.

```text
'https://{s}.somedomain.com/blabla/{z}/{x}/{y}{r}.png'
```

--------------------------------

### Class.include

Source: https://leafletjs.com/reference-2.0.0.html

Includes a mixin into the current class at runtime.

```APIDOC
## Class.include(<Object> _properties_)

### Description
Includes a mixin into the current class.

### Parameters
- **_properties_** (Object) - Required - The object containing properties and methods to mix into the class.
```

--------------------------------

### Initialize a Map

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new map instance within a specified DOM element with initial center coordinates and zoom level.

```javascript
// initialize the map on the "map" div with a given center and zoom
const map = new Map('map', {
    center: [51.505, -0.09],
    zoom: 13
});
```

--------------------------------

### Configure Canvas Renderer with Padding

Source: https://leafletjs.com/reference-2.0.0.html

Create a custom Canvas renderer instance with specific padding and assign it to individual vector geometries.

```javascript
const map = new Map('map');
const myRenderer = new Canvas({ padding: 0.5 });
const line = new Polyline( coordinates, { renderer: myRenderer } );
const circle =  new Circle( center, { renderer: myRenderer, radius: 100 } );
```

--------------------------------

### Point Constructor

Source: https://leafletjs.com/reference-2.0.0.html

Represents a point with x and y coordinates in pixels.

```APIDOC
## new Point(x, y)

### Description
Creates a Point object with the specified x and y coordinates.
```

--------------------------------

### new LayerGroup(layers, options)

Source: https://leafletjs.com/reference-2.0.0.html

Constructor to create a new LayerGroup instance, optionally initializing it with an array of layers and an options object.

```APIDOC
## new LayerGroup(<Layer[]> layers, <Object> options)

### Description
Creates a layer group, optionally given an initial set of layers and an options object.

### Parameters
- **layers** (Layer[]) - Optional - Initial set of layers to add to the group.
- **options** (Object) - Optional - Configuration options for the layer group.
```

--------------------------------

### new Control.Layers

Source: https://leafletjs.com/reference-2.0.0.html

Creates a layers control to allow users to switch between base layers and toggle overlays.

```APIDOC
## new Control.Layers(baseLayers, overlays)

### Description
The layers control gives users the ability to switch between different base layers and switch overlays on/off.

### Parameters
- **baseLayers** (Object) - Required - A dictionary of base layers.
- **overlays** (Object) - Required - A dictionary of overlay layers.
```

--------------------------------

### bringToFront

Source: https://leafletjs.com/reference-2.0.0.html

Brings the layer to the top of all path layers.

```APIDOC
## bringToFront()

### Description
Brings the layer to the top of all path layers.

### Returns
`this`
```

--------------------------------

### new Point(x, y, round?)

Source: https://leafletjs.com/reference-2.0.0.html

Creates a new Point object. Can be initialized with individual coordinates, an array, or an object.

```APIDOC
## new Point(x, y, round?)

### Description
Creates a Point object with the given x and y coordinates. If optional round is set to true, rounds the x and y values.

### Parameters
- **x** (Number) - Required - The x coordinate.
- **y** (Number) - Required - The y coordinate.
- **round** (Boolean) - Optional - Whether to round the coordinates.
```

--------------------------------

### Animate a marker position with PosAnimation

Source: https://leafletjs.com/reference-2.0.0.html

Demonstrates triggering a marker animation on click by calculating a new layer point and running the animation sequence.

```javascript
const myPositionMarker = new Marker([48.864716, 2.294694]).addTo(map);

myPositionMarker.on("click", function() {
    const pos = map.latLngToLayerPoint(myPositionMarker.getLatLng());
    pos.y -= 25;
    const fx = new PosAnimation();

    fx.once('end',function() {
        pos.y += 25;
        fx.run(myPositionMarker._icon, pos, 0.8);
    });

    fx.run(myPositionMarker._icon, pos, 0.3);
});
```
Tokens:
Raw