google-maps-api-3 - muchos - multiples rutas google maps api

Google Maps Api 3 Eliminar solo el marcador seleccionado

Question

Tengo 2 funciones de la siguiente manera:

function addMarker() {
marker = new google.maps.Marker({
position: Gpoint,
map: map,
draggable: true,
animation: google.maps.Animation.DROP
});
map.panTo(Gpoint);
google.maps.event.addListener(marker, "rightclick",
function (point) {
showContextMarker(point.latLng); } );
$(''.contextmenu'').remove();
};
function delMarker() { marker.setMap(null); $(''.contextmenu'').remove(); };

Entonces, como puedo entender, tengo un menú contextual con la opción "Eliminar marcador" en él. Estoy vinculando a un oyente de "clic derecho" durante la adición de un marcador, para mostrar este menú.

Todo está funcionando sin ningún problema hasta este momento.

Pero cuando trato de hacer clic en un marcador para borrar; se está efectuando sólo el último marcador añadido. Cuando vuelva a intentarlo; no pasa nada.

Así que mi idea es obtener el ID del marcador pulsado (o algo que pueda ser útil) y ejecutar esta función de eliminación de acuerdo con esto.

Brevemente; Quiero eliminar el marcador en el que hice clic, de un mapa que tiene varios marcadores.

¿Tienes algún enfoque para resolver este problema?

¡Gracias por adelantado!

Resuelto

Aquí está la solución. Gracias Fatih. Era imposible sin su guía:

var id;
var markers = {};
var addMarker = function () {
marker = new google.maps.Marker({
position: Gpoint,
map: map,
draggable: true,
animation: google.maps.Animation.DROP
});
map.panTo(Gpoint);
id = marker.__gm_id
markers[id] = marker;
google.maps.event.addListener(marker, "rightclick", function (point) { id = this.__gm_id; delMarker(id) });
}
var delMarker = function (id) {
marker = markers[id];
marker.setMap(null);
}

Llamar a la función de eliminación mediante: delMarker(id) Ps: " delMarker(id) clic derecho es suficiente en este caso"

¡Gracias!

Answer 1

Complementando la respuesta @Fatih deberías gestionar los marcadores. Por ejemplo, podría agregar cada marcador en una matriz y luego, para eliminar, podría encontrar este marcador en la matriz y establecer el valor en el mapa como nulo.

Answer 2

Por cambios mínimos

var newid=0;
for (var index in results){
var marker = new google.maps.Marker({
map: map,
icon: image,
__gm_id: = newid+1,
});
}

Ahora el marcador [''__ gm_id''] todavía tiene un valor

Answer 3

Simplemente pase su marcador en la función de clic derecho. Por ejemplo:

var marker = new google.maps.Marker({
position: event.latLng,
map: map,
draggable: true,
title: ''Hello World!''
});
google.maps.event.addListener(marker, "rightclick", function (point) {delMarker(marker)});

Y haz que la función se vea esto:

var delMarker = function (markerPar) {
markerPar.setMap(null);
}

Tus marcadores serán removibles en los clics correctos.

Answer 4

esto funcionó para mí:

un segundo currentId, si tienes una mejor idea, házmelo saber

var actualMarkerId = 0;
var currentId = 0;
if (actualMarkerId>0) {
deleteMarker(actualMarkerId);
console.log(actualMarkerId);
}
var id = uniqueId(); // get new id
actualMarkerId = id;

Answer 5

Muestra de trabajo en jsFiddle

Google Maps no gestiona tus marcadores. Así que todos tus marcadores deben ser manejados por ti mismo.

Haga un objeto marcador global y empuje todos los marcadores a este objeto. Y asigne una identificación única a cada marcador al obtener una instancia de marcador. Luego, cuando desee eliminar un marcador, tome su id, busque este marcador en el objeto marcador global y, finalmente, llame al método setMap de esta instancia de marcador pasando un argumento nulo.

También he añadido una demo que funciona en jsFiddle. El código está muy documentado.

Tu código psuedo debería ser así. Para obtener un código más detallado, consulte la demostración.

var currentId = 0; var uniqueId = function() { return ++currentId; } var markers = {}; var createMarker = function() { var id = uniqueId(); // get new id var marker = new google.maps.Marker({ // create a marker and set id id: id, position: Gpoint, map: map, draggable: true, animation: google.maps.Animation.DROP }); markers[id] = marker; // cache created marker to markers object with id as its key return marker; } var deleteMarker = function(id) { var marker = markers[id]; // find the marker by given id marker.setMap(null); }