AngularJS 和谷歌地图答案

【问题标题】：AngularJS and GoogleMapAngularJS 和谷歌地图
【发布时间】：2015-12-20 15:59:17
【问题描述】：

我正在尝试在地图上移动标记时动态获取纬度和经度。我找到了这个解决方案：

google.maps.event.addListener(marker, 'dragend', function(evt){

                          window.alert(evt.latLng.lat()+"---"+evt.latLng.lng());

                        });

但它没有返回 lat 和 lng 的新值

这是我给出的代码：

  $scope.$on('mapInitialized', function(event, map) {

          var uluru;
          $scope.postGoogle = function(google){
              $http.get("https://maps.googleapis.com/maps/api/geocode/json?address="+google.address+google.city+google.state+google.zip+google.country+"&key="+google.apikey).
              then(function(response) {
                 $scope.latitute = response.data.results[0].geometry.location.lat;
                 $scope.longitude = response.data.results[0].geometry.location.lng;
                  uluru = {lat: response.data.results[0].geometry.location.lat, lng: response.data.results[0].geometry.location.lng};
                  map.setCenter({lat: response.data.results[0].geometry.location.lat, lng: response.data.results[0].geometry.location.lng});
                  var contentString = '<div id="content">'+
                  '<div id="siteNotice">'+
                  '</div>'+
                  '<h1 id="firstHeading" class="firstHeading">latitude and longitude</h1>'+
                  '<div id="bodyContent">'+
                  '<Span>'+map.getCenter()+'</span>'+
                  '</div>'+
                  '</div>';

                  var infowindow = new google.maps.InfoWindow({
                        content: contentString
                      });

                  var marker = new google.maps.Marker({
                        position: uluru,
                        map: map,
                        draggable:true,
                        title: response.data.results[0].formatted_address
                      });
                     /* marker.addListener('click', function() {
                        infowindow.open(map, marker);
                      });*/
                      google.maps.event.addListener(marker, 'dragend', function(evt){
                         /* $scope.latitute =  evt.latLng.lat().toFixed(3);
                          $scope.longitude = evt.latLng.lng().toFixed(3);*/
                          window.alert(evt.latLng.lat()+"---"+evt.latLng.lng());
                          //window.alert(this.getPosition().lat());
                        });

                        /*google.maps.event.addListener(marker, 'dragstart', function(evt){
                            //$scope.latitute = '<p>Currently dragging marker...</p>';
                            window.alert(evt.latLng.lat());
                        });
                        */map.setCenter(marker.position);
                        marker.setMap(map);

              }, function(response) {
                // called asynchronously if an error occurs
                // or server returns response with an error status.
              });
            //window.alert(google.address+"------"+google.apikey);

          };






        var numTiles = 1 << map.getZoom();
        var projection = new MercatorProjection();
        $scope.chicago = map.getCenter();
      });

【问题讨论】：

标签： angularjs google-maps

【解决方案1】：

这就是我猜你正在寻找的：

google.maps.event.addListener(marker, 'dragend', function() {
  geocoder.geocode({'latLng': marker.getPosition()}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      if (results[0]) {
        $('#address').val(results[0].formatted_address);
        $('#latitude').val(marker.getPosition().lat());
        $('#longitude').val(marker.getPosition().lng());
        infowindow.setContent(results[0].formatted_address);
        infowindow.open(map, marker);
      }
    }
  });
});

【讨论】：

【解决方案2】：

这是我使用的一小段 JavaScript 代码，用于在移动标记时动态更改 lat 和 lng：

google.maps.event.addListener(marker, 'position_changed', function() {

    lat = marker.getPosition().lat();
    lng = marker.getPosition().lng();

    $('#lat').val(lat);
    $('#lng').val(lng);

});

和底部的 2 行正在为 html 输入分配值，以查看值已更改

【讨论】：