Leaflet/features.html

---
layout: default
title: Features
---

<h3>Leaflet Features</h3>

<p>Leaflet doesn't try to do everything for everyone. Instead it focuses on making <em>the basic things work perfectly</em>. It should still satisfy the needs of the vast majority of map apps developers while being easily extended by third-party plugins.</p>

<hr />

<div class="span-20" id="features">
	<div class="span-6">

		<h3>Available Map Layers</h3>

		<ul>
			<li>Tile layers</li>
			<li>Vector layers: polylines, polygons, circles, rectangles, circle markers</li>
			<li>Markers</li>
			<li>Popups</li>
			<li>Image overlays</li>
			<li>WMS layers</li>
			<li>GeoJSON</li>
		</ul>


		<h3>Interaction Features</h3>

		<h4>On Desktop Browsers</h4>

		<ul>
			<li>Drag panning</li>
			<li>Scroll wheel zoom</li>
			<li>Double click zoom</li>
			<li>Shift-drag zoom to bounding box</li>
		</ul>


		<h4>On Mobile Browsers (iOS, Android)</h4>

		<ul>
			<li>Touch-drag panning</li>
			<li>Multi-touch zoom <nobr>(iOS and Android 4+)</nobr></li>
			<li>Double tap zoom</li>
		</ul>


		<h4>Other Features</h4>

		<ul>
			<li>Panning inertia</li>
			<!--<li>Vector layers editing</li>-->
		</ul>
	</div>

	<div class="span-9">

		<h3>Visual Features</h3>

		<ul>
			<li>Panning animation</li>
			<li>Zooming animation on modern browsers <span class="quiet">(except IE)</span></li>
			<li>Smooth continuous zoom on iOS</li>
			<li>Tile and popup fade animation</li>
			<li>Very nice default design for markers, popups and other map controls</li>
		</ul>


		<h3>Customization Features</h3>

		<ul>
			<li>Pure CSS3 popups and controls <span class="quiet">for easy restyling</span></li>
			<!-- <li>Customizable marker icons</li> -->
			<li><span class="quiet">A simple interface for implementing</span> custom map layers</li>
			<li><span class="quiet">The same for</span> custom map controls</li>
			<li>Custom map projections <span class="quiet">(with <code>EPSG:4326</code>, <code>EPSG:3857</code> and <code>EPSG:3395</code> out of the box)</span></li>
		</ul>

		<h3>Performance Features</h3>

		<ul>
			<li>Hardware acceleration on iOS <span class="quiet">(and other modern browsers) makes it feel as smooth as native apps</span></li>
			<li><span class="quiet">Clever tricks to make</span> panning and zooming really smooth</li>
			<li>Smart polyline/polygon rendering <span class="quiet">makes it responsive even when displaying objects with thousands of points</span></li>
			<li>Modular design and a build system<span class="quiet"> allow you to reduce the size of the library by leaving out the code you don't need</span></li>
		</ul>

	</div>

	<div class="span-5 last">

		<h3>Map Controls</h3>

		<ul>
			<li>Zoom buttons</li>
			<li>Attribution</li>
			<li>Layer switcher</li>
			<li>Scale</li>
		</ul>


		<h3>Browser Support</h3>

		<h4>On Desktop</h4>

		<ul>
			<li>Chrome</li>
			<li>Firefox</li>
			<li>Safari 5+</li>
			<li>Opera 11.11+</li>
 			<li>IE 7&ndash;9</li>
			<li>IE 6 <span class="quiet">(not perfect but accessible)</span></li>
 		</ul>

		<h4>On Mobile</h4>

 		<ul>
 			<li>Safari for iOS 3/4/5+</li>
			<li>Android browser 2.2+,&nbsp;3.1+,&nbsp;4+</li>
			<li>Chrome for Android 4+ and iOS</li>
			<li>Firefox for Android</li>
			<li>Other webkit-based browsers (webOS, Blackberry 6+, etc.)</li>
			<li class="noimpl">IE for Windows Phone 7</li>
		</ul>
	</div>
</div>

<hr />

<p>If you find some feature really missing in Leaflet, please vote for it on the <a href="https://leaflet.uservoice.com">Leaflet UserVoice page</a>.</p>