Webmapping with Code
Leaflet is a set of instructions that your web browser or mobile device uses to display maps and let you interact with them. For example, when you double click your mouse on a map, leaflet tells your browser to zoom in. Leaflet defines the style of your map and includes things like zoom controls, attribution links, pop-ups, colors for markers and more. Leaflet is made up of only 38kb of Javascript, so it is really fast and lightweight - meaning browsers don’t have to work very hard to load it. Leaflet is open source, free, and hugely customizable. And, because of this, Leaflet is widely used. There are lots of alternatives to Leaflet, but most require an API key to use.
As code
Leaflet consists of JavaScript and CSS code libraries which power the ways your web browser interprets and interacts with geospatial data & displays colors and style. For instance, when you double click a map to zoom in, Leaflet is at work. When you add data to your map, Leaflet assigns it a default color. And because Leaflet is open-source, the code is hugely customizable and extensible. This means you can re-mix the code all you want — which you will do in this workshop. Here are some examples of Leaflet-based plugins to give you some idea of the variety of added functionality that comes from the community of developers.
In a browser
Take a look at this basic Leaflet map example. You can zoom in, pan around, etc. It’s meant to be displayed in your internet browser or a mobile application, so it loads and responds to you quickly.
Leaflet Advantages ⇡
- Leaflet is free and open-source. For this reason, Leaflet is widely used.
- As an open-source code library, Leaflet is hugely customizable. This means you can re-mix the code all you want.
- Leaflet is beginner friendly, though you do need to interact with code in order to build your map.
- Hugely customizable. Leaflet-based plugins to give you some idea of the variety of added functionality that comes from the community of developers.
Leaflet Disadvantages ⇣
- You’ll need to work with code in a code editor. This can introduce a semi-steep learning curve, but you can truly create a basic webmap in a few hours with no prior knowledge.
- You’ll need a place to store your map and map data. Github can work. Think about how you’ll be displaying your end product. Will it be embedded on a website?
Table of contents
Loading last updated date...