Appearance

MapQuest.js ​

Getting Started ​

MapQuest.js is a JavaScript library for interactive maps, geocoding, directions, and traffic. MapQuest.js is powered by the MapQuest APIs and integrates with Leaflet.js.

To get started, first include MapQuest.js and MapQuest.css in your HTML header.

html
<script src="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest.js"></script>
<link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest.css"/>

Then initialize your MapQuest key and define a MapQuest map object with a center, layer, and zoom.

js
L.mapquest.key = 'KEY';

// 'map' refers to a <div> element with the ID map
L.mapquest.map('map', {
  center: [37.7749, -122.4194],
  layers: L.mapquest.tileLayer('map'),
  zoom: 12
});

mapquest js map example

MapQuest.js Maps ​

If you only want to display maps, and reduce the size of the bundle, use the maps only version of the MapQuest.js library.

html
<script src="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-maps.js"></script>
<link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-maps.css"/>

MapQuest.js Core ​

By default, MapQuest.js includes a bundled version of Leaflet v1.3.1 that is fully supported. If you only want to use a different version of Leaflet, use the core version of the MapQuest.js library.

html
<script src="your version of Leaflet.js"></script>
<link type="text/css" rel="stylesheet" href="your version of Leaflet.css"/>
<script src="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.js"></script>
<link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.css"/>

Join the Community ​

You'll need to sign up for an account with MapQuest. An API key is provided upon sign up and is required when accessing MapQuest services.

Sign Up

Get Coding ​

Once you have an account, get started making. We have tons of APIs to try including Mapping, Geocoding, Directions, and Search.

Grab the Key

Integrates with Leaflet.js ​

Built in harmony with Leaflet.js which powers the interactive mapping portion of MapQuest.js. Easily extend MapQuest.js functionality with third-party plugins.

Supported Browsers ​

Desktop ​

  • Chrome 109+
  • Edge 118+
  • Safari 15.6+
  • Firefox 115+
  • Samsung Internet 22+
  • Opera 102+
  • QQ Browser 13.1+
  • Opera Mini all

Mobile ​

  • Chrome for Android 120+
  • Safari on iOS 15.6+
  • Opera Mobile 73+
  • UC Browser for Android 15.5+
  • Android Browser 120+
  • Firefox for Android 119+
  • KaiOS Browser 2.5+

Supporting Documentation ​

MapQuest.js Support