javascript - eliminar - google.maps.marker example

Google Maps v3-Eliminar vértice en el polígono

Question

Google Maps tiene la biblioteca de dibujos para dibujar polilíneas y polígonos y otras cosas.

Ejemplo de esta funcionalidad aquí: http://gmaps-samples-v3.googlecode.com/svn-history/r282/trunk/drawing/drawing-tools.html

Quiero, al dibujar y editar el polígono, poder eliminar un punto / vértice en la ruta. Los documentos API no parecen dar pistas sobre nada.

Answer 1

Encontré el código de Sean muy simple y útil. Acabo de agregar un limitador para dejar de eliminar cuando el usuario tiene solo 3 nodos. Sin ella, el usuario puede acceder a un solo nodo y ya no puede editar más:

my_poly.addListener(''rightclick'', function(mev){
    if (mev.vertex != null && this.getPath().getLength() > 3) {
        this.getPath().removeAt(mev.vertex);
    }
});

Answer 2

Esta es actualmente una solicitud destacada (reconocida por Google), número 3760 .

Aquí está mi solución: http://jsbin.com/ajimur/10 . Utiliza una función que agrega un botón Eliminar al polígono pasado (debajo del botón Deshacer).

Alternativamente, alguien sugirió este enfoque: haga clic con el botón derecho para eliminar el vértice más cercano , que funciona bien, pero le falta algo de finura de UI. Construí el código del enlace para verificar si el clic estaba dentro (o dentro de 1 píxel) del nodo, en un JSBin aquí: http://jsbin.com/ajimur/ .

EDITAR: como señaló Amr Bekhit , este enfoque actualmente no funciona, ya que los eventos deben estar vinculados al polígono.

Answer 3

Google Maps ahora proporciona un objeto de devolución de llamada " PolyMouseEvent " en eventos que se desencadenan desde un Polígono o Polilínea.

Para aprovechar las otras respuestas que sugerían una solución que implica un clic derecho, todo lo que tendría que hacer es lo siguiente en las últimas versiones de la API V3:

// this assumes `my_poly` is an normal google.maps.Polygon or Polyline
var deleteNode = function(mev) {
  if (mev.vertex != null) {
    my_poly.getPath().removeAt(mev.vertex);
  }
}
google.maps.event.addListener(my_poly, ''rightclick'', deleteNode);

Notarás que ya no es necesario ningún cálculo complejo sobre si estamos cerca del punto o no, ya que la API de Google Maps ahora nos dice en qué vértice hemos hecho clic.

Nota: esto solo funcionará mientras Polyline / Polygon esté en modo de edición. (Que es cuando los vértices que desea eliminar son visibles)

Como reflexión final, podría considerar usar un evento de clic o doble clic en su lugar. "Hacer clic" es lo suficientemente inteligente como para no activarse en un arrastre, aunque el uso de un solo clic puede sorprender a algunos de tus usuarios.

Answer 4

Me encontré con situaciones en las que necesitaba eliminar nodos de polígonos que contenían múltiples rutas. Aquí hay una modificación del código de Sean y Evil:

shape.addListener(''rightclick'', function(event){
  if(event.path != null && event.vertex != null){
    var path = this.getPaths().getAt(event.path);
    if(path.getLength() > 3){
      path.removeAt(event.vertex);
    }
  }
});

Answer 5

Solo pensé en contribuir porque también estaba buscando una solución para esto, aquí está mi implementación:

if (m_event.hasOwnProperty(''edge'') && m_event.edge >= 0 &&
GeofenceService.polygon.getPath().getLength() > 3) {
    GeofenceService.polygon.getPath().removeAt(m_event.edge);
    return;
}

if (m_event.hasOwnProperty(''vertex'') && m_event.vertex >= 0 &&
GeofenceService.polygon.getPath().getLength() > 3) {
    GeofenceService.polygon.getPath().removeAt(m_event.vertex);
    return;
}

Esto permite manejar la eliminación de nodos de vértice Y nodos de borde, y mantiene un mínimo de un polígono de formación de triángulo en todo momento al verificar la longitud de ruta> 3.