Map Controls

At a minimum, a map should have the following controls or features.

Icon Feature Position on Map
+ -
Zoom top left above layers control
Layers

Maps should have 3 base layers:

  • street (default)
  • satellite
  • terrain
top left below zoom control
10 km
5 mi
Scale bottom right corner above attribution
  Attribution

Include the map name in the attribution after the organization name (FCC).

Example

Example attribution
bottom right corner below scale
Example & Code
<div id="map-container"></div>
#map-container { 
  height: 400px; 
  width:100%; 
}
/* Add zoom control */
L.control.zoom({
    position: 'topleft'
});

/* Define base layers */
var baseStreet = L.mapbox.tileLayer(streetLayerURL),
    baseSatellite = L.mapbox.tileLayer(satelliteLayerURL),
    baseTerrain = L.mapbox.tileLayer(terrainLayerURL),

/* Add layers toggle button and layer switch */
L.control.layers({
        'Street': baseStreet,
        'Satellite': baseSatellite,
        'Terrain': baseTerrain
    }, 
    null, 
    {
        position: 'topleft'
    }
).addTo(map);

/* Add scale */
L.control.scale({
    position: 'bottomright'
}).addTo(map);

/* Add attribution */
map.attributionControl.addAttribution('FCC [Name of Map]');