MapQuest-GL.js

mqgl.Map.icons

The icons object that interfaces with the Icons API. Used for adding customizable icons to a map.

Methods

icons.add
icons.marker
icons.circle
icons.via
icons.flag
icons.construction
icons.incident

mqgl.Map.icons.add(lngLat, slug)

Adds an icon to the map at the provided lngLat point customized by the slug. The slug may be any valid icon resource as documented in the Icons API.

Syntax

var map = new mqgl.Map('map', 'KEY');

map.load( () => {
    map.icons.add({ lng: -104.999472, lat: 39.750307 }, 'marker-sm.png');
});

Parameters

  • lngLat required object

    A lngLat object of the icon's location.

    Example
    {
  lng: -104.999472,
  lat: 39.750307
}

  • slug required string

    The Icons API resource for the icon.

Return Value

A Promise, consisting of the created Icon object.

Visual Example

mqgl.Map.icons.marker.add(lngLat, slug)

Adds a marker to the map at the provided lngLat point customized by the slug. The slug may be any valid icon resource as documented in the Icons API.

Syntax

var map = new mqgl.Map('map', 'KEY');

map.load( () => {
    map.icons.marker.add({ lng: -104.999472, lat: 39.750307 }, 'blue-sm.png');
});

Parameters

  • lngLat required object

    A lngLat object of the markers's location.

    Example 
    {
  lng: -104.999472,
  lat: 39.750307
}

  • slug required string

    The Icons API options for the marker.

Return Value

A Promise, consisting of the created Icon object.

mqgl.Map.icons.circle.add(lngLat, slug)

Adds a circle to the map at the provided lngLat point customized by the slug. The slug may be any valid icon resource as documented in the Icons API.

Syntax

var map = new mqgl.Map('map', 'KEY');

map.load( () => {
    map.icons.circle.add({ lng: -104.999472, lat: 39.750307 }, 'red-sm.png');
});

Parameters

  • lngLat required object

    A lngLat object of the circle's location.

    Example 
    {
  lng: -104.999472,
  lat: 39.750307
}

  • slug required string

    The Icons API options for the circle.

Return Value

A Promise, consisting of the created Icon object.

mqgl.Map.icons.via.add(lngLat, slug)

Adds a via to the map at the provided lngLat point customized by the slug. The slug may be any valid icon resource as documented in the Icons API.

Syntax

var map = new mqgl.Map('map', 'KEY');

map.load( () => {
    map.icons.via.add({ lng: -104.999472, lat: 39.750307 }, 'green-sm.png');
});

Parameters

  • lngLat required object

    A lngLat object of the circle's location.

    Example 
    {
  lng: -104.999472,
  lat: 39.750307
}

  • slug required string

    The Icons API options for the circle.

Return Value

A Promise, consisting of the created Icon object.

mqgl.Map.icons.flag.add(lngLat, slug)

Adds a flag to the map at the provided lngLat point customized by the slug. The slug may be any valid icon resource as documented in the Icons API.

Syntax

var map = new mqgl.Map('map', 'KEY');

map.load( () => {
    map.icons.flag.add({ lng: -104.999472, lat: 39.750307 }, 'start-sm.png');
});

Parameters

  • lngLat required object

    A lngLat object of the flag's location.

    Example 
    {
  lng: -104.999472,
  lat: 39.750307
}

  • slug required string

    The Icons API options for the flag.

Return Value

A Promise, consisting of the created Icon object.

mqgl.Map.icons.construction.add(lngLat, slug)

Adds a construction to the map at the provided lngLat point customized by the slug. The slug may be any valid icon resource as documented in the Icons API.

Syntax

var map = new mqgl.Map('map', 'KEY');

map.load( () => {
    map.icons.construction.add({ lng: -104.999472, lat: 39.750307 }, 'low-sm.png');
});

Parameters

  • lngLat required object

    A lngLat object of the construction icon's location.

    Example 
    {
  lng: -104.999472,
  lat: 39.750307
}

  • slug required string

    The Icons API options for the construction icon.

Return Value

A Promise, consisting of the created Icon object.

mqgl.Map.icons.incident.add(lngLat, slug)

Adds an incident icon to the map at the provided lngLat point customized by the slug. The slug may be any valid icon resource as documented in the Icons API.

Syntax

var map = new mqgl.Map('map', 'KEY');

map.load( () => {
    map.icons.incident.add({ lng: -104.999472, lat: 39.750307 }, 'high-sm.png');
});

Parameters

  • lngLat required object

    A lngLat object of the incident icon's location.

    Example 
    {
  lng: -104.999472,
  lat: 39.750307
}

  • slug required string

    The Icons API options for the incident icon.

Return Value

A Promise, consisting of the created Icon object.