https://github.com/glowiep/leaflet-map-template

Repository template for the initial setup of a Leaflet web map.
https://github.com/glowiep/leaflet-map-template

Last synced: about 1 month ago
JSON representation

Repository template for the initial setup of a Leaflet web map.

• Host: GitHub
• URL: https://github.com/glowiep/leaflet-map-template
• Owner: glowiep
• Created: 2024-01-23T01:31:15.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-01-25T05:47:49.000Z (over 1 year ago)
• Last Synced: 2025-02-11T12:30:41.474Z (3 months ago)
• Language: HTML
• Homepage:
• Size: 646 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 🍃Leaflet Map Templates

This repository template for Leaflet web maps will help you start a new leaflet map project quickly.

## 🏆 Goals

- The purpose of this repository is so that the initial setup for a Leaflet map is quick and easy. (My goal was to be able to quickly set up new Leaflet web map projects with the setup I had used in previous projects.)

- Explore various Leaflet map options and variations in different branches.

- This is great for any beginners that want to explore the use of JavaScript Leaflet library.

## ✨ Getting Started

1. On the main page of this repository, click Use this template


![Use this template button](docs/use-this-template.png)

2. Select Create a new repository.

3. Use the Owner dropdown menu to select the account you want to own the repository.

4. Enter a name for your repository.

5. To include the directory structure and files from all branches in the template, and not just the default branch, select Include all branches.

6. Give this repo a ⭐ if you like it!

## 📌 Options

1. Basic Map - [Main Branch (Default)](#main-branch-default)

3. Map with some useful plugins - [Version 1](#version-1)

### Main Branch (Default)

- Basic Leaflet map with zoom buttons and a scale bar.

- Centered with a global map view.

- Additional settings are added to prevent scrolling off the map, and map bounds are set to give it a bounce-back effect.

![Main branch - simple Leflet map template](docs/main-map-template.png)

### Version 1

This branch includes some of my favorite plugins. The Leaflet-Geoman drawing toolbar is a powerful leaflet plugin for drawing and editing geometry layers.

- Leaflet-Geoman Drawing Toolbar

- Full-screen button

- Includes leaflet.WorldMiniMap Plugin

![Main branch - simple Leflet map template](docs/version-1.png)

## 🔧 Dependencies

- JQuery 3.7.1 - A JavaScript library used to simplify the client-side scripting of HTML.

- Leaflet Library - Open-source JavaScript library for interactive maps.

- leaflet.WorldMiniMap - Leaflet plugin that adds a small world-map-image, in which the actual view of the Leaflet Map is shown.

- Leaflet-Geoman Drawing Toolbar - The most powerful leaflet plugin for drawing and editing geometry layers.

- Leaflet.fullscreen - A HTML5 fullscreen plugin for Leaflet.