javascript - 谷歌地图地理编码和setCenter

Question

我有这个奇怪的现象但首先是代码

html

<div ng-app='maptesting'>
       <div ng-controller="MapCtrl">
            <div id="map_canvas" ui-map="myMap" 
              style="height:300px;width:400px;border:2px solid #777777;margin:3px;     
              border:1px solid" 
              ui-options="mapOptions" 
              ui-event="{'map-idle' : 'onMapIdle()'}"
    >
</div>

JavaScript

angular.module('maptesting', ['ui.map','ui.event']);
function MapCtrl($scope) {
    var ll = new google.maps.LatLng(30.9000, 40.2740);
    $scope.mapOptions = {
        center: ll,
        zoom: 15,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var geocoder= new google.maps.Geocoder();

var map = new window.google.maps.Map(document.getElementById("map_canvas"),      
    $scope.mapOptions);

var address='los angeles';
geocoder.geocode({'address':address},function(results,status){
    if (status == google.maps.GeocoderStatus.OK){
        alert(address);
        alert(results[0].geometry.location);
        alert($scope.myMap);
        map.setCenter(results[0].geometry.location);
        test=results[0].geometry.location;
        var marker=new google.maps.Marker({
          map: map,
          position: results[0].geometry.location
    }else{
        alert(status);
    }   
});


$scope.onMapIdle = function() {
    if ($scope.myMarkers === undefined){    
        var marker = new google.maps.Marker({
            map: $scope.myMap,
            position: ll
        });
        $scope.myMarkers = [marker, ];
    }
};

$scope.markerClicked = function(m) {
    window.alert("clicked");
};

}

一切似乎都正常，标记、缩放、拖动，唯一不顺利的是 map.setCenter， map 总是将他的中心设置在 ll 坐标中，任何人都可以帮助我吗？

在这里你可以找到一个 fiddle http://jsfiddle.net/eb8Fd/1/如您所见，中心不在加利福尼亚，而是在伊拉克，如果快速缩放，似乎有两张 map 。

Answer 1

那里有 2 个 google.maps.Map 实例(1 个是通过 ui.map 创建的，另一个是在 MapCtrl 中创建的)。

删除第二个实例的创建并使用此代码:

//Markers should be added after map is loaded
    var address='los angeles';
    geocoder.geocode({'address':address},function(results,status){
        if (status == google.maps.GeocoderStatus.OK){
            alert(address);
            alert(results[0].geometry.location);
            alert($scope.myMap);
            $scope.myMap.setCenter(results[0].geometry.location);
            test=results[0].geometry.location;
            var marker=new google.maps.Marker({
              map: $scope.myMap,
              position: results[0].geometry.location
        });
        }else{
            alert(status);
        }   
    });

http://jsfiddle.net/doktormolle/eb8Fd/6/