MapQuest.js

L.mapquest.locatorControl(options)

A single button control that locates the user on the map when clicked. The control then places an icon on their current location and zooms into that location. The marker color, zoom level, control position, and other properties of the control are customizable.

Syntax

L.mapquest.key = 'KEY';

var map = L.mapquest.map('map', {
  center: [39.7392,-104.9903],
  layers: L.mapquest.tileLayer('map'),
  zoom: 12
});

map.addControl(L.mapquest.locatorControl());

Parameters

  • options object

    An object containing any of the following key value options: position, zoom, defaultLocation, title, className, markerPrimaryColor, markerSecondaryColor.

    • className String optional

      A custom CSS class name to assign to the control.

    • defaultLocation Position Object optional

      Set a default location for the control to locate. Requires a position object.

    • enableHighAccuracy boolean optional, defaults to true

      Indicates the application would like to receive the best possible results. If true and if the device is able to provide a more accurate position, it will do so. Note that this can result in slower response times or increased power consumption (with a GPS chip on a mobile device for example). On the other hand, if false, the device can take the liberty to save resources by responding more quickly and/or using less power.

    • markerPrimaryColor String optional, defaults to '#333333'

      The primary color of the via marker added to the map.

    • markerSecondaryColor String optional, defaults to '#b7b7b7'

      The secondary color of the via marker added to the map.

    • maximumAge long optional, defaults to 0

      The maximum age in milliseconds of a possible cached position that is acceptable to return. If set to 0, it means that the device cannot use a cached position and must attempt to retrieve the real current position. If set to Infinity the device must return a cached position regardless of its age.

    • position String optional, defaults to 'topright'

      The position of the control (one of the map corners).

      Possible values are 'topleft', 'topright', 'bottomleft' or 'bottomright'.

    • timeout long optional, defaults to 5000

      The maximum length of time (in milliseconds) the device is allowed to take in order to return a position.

    • title String optional, defaults to 'Locator'

      Text for the browser tooltip that appear on control hover.

    • zoom Number optional, defaults to 16

      The zoom level that the map zooms to when the location of the user is found.

    Example

    {
      className: '',
      enableHighAccuracy: true,
      markerPrimaryColor: '#333333',
      markerSecondaryColor: '#b7b7b7',
      maximumAge: 0,
      position: 'topright',
      timeout: 5000,
      title: 'Locator',
      zoom: 16
    }

Events

  • current_position Event

    A current_position event is fired when a position is successfully returned by the geolocation api. Returns a position object.

    Example

    locatorControl.on('current_position', function(eventResponse) {
      console.log(eventResponse);
    });

Return Value

An L.Control object that can be added to a map with the addControl() function.

Visual Example