谷歌地图无法在 phonegap 中正确显示答案

【问题标题】：Google maps not displaying properly in phonegap谷歌地图无法在 phonegap 中正确显示
【发布时间】：2014-09-01 05:22:15
【问题描述】：

我正在使用 google maps api 在我的 phonegap 应用程序中显示地图。

加载地图时，我遇到如下问题：

地图未在 div 中正确加载。只显示地图的一部分。

我用下面的代码来显示地图：

HTML 是：

<div id="mapOuterDiv_details" class="mapHolder">
     <div id="map_details">
      </div>
</div>

我正在加载 id 为“map_details”的地图。

我为两个 div 指定了 100% 的宽度和 100% 的高度。

而javascript代码是：

var mapOptions = {
        center: new google.maps.LatLng(19.997779,73.789684),
        zoom: 11,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };


        var map = new google.maps.Map(document.getElementById("map_details"), mapOptions);

        var marker = new google.maps.Marker({
                                            position: new google.maps.LatLng(19.997779,73.789684),
                                            map: map,
                                            animation: google.maps.Animation.DROP
                                            });


        google.maps.event.trigger(map, 'resize');

提前致谢，光辉

【问题讨论】：

这对我有用.... // 加载地图后调用调整大小函数正确加载 div google.maps.event.addListenerOnce(map, 'idle', function() { google.maps. event.trigger(map, 'resize'); });

标签： google-maps cordova google-maps-api-3

【解决方案1】：

您想使用我的插件 phonegap-googlemaps-plugin 吗？ https://github.com/wf9a5m75/phonegap-googlemaps-plugin

您可以在 Android 和 iOS 上运行 Google Maps SDK，并通过 JavaScript 轻松控制它。

【讨论】：

感谢 wf9a5m75 的努力。下面的解决方案对我有用： google.maps.event.addListenerOnce(map, 'idle', function() { google.maps.event.trigger(map, 'resize'); });