Google地图搜索：调整大小地图后位置搜索不居中？

Question

我正在开发角度+谷歌+地图，在这里我想添加一些标记与位置搜索，我也在表单中添加位置信息，所以当我点击 addMarker < / strong>，它会打开一个表单并将地图大小减少50％。

当将地图的大小缩小50％时，当我搜索任何位置时，它显示该位置的标记，但由于MAP的大小已更改而隐藏在地图中。 ...

<div ng-style="{ 'width' : width + '%' , 'height': height + '%' }" id="IndiaMap">
        <ui-gmap-google-map center='map.center' zoom='map.zoom' control='map.control' id="map-canvas" events="map.events">
            <ui-gmap-markers models="markers" idkey="markers.id" coords="'coords'"  events="markerEvents" icon="'icon'" fit="true">                 
            </ui-gmap-markers>
        </ui-gmap-google-map>
</div>

控制器

$scope.addLandMarkForm=function(){            
    $scope.markers='';               
    document.getElementById('IndiaMap').className='col-md-6';           
    $scope.map.zoom=5;
    $scope.width =  50;
    $scope.height= 50;
};
$scope.closeForm will close the form and map will return into origin form.

 $scope.closeForm=function () {  
        document.getElementById('IndiaMap').className='col-md-12'; 
        $scope.width =  100;
        $scope.height= 100;          
        $scope.map.zoom=5;           
 };

搜索位置

var input = document.getElementById('pac-input');
var searchBox = new google.maps.places.SearchBox(input);       
google.maps.event.addListener(searchBox, 'places_changed', function(){    
    var places = searchBox.getPlaces()
    var marker_search = {   
          id:store_index,
      coords: {
                   latitude: places[0].geometry.location.lat(),
                   longitude: places[0].geometry.location.lng()
              },
    $scope.latitude=marker_search.latitude;
    $scope.longitude=marker_search.longitude;      
    $scope.map.center = 
              {
                   latitude: marker_search.latitude, 
                   longitude: marker_search.longitude
              };
    $scope.map.zoom=17;
    $scope.$apply();
  }

Answer 1

您需要告诉Google地图地图画布的大小已更改，否则您将遇到各种渲染问题。只需将其添加到代码中，即可在地图大小更改后运行

google.maps.event.trigger(map, 'resize');