1

我想展示印度的中心。地图的大小根据要求而变化。我的问题是当地图缩小时，它没有显示印度的中心，请参见以下代码：

<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>

我想将印度地图居中 latitude: 21.0000, longitude:78.0000，但它不起作用。请看下图。scope.addLandMarkForm将地图的大小减小 50% 并将印度地图的中心放在上述坐标处，我可以减小大小但无法将上述坐标设置为印度的中心：

$scope.addLandMarkForm=function(){            
    $scope.markers='';               
    document.getElementById('IndiaMap').className='col-md-6';           
    $scope.map.zoom=5;
    $scope.width =  50;
    $scope.height= 50;
    $scope.map.center = {latitude: 21.0000, longitude:78.0000};
};

$scope.closeForm 将关闭表单，地图将返回原始表单。

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

请看以下图片：

地图中心不正确：
地图中心不正确

正确的地图中心：
正确的地图中心

正如Bruno César所建议的，我需要一些窗口 DOM 甚至监听器，它能够监听 DOM 的变化。我怎样才能在这里使用它？我正在通过document.getElementById('IndiaMap').className='col-md-6';哪种类型的事件更改 CSS 类？

4

0 回答 0