Javascript 更新标记位置 Google Maps V3

Update Marker Position Google Maps V3

提问by user1095118

I am quite a novice with javascript stuff and am currently faking it till i make it lol and now ive come across a small hill that i'm struggling to get over :S.

我是 javascript 方面的新手，目前我正在伪造它，直到我做到了哈哈，现在我遇到了一座我正在努力克服的小山：S。

Currently my script finds the users location and adds a pin to the map while copying LatLon to some form fields.

目前，我的脚本会查找用户位置并在将 LatLon 复制到某些表单字段时向地图添加图钉。

In addition to just zooming in on the users location i would like them to have the ability to add a custom address which is entered into a text field, geocoded and then updates the current pin on the map.

除了只是放大用户位置之外，我希望他们能够添加一个自定义地址，该地址输入到文本字段中，进行地理编码，然后更新地图上的当前图钉。

This all works, although it adds an additional pin to the map rather than updating the current pin.

这一切都有效，尽管它向地图添加了一个额外的图钉，而不是更新当前的图钉。

I am unsure how to pass the value from the address geocoding function back into the original pin / or do i delete the original pin and add a new pin. I'm sure i can reuse some functions as well... i don't think my code is terribly efficient :/

我不确定如何将地址地理编码功能中的值传递回原始引脚/或者是否删除原始引脚并添加新引脚。我相信我也可以重用一些函数......我认为我的代码效率不高：/

Any way i hope a guru out there can help me out

无论如何，我希望那里的大师可以帮助我

Cheers Nick

干杯尼克

 var geocoder;
 var map;
 var pos;


function initialize() {

geocoder = new google.maps.Geocoder();
var newyork = new google.maps.LatLng(40.69847032728747, -73.9514422416687);
var address = document.getElementById("address").value;
var initialLocation;

var myOptions = {
  zoom: 12,
  center: initialLocation,
  mapTypeId: google.maps.MapTypeId.TERRAIN
}


// Try HTML5 geolocation
    if(navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        var pos = new google.maps.LatLng(position.coords.latitude,
                                         position.coords.longitude);


        var marker = new google.maps.Marker({
          map: map,
          position: pos,
          title: 'Location found using HTML5.',
          draggable: true
        });



        var lat = position.coords.latitude
        var lng = position.coords.longitude
        document.getElementById('geo_latitude').value=lat;
        document.getElementById('geo_longitude').value=lng;

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

            var lat = event.latLng.lat()
            var lng = event.latLng.lng()

            var infowindow = new google.maps.InfoWindow({
                content: '<b><?php _e('Latitude:');?></b>' + lat + '<br><b><?php _e('Longitude:');?></b>' + lng
             });
            infowindow.open(map, marker);

            google.maps.event.addListener(marker, "dragstart", function() {

                infowindow.close();
             });

        document.getElementById('geo_latitude').value=lat;
        document.getElementById('geo_longitude').value=lng;


        });


        map.setCenter(pos);
      }, function() {
        handleNoGeolocation(true);
      });

    } else if (google.gears) {
        browserSupportFlag = true;
        var geo = google.gears.factory.create('beta.geolocation');
        geo.getCurrentPosition(function(position) {
          initialLocation = new google.maps.LatLng(position.latitude,position.longitude);
          map.setCenter(initialLocation);
        }, function() {
          handleNoGeoLocation(browserSupportFlag);
        });
      // Browser doesn't support Geolocation


      } else {
        browserSupportFlag = false;
        handleNoGeolocation(browserSupportFlag);
      }


      function handleNoGeolocation(errorFlag) {
        if (errorFlag == true) {
          alert("Geolocation service failed.");
          initialLocation = newyork;
        } else {
          alert("Your browser doesn't support geolocation. We've placed you in New York.");
          initialLocation = newyork;
        }
        map.setCenter(initialLocation);
      }


 map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
 }

  //-------------------------------------------------------End initialize

  function findAddress(address) {

var address = document.getElementById("address").value;

    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        var pos = results[0].geometry.location;

      } else {
        alert("Geocode was not successful for the following reason: " +   status);
      }
    });

}

回答by jenswirf

To 'move' your existing marker, you'll wanna make sure its global and then you can just update its position within the findAddress function with something like:

要“移动”您现有的标记，您需要确保它是全局的，然后您可以使用以下内容更新它在 findAddress 函数中的位置：

marker.setPosition(results[0].geometry.location);