MapQuest-GL.js

mqgl.Map('map', 'KEY', options.geocoding)

A control that adds interactive geocoding functionality to the map. Geocoded locations will have markers set to their locations. If enabled, the Search Ahead API will provide predictive results based on the provided input.

Syntax

var map = new mqgl.Map('map', 'KEY', {
  geocoding: {
    closeResultsOnClick: true,
    compactResults: false,
    enabled: true, 
    keepOpen: false,
    position: 'topleft',
    searchAhead: true,
    searchAheadOptions: {
      limit: 6
    },
  }
});

Parameters

  • options object

    An object containing any of the following key value options: closeResultsOnClick, compactResults, enabled, keepOpen, position, searchAhead, and searchAheadOptions.

    • closeResultsOnClick Boolean optional, defaults to true.

      Determines if Search Ahead results should automatically close when a result is selected.

    • compactResults Boolean optional, defaults to false.

      Determines if a compact version of Search Ahead results should be used.

    • enabled Boolean optional, defaults to false.

      Determines if this control should be displayed.

    • keepOpen Boolean optional, defaults to false.

      Determines if input field of the control should remain open after a geocode.

    • position String optional, defaults to 'topleft'

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

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

    • searchAhead Boolean optional, defaults to true.

      Determines if the Search Ahead functionality should be enabled on the control.

      If the open option is set to true, this feature will automatically be disabled.

    • searchAheadOptions Object optional

      Options to be passed into the Search Ahead API if it is enabled.

      Any Request Parameters of the Search Ahead API are valid options.

      If the location parameter is not set in this object, Search Ahead results will be based on the current map center.

    Example

    geocoding: {
      closeResultsOnClick: true,
      compactResults: false,
      enabled: true, 
      keepOpen: false,
      position: 'topleft',
      searchAhead: true,
      searchAheadOptions: {
        limit: 6
      },
    }

Visual Example