地图仅在 iOS 和 OSX 中加载错误,而不是 Windows

map loads wrong only in iOS and OSX, not Windows

我正在 Microsoft.Maps 工作,在 Visual Studio 进行开发。发布后,它在我所有的 windows 浏览器中运行良好,但在 iOS Safari/Chrome 和 OSX Safari 中看起来像这样:

http://i.imgur.com/8EsJcMz.png

滚动或缩放时,屏幕左侧显示相同,而屏幕右侧移动到世界的另一部分,与我尝试移动的方向完全无关。不提一下,图钉也动了!

请注意,我在星期五对此进行了测试,并发了 0 次并发症...过去 3 天发生了一些事情,我什至不知道是否可以修复它。

    <script type="text/javascript" src="https://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0&s=1"></script>
    <script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="/js/jquery-bing-maps/jquery.ui.bmap.js"></script>
    <script type="text/javascript">
            map = new Microsoft.Maps.Map(document.getElementById("mapDiv"),
                    {
                        credentials: "<redacted>",
                        mapTypeId: Microsoft.Maps.MapTypeId.road,
                        enableClickableLogo: false,
                        enableSearchLogo: false,
                        showCopyright: false,
                        showDashboard: false,
                        showMapTypeSelector: false,
                        showScalebar: false,
                        tileBuffer: 0,
                        zoom: 10
                    });

        window.onload = MapLoad;

    </script>


<body style="min-height:418px;">
    <div id="topofpage">
        <form id="Form2" runat="server">
        <!--#include virtual="header.html"-->
        </form>
        <div class="undersightslogo" style="max-width: 100%; overflow: hidden;">
            <div id="mapDiv" style="position: absolute; width: 100%; max-height: 100%; top: 42px;
                bottom: 0px; left:0px; min-height:372px;">
            </div>
            <div style="position: absolute;left: 7px; bottom:-54px;">
                <h6>
                    &copy; <companyname> <script type="text/javascript">document.write(new Date().getFullYear());</script>
                    </h6>
            </div>
        </div>
    </div>
</body>

我无法重现此问题,但确实注意到您的文档中存在一些问题。第一个是没有 MapLoad 函数,您的代码试图在加载页面之前加载地图。第二个是你有一个表单标签,但它永远不会关闭。

确保您已包含当前 Doctype 和 UTF-8 元标记,因为这是呈现相关问题的最常见原因之一。试试这个文档类型:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

和这个元标签:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

我在另一个论坛找到了解决方案。问题是,safari 是一个非常挑剔的浏览器。因此,添加

text-align:left

我的地图解决了这个问题。这个问题不是通过我自己的不同代码出现的,或者我是这么认为的。但谁真正知道?