Question

我正在使用ui-gmap-google-map，并且我试图设置地图的边界以适应我拥有的标记。这通常适用于它们之间的距离。但是当我使用标记之间的距离较长时，地图呈现如图所示，看起来它看起来像是渲染了两张地图。它看起来好像标记重复并再次开始在＆＃34;角落的右侧＆＃34;地图。

我知道标记和坐标是正确的。

我在控制器中设置界限......

uiGmapIsReady.promise(2).then(function(instances) {
                instances.forEach(function(inst) {
                    var map = inst.map;

                    var bounds = new google.maps.LatLngBounds();
                    for (var i in $scope.markers) {
                        bounds.extend(new google.maps.LatLng($scope.markers[i].coords.latitude, $scope.markers[i].coords.longitude));
                    }

                    var fitBounds = new google.maps.LatLngBounds();
                    fitBounds.extend(new google.maps.LatLng(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()));
                    fitBounds.extend(new google.maps.LatLng(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()));

                    map.fitBounds(fitBounds);

                });
            });

和html ......

<div class="map-container">
            <ui-gmap-google-map center="map.center" zoom="map.zoom" options="map.options" class="google-map">
                <ui-gmap-polyline path="map.path" stroke="map.stroke" fit="true"></ui-gmap-polyline>
                <ui-gmap-marker ng-repeat="m in markers track by $index" idKey="m.id" options="m.options" coords="m.coords" events="m.events"></ui-gmap-marker>
            </ui-gmap-google-map>
        </div>

如果我没有设置界限，它会渲染得很好，只是在一个看似随机的标记上直接缩放。但是我可以用一张地图缩小它看起来很好。

我无法在网上找到有关此特定问题的任何内容。任何帮助表示赞赏。

Answer 1

所以我最终想出来了......

设置地图时，我一直将初始缩放级别设置为5。然后运行fitBounds（）函数，我相信也会更新缩放。

我将初始缩放级别设置为0，而这个问题就消失了。

var map = {
                        //zoom: 5,
                        zoom: 0,
                        center: [{
                            latitude: $scope.journey.startCoordinate.lat,
                            longitude: $scope.journey.startCoordinate.lng
                        }, {
                            latitude: $scope.journey.endCoordinate.lat,
                            longitude: $scope.journey.endCoordinate.lng
                        }]};

有角度的谷歌地图呈现两张地图

1 个答案: