谷歌地图 v3 未在 iPad 上加载 - 按钮加载但地图只是蓝色答案

【问题标题】：Google Maps v3 Not Loading on iPad - Buttons Load But Map Is Just Blue谷歌地图 v3 未在 iPad 上加载 - 按钮加载但地图只是蓝色
【发布时间】：2012-03-24 15:35:50
【问题描述】：

我正在使用 Google Maps v3 对网站上的地址进行地理编码，它在所有浏览器中都可以正常工作，但显然在移动设备上除外。更具体地说，现在我只是尝试为 IOS 设备（iPad/iPhone/iPod Touch）修复它。

地图应用程序本身似乎正在加载，因为我可以看到 Google 徽标、使用条款链接、地图和卫星按钮，甚至是小街景图标（顺便说一下是灰色的）。

下面是地图在 iPad 上的截图。谁能指出可能导致此问题的正确方向或如何在 IOS 设备上对其进行调试？

谢谢！

编辑

下面是用于渲染地图的代码的核心部分。

function renderMap(elem, lat, lng) {
    lat = (null == lat || undefined == lat) ? -14.397 : lat;
    lng = (null == lng || undefined == lng) ? 120.644 : lng;
    var latlng = new google.maps.LatLng(lat, lng);
    var map    = new google.maps.Map(
        document.getElementById(elem.attr('id')), { 
            zoom: 11, 
            center: latlng, 
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
    );

    try {
        var marker = new google.maps.Marker({ map: map, position: latlng });
    } catch (err) {
        MAP_ERRORS.push(err);
    }
}

function initialize() {
    var msie7 = (navigator.appVersion.indexOf('MSIE 7.') == -1) 
        ? false : true;

    if (true != msie7) {
        $('#my-content-div' + ' > .gmap').each(function(index) {
            // these are hidden divs that contain these values
            var lat = $(this).parent().find('.lat').html();
            var lng = $(this).parent().find('.lng').html();
            renderMap($(this), lat, lng);
        });
    }
}
initialize();

编辑 2

我想我可能刚刚发现了真正的问题。看来 iPad 正在尝试将隐藏的纬度转换为 电话号码。我使用 JS 技巧在 iPad 上查看页面源代码，专门针对纬度（我认为是因为它是正数）Safari 将其转换为链接！源码如下：

<!-- iPad source -->
<span class="hidden lat">
    <a href="tel:36.783760070801">36.783760070801</a>
</span>

并且在它工作的所有其他浏览器中，源看起来像它应该：

<!-- Firefox 10.0.2 source (CORRECT) -->
<span class="hidden lat">36.783760070801</span>

有什么新想法吗？

【问题讨论】：

我认为那是位于坐标 (0,0) 的东大西洋。但是调试屏幕截图有点困难。有链接的机会吗？或者一些代码和示例地址？
嘿，感谢您的回复，很抱歉我迟迟没有回复！是的，我完全理解，不幸的是我现在无法发布链接，但我会考虑找出代码的 sn-p。当我有它时，我会发布我的编辑。再次感谢您的帮助！
显然 var lat 和 var lng 的计算结果为零。我认为没有足够的细节来确定为什么会这样，因为它似乎取决于 HTML 中定义的页面结构和数据。一个在线示例（例如在 jsfiddle.net 中）会有所帮助[或者至少会帮助我！]
请提供相关页面的链接。

标签： javascript ios ipad google-maps google-maps-api-3

【解决方案1】：

在终于在 iPad 上查看页面源代码后，我能够将问题归结为 iPad Safari 正在将其转换为电话号码的隐藏纬度链接。我搜索了 Stack Overflow，发现了这个：https://stackoverflow.com/a/227238/486233

<meta name="format-detection" content="telephone=no">

这样就解决了。

感谢大家的帮助！

【讨论】：