Legacy

Mapbox.js is no longer in active development. To learn more about our newer mapping tools see Mapbox GL JS.

You are viewing an older version of Mapbox.js. Check out v3.3.1 for the latest.

L.mapbox.featureLayer(id|url|geojson, options)

Extends: L.FeatureGroup

L.mapbox.featureLayer provides an easy way to integrate GeoJSON from Mapbox and elsewhere into your map.

Options Value Description
id or url or geojson string if id or url object if tilejson Must be either
  • An id string mapbox.streets
  • A URL to TileJSON, like https://api.mapbox.com/v3/mapbox.dark.json
  • A GeoJSON object, from your own Javascript code
  • null, if you wish to only provide options and not initial data.
options object If provided, it is the same options as provided to L.FeatureGroup, as well as:
  • filter: A function that accepts a feature object and returns true or false to indicate whether it should be displayed on the map. This can be changed later using setFilter.
  • sanitizer: A function that accepts a string containing tooltip data, and returns a sanitized result for HTML display. The default will remove dangerous script content, and is recommended.
  • accessToken: Mapbox API access token. Overrides L.mapbox.accessToken for this layer.
  • popupOptions: an object of options that will be passed to the bindPopup method internally.
  • pointToLayer: A function that accepts a feature object and a L.LatLng and returns a layer to be added. Defaults to L.mapbox.marker.style.

Example:

var featureLayer = L.mapbox.featureLayer(geojson)
    .addTo(map);

Returns a L.mapbox.featureLayer object.

Class: L.mapbox.FeatureLayer

featureLayer.loadURL(url)

Load GeoJSON data for this layer from the URL given by url.

Options Value Description
url string A tileset ID

Example:

var featureLayer = L.mapbox.featureLayer()
    .addTo(map);

featureLayer.loadURL('my_local_markers.geojson');

Returns: the layer object

featureLayer.loadID(id)

Load marker GeoJSON data from a map with the given id on Mapbox.

Options Value Description
url (required) string A tileset ID

Example:

var featureLayer = L.mapbox.featureLayer()
    .addTo(map);

// loads markers from the map `mapbox.dark` on Mapbox,
// if that map has markers
featureLayer.loadID('mapbox.dark');

Returns: the layer object

featureLayer.setFilter(filter)

Sets the filter function for this data layer.

Options Value Description
filter (required) function a function that takes GeoJSON features and returns true to show and false to hide features.

Example:

var featureLayer = L.mapbox.featureLayer(geojson)
    // hide all markers
    .setFilter(function() { return false; })
    .addTo(map);

See a live example of .setFilter

Returns the featureLayer object.

featureLayer.getFilter()

Gets the filter function for this data layer.

Example:

var featureLayer = L.mapbox.featureLayer(geojson)
    // hide all markers
    .setFilter(function() { return false; })
    .addTo(map);

// get the filter function
var fn = featureLayer.getFilter()

Returns the filter function.

featureLayer.setGeoJSON(geojson)

Set the contents of a markers layer: run the provided features through the filter function and then through the factory function to create elements for the map. If the layer already has features, they are replaced with the new features. An empty array will clear the layer of all features.

Options Value Description
geojson (required) object features, an array of GeoJSON feature objects, or omitted to get the current value.

Example:

var featureLayer = L.mapbox.featureLayer(geojson)
    .addTo(map);
// a simple GeoJSON featureset with a single point
// with no properties
featureLayer.setGeoJSON({
    type: "FeatureCollection",
    features: [{
        type: "Feature",
        geometry: {
            type: "Point",
            coordinates: [102.0, 0.5]
        },
        properties: { }
    }]
});

Returns the featureLayer object

featureLayer.getGeoJSON()

Get the contents of this layer as GeoJSON data.

Returns the GeoJSON represented by this layer