Question

我已经在我的应用程序中添加了一个Ionic Modal，它包含一个带有一个标记的Google Map，以给定点为中心，其中有一个标记;单击标记会显示地址。这几天前完美无缺，现在我只是得到一个空白页面（控制台中没有任何内容），虽然我没有更改相关代码。我首先使用Google对地址字符串进行地理编码。这似乎可以起到＆＃39;结果＆＃39;显示在控制台中。任何帮助将不胜感激。

以下功能在控制器中，当按下按钮时调用，打开一个应该显示地图的模态。

     $scope.displayAddress = function(request) {
        var address = processAddress(request);
        var map;

        $scope.modal.show();

        // Now need to geocode the address.
        console.log(document.getElementById('map'));
        var geocoder = new google.maps.Geocoder();
        geocoder.geocode( { 'address': address}, function(results, status) {
           if (status == 'OK') {

              map = new google.maps.Map(document.getElementById('map'), {
                 center: results[0].geometry.location,
                 zoom: 15
              });

              var marker = new google.maps.Marker({
                 map: map,
                 position: results[0].geometry.location
              });

              var infoWindow = new google.maps.InfoWindow({
                 content: address
              });

              marker.addListener('click', function() {
                 infoWindow.open(map, marker);
              });
           } else {
              console.log("Error: " + status);
           };
        });
     };

HTML：

    <ion-modal-view>
<ion-header-bar>
    <h1 class="title">Client's Address</h1>
    <button class="button button-positive" ng-click="closeModal()">Close</button>
</ion-header-bar>
<ion-content>
    <div class="lesson-requests__address-map-wrapper">
        <div id="map" class="lesson-requests__address-map"></div>
    </div>
</ion-content>

Wrapper的宽度，高度= 100％

嵌入式Google地图将不再显示

0 个答案: