Google地图无法在手机屏幕中正常显示

Question

我正在使用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');

提前致谢， 特加斯

Answer 1

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

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