灰色 Google 使用 jQuery 移动设备在 Intel XDK 上映射

Question

您好，我正在使用 Intel XDK 和 jQuery 移动开发旅游应用程序，因为我需要显示带有一些标记和信息框的 google 地图。我遇到的问题是当我在模拟器或真实设备上加载 apk 时，地图应该显示的屏幕变成全灰色。就像下面的屏幕。

这是我的代码：

<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
  <div class="upage bg_que_ver" id="mapa" data-role="page" data-url="mapa">
            <div data-role="header" data-theme="b">
        <h1>Maps</h1>
        </div>
        <div id="map" style="width: 100%; height: 95%;"></div>
        <script type="text/javascript">
            var map; //<-- This is now available to both event listeners and the initialize() function
            function initialize() {
            var mapOptions = {
            center: new google.maps.LatLng(40.5472,12.282715),
            zoom: 6,
            mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            map = new google.maps.Map(document.getElementById("map"),
            mapOptions);
            }
            google.maps.event.addDomListener(window, 'load', initialize);
            google.maps.event.addDomListener(window, "resize", function() {
            var center = map.getCenter();
            google.maps.event.trigger(map, "resize");
            map.setCenter(center); 
            });
        </script>       
 </div>

Answer 1

确保您使用 Google API 控制台注册了正确的密钥和程序包名称。具体来说，如果您直接从 Android Studio 编译和启动，您可能正在以调试模式登录。如果是这样，您需要将调试密钥散列 + 程序包名称添加到 API 控制台中允许的应用程序。

您还可以查看这个相关的 SO 问题：Android app google maps showing grey tiles and not map!

灰色 Google 使用 jQuery 移动设备在 Intel XDK 上映射

Grey Google Maps On Intel XDK using jQuery Mobile

javascript

google-maps

jquery-mobile

google-maps-api-3

intel-xdk