首页 > 解决方案 > Azure 地图示例

问题描述

我正在尝试在此处获取示例代码:https ://docs.microsoft.com/en-us/azure/azure-maps/how-to-use-map-control简单地显示地图并复制并粘贴代码进入我运行 IIS 的笔记本电脑上的本地虚拟目录。

两个位置的代码错误。第一个至少可以说非常令人费解:

第 1 行,第 1 列:default.html:1:1 XML 解析错误:语法错误位置:http://localhost/azuremaps/default.html

第二个错误是:

TypeError:atlas.map 不是构造函数

直接从示例中复制的 HTML 代码:

<html>
 <head>
    <!-- Load in the Azure Maps Web SDK - Using CSS and JS -->
    <link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.css" type="text/css" />
    <script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.js"></script>
   <!-- Add a reference to the Azure Maps Services Module JavaScript file. -->
   <script src="https://atlas.microsoft.com/sdk/javascript/service/2/atlas-service.min.js"></script>
  </head>

<body>
  <div id="theMap"></div>
    <script type="text/javascript">
      map = new atlas.map('theMap', {
        // Only allow one copy of the world be rendered when zoomed out.
        renderWorldCopies: false,
        language: 'en-US',
        center: [-122.3353, 47.6038],
        zoom: 12,
        view: 'auto',
        style: 'road',
        authOptions: {
            authType: 'subscriptionKey',
            subscriptionKey: 'mySubKey',
            getToken: function(resolve, reject, map) {
                fetch(url).then(function(response) {
                    return response.text();
                }).then(function(token) {
                    resolve(token);
                });
            }
        }
    });

    // Wait until the map resources are ready.
    map.events.add('ready', function () {
    });
</script>
</body>
</html>

标签: javascriptazuremapssample

解决方案


错字,使用map = new atlas.Map('theMap',这里M是大写字母


推荐阅读