MQ is not defined

3 posts / 0 new
Last post
shubho
MQ is not defined

 

down votefavorite

 

I need to Load the mapquestapi on a button Load after adding i am getting error as MQ is not defined

Same thing is working when i am adding the script to the head but not working on button load. i.e, $('head').append();

 

$("#viewOnMap").click(function () {

$('head').append("https://www.mapquestapi.com/sdk/leaflet/v2.2/\"mq-map.js?key=\"KEY\"></script>");

$('head').append("https://www.mapquestapi.com/sdk/leaflet/v2.2/\"mq-geocoding.js?key=\"KEY\"></script>");

var map = L.map('map', {
layers: MQ.mapLayer() ---->>> MQ is not defined
});

MQ.geocode({ map: map })
.search('lancaster pa');

});

I would be glad if anyone can post a solution to this issue. Thanks in advanced.


MQBrianCoakley
Can you see the files loading
Can you see the files loading in the developer tools network tab successfully?   Is the geocode and/or map being loaded after the files are completely loaded? If the code above is run as is then the map is being created before the files are loaded. Create an event on the file load to run processes using those files.

Pistle
I ended up having 2 problems,

I ended up having 2 problems, one of my own and one that could help any reader :

  • I wasn't declaring the leaflet script at the right place (the page I declared it in). 

For the sake of easiness this is the answer

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);