Book Image

Leaflet.js Essentials

By : Paul Crickard III, Paul Crickard
Book Image

Leaflet.js Essentials

By: Paul Crickard III, Paul Crickard

Overview of this book

Table of Contents (13 chapters)
Leaflet.js Essentials
About the Author
About the Reviewers

Creating a custom marker

In Leaflet, a marker is made from two images: an image that represents the marker and a second image that serves as the shadow to create depth. When you download Leaflet, there is an images folder. This folder contains the default marker: the blue pin that you have seen in your maps and a small shadow image. The images are named marker-icon.png and marker-shadow.png. The default marker and shadow are shown in the following screenshots:

Preparing your workspace in GIMP

To create your own custom marker, you will need to draw an image in a painting application. In this example, you will use the free GNU Image Manipulation Program (GIMP). GIMP is a powerful imaging program that is similar to Adobe Photoshop which runs on most operating systems and is completely free. To download GIMP, go to and click on Download GIMP 2.8.10.


You do not need to select a 32- or 64-bit version. GIMP includes both and will determine the appropriate version...