谷歌地图 fitbounds 不适用于 angularjs ng-dialog答案

【问题标题】：Google map fitbounds not working with angularjs ng-dialog谷歌地图 fitbounds 不适用于 angularjs ng-dialog
【发布时间】：2015-02-23 04:29:10
【问题描述】：

我正在使用 angularjs 的 ng-Dialog 模块作为车辆行程视图地图。我的trip-map angularjs指令工作正常，地图在完整窗口中加载了fitbounds（不在ng-dialog模型弹出窗口中），但在ng-dialog弹出窗口中不起作用。

在 ng-dialog 中，googlemap 已加载，但地图不在 fitbounds 中。

早些时候我认为问题是由于 googe map fitbound 无法正常工作，所以我发布了以下问题。您可以在此处找到有关我的工作的更多详细信息。

Google map fitBounds not working

控制器中的ng-dialog调用代码：

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

地图 fitbound 代码：

    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 模态弹出窗口中，它移动到左上角为：

请告诉我解决方案。这将是可观的。

【问题讨论】：

尝试在对话框打开回调中使用地图调整大小方法。任何时候地图被隐藏都无法计算尺寸
我在控制器中使用了地图调整大小触发器。请参阅stackoverflow.com/questions/27635634/…。
对不起，我已经在指令中完成了地图调整大小触发器。
但这是一个不同的问题，并且在您询问如何修复它的问题中没有显示调整大小。也可能必须在同一个打开回调中调用以适应边界
非常感谢。 @charlietfl。我在控制器中的相同调整大小触发器中调用了 fitbounds。工作完美..再次感谢。

标签： angularjs google-maps fitbounds ng-dialog

【解决方案1】：

这是由于地图被 ngDialog 弹出指令调整大小。

通过在 map resize 回调中调用 fitbounds 解决

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

感谢大家的帮助。

【讨论】：