【问题标题】:Bing Maps v8 doesn't show必应地图 v8 不显示
【发布时间】:2016-05-04 13:03:18
【问题描述】:

我正在尝试新的 Bing 地图 v8。 我遵循第一个例子: http://www.bing.com/api/maps/sdk/mapcontrol/isdk#loadMapSync+HTML

它有效。但是当我添加一个文本时,比如test,它会停止显示地图:

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
    </head>
    <body>
        test
        <div id='printoutPanel'></div>
        <div id='myMap'></div>


        <script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol'></script>
        <script type='text/javascript'>
            function loadMapScenario()
            {
                var map = new Microsoft.Maps.Map(document.getElementById('myMap'), {
                    credentials: 'Your Bing Maps Key'
                });

            }

            window.onload = loadMapScenario;
        </script>
    </body>
</html>

第 7 行中的单词 test 使其停止工作。 有什么想法吗?

【问题讨论】:

  • “停止工作”到底是什么意思?你得到什么错误?
  • 当我添加test 字时它不显示地图。我已经使用 Internet Explorer 11、Google Chrome 50.0.2661.94 m 和 Firefox 45.0.2 对其进行了测试。您可以复制/粘贴代码并自行测试。如果您删除单词test,您将看到它再次显示地图。
  • @Nekketsu :它在 Chrome 50.0.2661.94 m 中运行良好,这是jsbin.com/repovotafi/edit?html,output 的演示,请检查并提供反馈。
  • 哇,它对我有用。我只看到了一个区别,没有&lt;!DOCTYPE html&gt;。如果我从我的 HTML 中删除它,它也适用于我在本地。知道为什么&lt;!DOCTYPE html&gt; 会失败吗?请问可以在本地测试吗?创建一个 HTML 文件并直接从您的硬盘打开它。
  • 它对我来说在本地也很完美。

标签: javascript html bing-maps


【解决方案1】:

这里的文档类型不应该是失败的原因,事实上它应该减少问题,因为这是地图使用的 HTML5 的文档类型。

您提供的代码应该可以工作。调查这个我发现地图的宽度从未被设置,因此它最终为 0。当没有为地图指定宽度或高度时,地图会尝试使用其父级的尺寸。似乎将文本添加到正文中会导致计算不正确。我会让开发团队对此进行调查。

另外,如果您要迁移需要同步运行的旧代码,我只会使用 Sync 方法来加载地图。如果您正在创建一个新应用程序,您应该异步加载地图控件,因为它可以让您的页面加载得更快。 http://www.bing.com/api/maps/sdk/mapcontrol/isdk#loadMapAsync+HTML

【讨论】:

  • 我在同步加载和异步加载时遇到了同样的问题。如果我得到bing.com/api/maps/sdk/mapcontrol/isdk#loadMapAsync+HTML 示例,它可以正常工作。如果我在正文中添加一些文本,它就会停止工作。如果我删除&lt;!DOCTYPE html&gt;,那么即使我在正文中添加文本也可以。我想使用&lt;!DOCTYPE html&gt; 声明,并在正文中添加文本,并使其工作,但我不能。
  • 正如我上面提到的,由于未指定宽度,因此地图评估的宽度为 0。您可以将 style="width:100%" 添加到地图 div 以解决此问题。我会让开发团队调查为什么在这种情况下地图评估宽度为 0。
  • 更正,将以下样式添加到地图可以更正问题:style="height:100vh;width:100vw" 或者您可以提供像素高度和宽度。
  • 与开发团队核对,并针对其他地图平台测试此场景,这按预期工作。当没有为地图指定维度时,它会尝试从其父级继承维度。但如果父级没有任何尺寸,则宽度/高度最终为 0。
  • 在以前版本的 Bing 地图中,提供高度、宽度和位置值是绝对必要的,否则它不会在大约 30% 的浏览器中呈现
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多