As of today 2016-07-11, MapQuest has discontinued direct access to their tiles. They seem to only support Leaflet, iOS and Android SDKs. Any idea how to get Openlayers to work with MapQuest again, or should we be thinking of a different alternative? Thanks.
It's as simple as changing your tileUrl.
Replace this:
var tileUrl = 'http://otile{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png?x';
with this:
var tileUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
Then use as before:
L.tileLayer(tileUrl, { }).addTo(map);
For basemap imagery with OpenLayers, we are basically down to Bing Maps, Mapbox, and DigitalGlobe. All three services require an API key, and all three offer a free tier.
I'm currently using DigitalGlobe and have been very pleased with their resolution and coverage thus far. To use it in OpenLayers, first sign up for an API key at their site.
http://mapsapidocs.digitalglobe.com/
Then just use the following tile source (remember to replace YOUR_ACCESS_TOKEN):
new ol.layer.Tile({
title: 'DigitalGlobe Maps API: Recent Imagery with Streets',
attribution: "© DigitalGlobe, Inc",
source: new ol.source.XYZ({
url: 'http://api.tiles.mapbox.com/v4/digitalglobe.nal0mpda/{z}/{x}/{y}.png?access_token=YOUR_ACCESS_TOKEN'
})
})
This gives you their global satellite imagery with resolutions ranging from a few meters down to 10 centimeters! They offer more base layers than the one I provided in this example, but this should get you started quickly.
For more OpenLayers examples with DigitalGlobe, see this link:
http://mapsapidocs.digitalglobe.com/docs/maps-api-openlayers
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With