MapQuest.com
Business
Navigation
Getting Started
Developer Blog
Web SDKs
MapQuest.js
MapQuest-GL.js
API Reference
Examples
Maps
Map with Pitch and Bearing
Map with Custom Tiles
Map with Traffic
Map with Open Data
Geocoding
Basic Geocoding
Geocoding with Multiple Locations
Reverse Geocoding
Geocoding with Custom Icons
Geocoding with Custom Popups
Geocoding with Open Data
Search Ahead
Geocoding Control with Search Ahead
Filtering Results for Search Ahead
Directions
Basic Directions
Directions with Multiple Waypoints
Directions with Custom Icons and Ribbons
Directions with Disabled Traffic Ribbon
Miscellaneous
Draw a Line
Draw a Polygon
Draw a Circle
Add a Marker
Add a Marker with a Popup
Add a GeoJSON Layer
Customizing Map Styles
PlaceSearch.js
APIs
Data Manager API
Directions API
Geocoding API
Icons API
Search API
Place Search API
Search Ahead API
Static Map API
Traffic API
Legacy Products
Leaflet Plugins
Tools
Lat/Lng Finder
Link to MapQuest
Share
Getting Started
Developer Blog
Documentation
Web SDKs
MapQuest.js
MapQuest-GL.js
beta
API Reference
Examples
Maps
Map with Pitch and Bearing
Map with Custom Tiles
Map with Traffic
Map with Open Data
Geocoding
Basic Geocoding
Geocoding with Multiple Locations
Reverse Geocoding
Geocoding with Custom Icons
Geocoding with Custom Popups
Geocoding with Open Data
Search Ahead
Geocoding Control with Search Ahead
Filtering Results for Search Ahead
Directions
Basic Directions
Directions with Multiple Waypoints
Directions with Custom Icons and Ribbons
Directions with Disabled Traffic Ribbon
Miscellaneous
Draw a Line
Draw a Polygon
Draw a Circle
Add a Marker
Add a Marker with a Popup
Add a GeoJSON Layer
Customizing Map Styles
PlaceSearch.js
new
APIs
Data Manager API
Directions API
Geocoding API
Icons API
Search API
Place Search API
Search Ahead API
Static Map API
Traffic API
Legacy Products
Leaflet Plugins
Tools
Lat/Lng Finder
Link to MapQuest
Share
MapQuest-GL.js
Directions with Multiple Waypoints
Edit the code below and click "Try It Now" to display the result.
<html> <head> <script src="https://api.mqcdn.com/sdk/mapquest-gl-js/v0.4.0/mapquest-gl.js"></script> <link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-gl-js/v0.4.0/mapquest-gl.css"/> <script type="text/javascript"> window.onload = function() { var map = new mqgl.Map('map', 'ck2OXUAJsF0iz999XGQ62jyXo8AXOVp7', {center: [-74.0059, 40.7128], zoom: 12}); map.load(function() { map.directions.route([ '350 5th Ave, New York, NY 10118', '366 Columbus Ave, New York, NY 10024', '881 7th Ave, New York, NY 10019', 'One Liberty Plaza, New York, NY 10006' ]).then( data => map.fitBounds() ); }); }; </script> </head> <body style="border: 0; margin: 0;"> <div id="map" style="width: 100%; height: 530px;"></div> </body> </html>
Try It Now