Question

我正在尝试将Azure Maps与他们的JS Web SDK一起使用。我一直按照https://docs.microsoft.com/en-us/azure/azure-maps/how-to-use-map-control上的说明进行操作，直到添加我的订阅密钥，都会引发错误。

我尝试删除所有选项，并提示输入凭据，所以我已经通过身份验证。当放入不在DOM中的标识符时，我收到一条错误消息，提示它找不到ID。输入正确的ID后，我将获得一个白色可拖动背景，底部带有Microsoft徽标。因为从调试器看来，该调用来自this.map.setStyle(this.styleBuilder.build()),，所以我尝试提供其他样式选项，并尝试删除居中，缩放和语言。我也尝试使用window.onload。总而言之，问题仍然存在。

所需要做的就是加载脚本并插入以下代码段：

var map = new atlas.Map(<div id>, {
    center: [-122.33, 47.6],
    zoom: 12,
    language: 'en-US',
    authOptions: {
        authType: 'subscriptionKey',
        subscriptionKey: '<Your Azure Maps Key>'
    }
});

我做到了。

只是该片段生成了此错误：

    Uncaught (in promise) TypeError: Cannot read property 'origin' of 
    undefined
    at Object.at [as getReferrer] (atlas.min.js:3066)
    at new r (atlas.min.js:3066)
    at n._updateStyle (atlas.min.js:3066)
    at n.setStyle (atlas.min.js:3066)
    at e._rebuildStyle (atlas.min.js:3391)
    at atlas.min.js:3391
at  @   atlas.min.js:3066
r   @   atlas.min.js:3066
n._updateStyle  @   atlas.min.js:3066
n.setStyle  @   atlas.min.js:3066
e._rebuildStyle @   atlas.min.js:3391
(anonymous) @   atlas.min.js:3391
Promise.then (async)        
e._setStyleComponents   @   atlas.min.js:3391
(anonymous) @   atlas.min.js:3391
Promise.then (async)        
e   @   atlas.min.js:3391
(anonymous) @   myScript.js:787

这是打印精美的错误消息：

Uncaught (in promise) TypeError: Cannot read property 'origin' of undefined
    at Object.at [as getReferrer] (atlas.min.js:formatted:25499)
    at new r (atlas.min.js:formatted:47165)
    at n._updateStyle (atlas.min.js:formatted:52481)
    at n.setStyle (atlas.min.js:formatted:52475)
    at e._rebuildStyle (atlas.min.js:formatted:60131)
    at atlas.min.js:formatted:60219
at  @   atlas.min.js:formatted:25499
r   @   atlas.min.js:formatted:47165
n._updateStyle  @   atlas.min.js:formatted:52481
n.setStyle  @   atlas.min.js:formatted:52475
e._rebuildStyle @   atlas.min.js:formatted:60131
(anonymous) @   atlas.min.js:formatted:60219
Promise.then (async)        
e._setStyleComponents   @   atlas.min.js:formatted:60172
(anonymous) @   atlas.min.js:formatted:59678
Promise.then (async)        
e   @   atlas.min.js:formatted:59673
(anonymous) @   myScript.js:formatted:787

编辑：我开始浏览并在标题中注释掉我的脚本。当我删除所有JQuery脚本标签时，地图起作用了。（然后，我确认我正在开发最新版本的JQuery）。但是现在我的页面当然不起作用了。同样，在工作时，我检查了引发错误的origin属性。代码为self.location.origin，其中self为window。所以现在我不兼容了。

如果有人可以提供一些帮助，将不胜感激。

Answer 1

我没有想出为什么它不起作用的原因。但是我确实设法使页面正确加载。

基本上，由于Azure Maps试图引用应该指向self但指向window的{{1}}，因此我在初始化`之前声明了null地图。

self

这是一个骇客，很丑陋，但是有效。

Azure Maps Basic JS初始化与JQuery引发错误

1 个答案: