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

L.mapbox.gridControl(layer, options)

Extends: L.Control

Interaction is what we call interactive parts of maps that are created with the powerful tooltips & regions system in TileMill. Under the hood, it's powered by the open UTFGrid specification.

Options Value Description
layer L.mapbox.gridLayer The first argument must be a layer created with L.mapbox.gridLayer()
options object Valid options are:
  • sanitizer: A function that accepts a string containing interactivity data, and returns a sanitized result for HTML display. The default will remove dangerous script content, and is recommended.
  • template: A string in the Mustache template language that will be evaluated with data from the grid to produce HTML for the interaction.
  • follow: Whether the tooltip should follow the mouse in a constant relative position, or should be fixed in the top-right side of the map. By default, this is false and the tooltip is stationary.
  • pinnable: Whether clicking will 'pin' the tooltip open and expose a 'close' button for the user to close the tooltip. By default, this is true.
  • touchTeaser: On touch devices, show the teaser formatter if there is no output from the full formatter. By default, this is true.
  • location: Evaluate the location formatter on click events, and if it provides output, navigate to that location. By default, this is true.


var map ='map').setView([38, -77], 5);
var gridLayer = L.mapbox.gridLayer('');

Returns: a L.mapbox.gridControl object.

Class: L.mapbox.GridControl


If a tooltip is currently shown by the gridControl, hide and close it.

Returns: the L.mapbox.gridControl object.


Change the Mustache template used to transform the UTFGrid data in the map's interactivity into HTML for display.

Options Value Description
template string A string of Mustache template code for popups.

Returns: the L.mapbox.gridControl object.