0

車両トリップビューマップにangularjsのng-Dialogモジュールを使用しています。trip-map の angularjs ディレクティブは正常に機能し、マップは完全なウィンドウ (ng-dialog モデル ポップアップではなく) に fitbounds と共に読み込まれますが、ng-dialog ポップアップでは機能しません。

ng-dialog では、googlemap が読み込まれますが、マップは fitbounds ではありません。

以前は、この問題は goge map fitbound が正常に機能していないことが原因であると考えていたので、以下の質問を投稿しました。私の取り組みの詳細については、こちらをご覧ください。

Google マップの fitBounds が機能しない

コントローラーの ng-dialog 呼び出しコード:

    ngDialog.open({
       template: 'Views/Main/tripdetail.html',
       className: 'ngdialog-theme-plain',
       controller: 'tripdetailController',
       scope: $scope
    });

フィットバウンド コードをマップします。

    var marker;
    var tripmap = mapService.getTripMap();
    var bounds = new google.maps.LatLngBounds();
    for (var j = 0; j < trips.length; j++) {
        var ltlng = new google.maps.LatLng(trips[j].lat, trips[j].lng);
        bounds.extend(ltlng);
        //   if (j == 0 || j == trips.length - 1) {
        marker = new google.maps.Marker({
            position: ltlng,
            map: tripmap
        });
        //  }
    }
    $scope.Bounds = bounds;
    tripmap.fitBounds(bounds);

ウィンドウでは、次のように見えます。

ここに画像の説明を入力

ng-dialog モーダル ポップアップでは、次のように左上隅に移動します。

ここに画像の説明を入力

解決策を教えてください。それはかなりのものです。

4

1 に答える 1

3

これは、ngDialog popup ディレクティブによってマップのサイズが変更されたためです。

as を使用して、マップのサイズ変更コールバックで fitbounds を呼び出すことによって解決されます

           $scope.$apply(function () {
                window.setTimeout(function () {
                google.maps.event.trigger(tripmap, 'resize');
                    tripmap.fitBounds(bounds);
                }, 100);
            });

助けてくれてありがとう。

于 2014-12-26T11:46:10.143 に答える