https://github.com/doersino/leaflet-zoom2markers

Basic Leaflet control that zooms the map to show all markers.
https://github.com/doersino/leaflet-zoom2markers

leaflet-markers leaflet-plugin leafletjs

Last synced: 7 months ago
JSON representation

Basic Leaflet control that zooms the map to show all markers.

• Host: GitHub
• URL: https://github.com/doersino/leaflet-zoom2markers
• Owner: doersino
• License: mit
• Created: 2024-07-20T09:38:46.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2025-02-14T19:25:02.000Z (8 months ago)
• Last Synced: 2025-02-27T17:28:57.053Z (7 months ago)
• Topics: leaflet-markers, leaflet-plugin, leafletjs
• Language: JavaScript
• Homepage:
• Size: 481 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Leaflet.Control.Zoom2Markers

A basic [Leaflet](https://leafletjs.com) control that, when clicked, zooms the map to show all markers.

In lieu of a demo (because this plugin is so dead simple), here's a screenshot – it's the bottom-most button.

![](screenshot.jpg)

## Setup

Download or clone this repository, then reference the JavaScript code and stylesheet in your HTML:

```html

```

## Usage

After initializing your map:

```js

L.control.zoom2markers({

    position: 'topleft',

    title: 'Zoom to Markers',

    maxZoom: null,  // maximum zoom level, set to 17 or 18 to avoid going in too close when there's only one marker

    forceSeparateButton: false,  // separate from +/- zoom controls?

}).addTo(map);

```

(These are the default options, you can omit them unless you're going to assign different values.)

You can additionally specify [any options accepted by Leaflet's `fitBounds` function](https://leafletjs.com/reference.html#fitbounds-options) which will be passed straight along when that function is called on interaction with the control (the `maxZoom` option is, in fact, one such option).

You can exclude markers from consideration by setting `zoom2MarkersExclude: true` in *their* options; the zoom action will then ignore them.

## Notes

Not tested for "interactions" with other extensions. (This one just scoops up all layers of type `L.Marker` into a `FeatureGroup`, then `fitBounds` the map to that group's `getBounds()`.)

## Acknowledgements

The icon is MIT Licensed and © [Etn Ccis](https://github.com/etn-ccis/blui-icons?ref=svgrepo.com).

The code is based on [Bruno Bergot's "leaflet.fullscreen" extension](https://github.com/brunob/leaflet.fullscreen).