Chapter 1. Creating Maps with Leaflet

Web-based mapping has evolved rapidly over the last two decades, from MapQuest and Google to real-time location information on our phones' mapping apps. There have been open source projects to develop web-based maps in the past, such as MapServer, GeoServer, and OpenLayers. However, Environmental Systems Research Institute (ESRI) includes the Flex and Silverlight APIs; these create web-based maps from their ArcServer services.

Over the last few years, JavaScript has taken the online mapping world by storm. In 2013, there was a JS.geo conference. The library at the center of attention was Leaflet. This is a JavaScript library used to create interactive, web-based maps. With it, you can create a simple map in as little as three lines of JavaScript, or you can create complex, interactive, editable maps with hundreds of lines of code.

Note

You can find more information on Leaflet at http://leafletjs.com.

This book assumes that you have a basic understanding of HTML and CSS, primarily of how to link external .js and .css files and how to name and size a <div> element. It also assumes that you have a working knowledge of JavaScript.

In this chapter, we will cover the following topics:

• Tile layers
• Vector layers
• Pop ups
• Custom functions / Responding to events
• Mobile mapping