拖放谷歌地图标记

Question

我已经制作了一个拖放功能，使用户可以从侧边栏拖动图标，并在他们放置图标时放置一个标记。

下面的实现似乎是实现它最好（也是唯一）的方法，但当网络速度慢时会出现问题，可能是因为mouseover事件中的lat / lng不够准确。

有人能提供我另一种方式吗？也许立即放置标记，然后使用内置地图拖放呢？

function placeMarker(lat, lng) {
  var marker = new google.maps.Marker({
    position: new google.maps.LatLng(lat, lng),
    draggable: true,
    map: map
  });
  return marker;
}

$(".icon").draggable({helper: 'clone',

  start: function(e, ui) {
    map.setOptions({draggable: false});
    $("#map").css('cursor', 'crosshair');
  },

  stop: function(e,ui) {
    map.setOptions({draggable: true});
    $("#map").css('cursor', 'default');

    google.maps.event.addListenerOnce(map, "mouseover", function(event) {
      var lat = event.latLng.lat(),
          lng = event.latLng.lng(),
          id = ui.helper.context.id;

      pointA = id === "pointA" && pointA === true 
                       ? pointA.setMap(null) : placeMarker(lat, lng); 

      pointB = id === "pointB" && pointB === true 
                       ? pointB.setMap(null) : placeMarker(lat, lng);
    });
  }
});

- seanbrodie

---

出现了哪些“问题”？ - user1752532

标记点需要很长时间才能放置，而且当放置时，它会被放在地图上错误的位置。 - seanbrodie

也许可以尝试使用 google.maps.Geocoder() 服务 https://developers.google.com/maps/documentation/javascript/geocoding - user1752532

Answer 1

问题在于使用mouseover事件时出现了解决方法。当使用mousemove事件时，问题得到了解决。

我认为这是一直以来应该使用的事件。低延迟显然会干扰初始的mouseover事件，导致针落下时无法触发。

希望这能帮助其他人。

- seanbrodie