Map always returns undefined

Question

I've been trying to display Bing Map whenever a user clicks on a certain HTML element, but Microsoft.Maps.Map always returns undefined even after setting a timeInterval, I have also tried inserting a new scripts with onscriptload onclick event. Below are my sample code.

$(document).ready(function(){

    var script = document.createElement("script");
        script.type = 'text/javascript';
        script.src = 'https://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0&onscriptload=getMap';

        document.head.appendChild(script);

})


 $("#showMap").click(function(){
getMap();

})
function getMap(){
console.info(Microsoft.Maps.Map);  
    var time = "";
    var map
    var mapControl = Microsoft.Maps.Map;
        if(mapControl == undefined){
            time = setInterval(function(){ getMap() }, 8000);
        }
        else{
            map = new Microsoft.Maps.Map(document.getElementById('address1_composite'), {credentials: 'Cred'}); 
            clearInterval(time);
        }     
}

Sorry I know this question is already asked here in this link, Bing map is undefined after loading Javascript file

We have the same scenario but mine is not working as expected though i have tried the suggested answer.

Where did you test your code? one a site like jsfiddle, on localhost, ... ? What error message is displayed in the console? — t.niese, Jul 16 '16 at 11:09
I'm testing it only through console since it is connected to crm, It says that Microsoft.Maps.Map is undefined. — r-r, Jul 16 '16 at 11:16
Then you need to check the network tab of you browser. I'm pretty sure the loading of the script is block for some reason. — t.niese, Jul 16 '16 at 11:20
Yeah, it really blocks the additional scripts. For workaround, I just reference manually the additional scripts in my head section with HTTPS protocol. — r-r, Jul 16 '16 at 12:27

score 0 · Answer 1 · answered Jul 16 '16 at 21:30

What you should do instead of creating the map when an element is clicked is load the map once and then hide/show it when the button is clicked. This will significantly reduce the number of map loads which means less transactions are generated and thus lower costs.

Also, instead of loading the map script on demand like you are, use the Bing Maps V8 control and load it asynchronously: https://msdn.microsoft.com/en-us/library/mt712557.aspx

Map always returns undefined

1 Answers1