JavaScript runtime error: 'Microsoft' is undefined - Bing Maps version 7

Question

我创建 Microsoft bing 地图。 JavaScript 运行 time error('Microsoft' is undefined) 加载时出现。

    function GetMap() {

            var vcredentials = "<%=this.credentialKey%>" //credential Key
            var vlatitude = Number("<%=this.latitude%>") //Latitude
            var vlongitiude = Number("<%=this.longitiude%>") //Longitude
            var vzoomLevel = Number("<%=this.zoom%>");    //Zoom Level  
            var isDataAvailable = "<%=this.isFound%>";  //Is data available 

            // Create the Map instance
            map = new Microsoft.Maps.Map(document.getElementById("mapDiv"), //div map load
            {
                credentials: vcredentials, //credential
                center: new Microsoft.Maps.Location(vlatitude, vlongitiude),// Latitude and Longitude
                mapTypeId: Microsoft.Maps.MapTypeId.road, //bing map type
                zoom: vzoomLevel, //zoom level
                showBreadcrumb: true, // show Bread crumb
                enableSearchLogo: false,//enable Search Logo
                enableClickableLogo: false,//enable Clickable Logo
                customizeOverlays: true //customize Overlays
            });

            if(isDataAvailable == "True" || isDataAvailable == "true")
                AddPushPin();

            Microsoft.Maps.Events.addHandler(map, 'viewchange', OnViewChanged);
            Microsoft.Maps.Events.addHandler(map, 'click', OnMouseClicked);
        }

Answer 1

我不认为你做错了什么。我创建了一个 Bing Maps Key and followed these instructions。这就是它告诉您创建的内容：

<script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?callback=GetMap&key=YOURMAPKEY' async defer></script>

<div id="myMap"></div>

<style>
    #myMap {
        position: relative;
        width: 600px;
        height: 400px;
    }
</style>

<script type='text/javascript'>
    function GetMap() {
        var map = new Microsoft.Maps.Map('#myMap');
    }
</script>

但是这会引发错误

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.bing.com/fd/ls/lsp.aspx

地图 API 似乎有问题。使用 Firefox、Chrome 和 Edge 对此进行了测试。在 Webforms 和一个简单的 html 页面上。

Answer 2

我发现了问题所在。它已加载主网页，但仍在加载地图。所以这是错误的。我修复它。这是我的修复。

 var retryCount = 0;
        function GetMap() {
            try {
                retryCount++;
                var vcredentials = "<%=this.credentialKey%>"
                var vlatitude = Number("<%=this.latitude%>")
                var vlongitiude = Number("<%=this.longitiude%>")
                var vzoomLevel = Number("<%=this.zoom%>");
                var isDataAvailable = "<%=this.isFound%>";
                
                
                // Create the Map instance
                map = new Microsoft.Maps.Map(document.getElementById("mapDiv"),
                    {
                        credentials: vcredentials,
                        center: new Microsoft.Maps.Location(vlatitude, vlongitiude),
                        mapTypeId: Microsoft.Maps.MapTypeId.road,
                        zoom: vzoomLevel,
                        showBreadcrumb: true,
                        enableSearchLogo: false,
                        enableClickableLogo: false,
                        customizeOverlays: true
                    });

                if(isDataAvailable == "True" || isDataAvailable == "true")
                    AddPushPin();

                Microsoft.Maps.Events.addHandler(map, 'viewchange', OnViewChanged);
                Microsoft.Maps.Events.addHandler(map, 'click', OnMouseClicked);
                }
             catch (Ex) {
                 if (typeof (Microsoft) == 'undefined' || Ex.message == 'Microsoft is not defined')
                       if (retryCount < 5) setTimeout('GetMap()', 5000);
                       else
                          alert('Fail to load Map. Error: ' + Ex.Message);
               
             }
        }
        
        $(document).ready(function () {
            retryCount = 0;

            if (document.readyState === "complete") {
                this.ready = true;

                GetMap();
            }
        });

JavaScript runtime error: 'Microsoft' is undefined - Bing Maps version 7

JavaScript runtime error: 'Microsoft' is undefined - Bing Maps version 7

javascript

asp.net

ajax

bing-maps