it-swarm-pt.tech

Api 3 do Google Maps Apenas remover marcador selecionado

Eu tenho 2 funções como abaixo:

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(); };

Então, como você pode entender, eu tenho um menu de contexto com a opção "Excluir marcador". Estou vinculando um ouvinte "clique direito" durante a adição de um marcador, para mostrar este menu.

Tudo está funcionando sem nenhum problema até o momento.

Mas quando tento clicar em um marcador para excluir; está efetuando apenas o último marcador adicionado. Quando eu tento novamente; nada acontece.

Então, minha ideia é obter o ID do marcador clicado (ou algo que possa ser útil) e executar essa função de exclusão de acordo com isso.

Resumidamente; Quero excluir o marcador em que clicou, de um mapa com vários marcadores.

Você tem alguma abordagem para resolver esse problema?

Desde já, obrigado!

RESOLVIDO!

Aqui está a solução. Obrigado Fatih. era impossível sem a sua orientação:

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);
}

Chamando a função delete por: delMarker(id) Ps: "Clicar com o botão direito do mouse é suficiente neste caso"

Obrigado!

22
MrGorki

Exemplo de trabalho em jsFiddle


O Google Maps não gerencia seus marcadores. Portanto, todos os seus marcadores devem ser gerenciados por você mesmo.

Crie um objeto marcador global e empurre todos os marcadores para esse objeto. E forneça um ID exclusivo para cada marcador ao obter uma instância de marcador. Então, quando você desejar excluir um marcador, pegue seu ID e encontre-o no objeto marcador global e, finalmente, chame o método setMap dessa instância de marcador com o argumento nulo de passagem.

Também adicionei uma demonstração que funciona no jsFiddle. O código está fortemente documentado.

Seu código psuedo deve ser assim. Para obter um código mais detalhado, consulte a demonstração.

 var currentId = 0; 
 var uniqueId = function () {
 retorna ++ currentId; 
} 
 
 var markers = {}; 
 var createMarker = function () {
 var id = uniqueId (); // obtém um novo ID 
 var marker = new google.maps.Marker ({// cria um marcador e define o ID 
 id: id, 
 posição: Gpoint, 
 map: map, 
 arrastável: true, 
 animação: google.maps.Animation.DROP 
}); 
 marcadores [id] = marcador; // cache criado marcador para marcadores de objeto com id como sua chave 
 retornar marcador; 
} 
 var deleteMarker = função (id) {
 var marker = markers [ Eu iria]; // localiza o marcador pelo ID fornecido 
 marker.setMap (null); 
} 
43
Fatih

Complementando a resposta @Fatih, você deve gerenciar os marcadores. Por exemplo, você pode adicionar cada marcador em uma matriz e, em seguida, para remover, você pode encontrar esse marcador na matriz e definir o valor no mapa como nulo.

2
Jorge

Basta passar seu marcador na função clique direito. Por exemplo:

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)});

E faça a função parecer assim:

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

Seus marcadores serão removíveis com o botão direito.

2
Vinícius Biavatti

isso funcionou para mim:

um segundo currentId, se você tiver uma idéia melhor, me avise

var actualMarkerId = 0;
var currentId = 0;



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

Simples, use matriz global para objetos de marcador. Empurre o objeto marcador nessa matriz ao traçar o marcador. Sim, podemos usar o ID no objeto marcador para referência exclusiva.

Código como abaixo

MarkerArray = []

marker = new google.maps.Marker({
         Id: 1,
         position: new google.maps.LatLng(Lat,Long),
         type: 'info'         
          });

MarkerArray.Push(marker);

Para remover um marcador específico, localize esse índice de elemento usando o ID exclusivo para cada marcador.

var MarkerIndex = MarkerArray.findIndex(function GetIndex(element) {
            return element.Id == 1;
});    
MarkerArray[MarkerIndex].setMap(null);
MarkerArray.splice(MarkerIndex, 1); // to remove element from global array
0
Vigneh Sundar

Para alterações mínimas

var newid=0;

for (var index in results){

var marker = new google.maps.Marker({

map: map,
icon: image,

__gm_id: = newid+1,

});
}

Agora o marcador ['__ gm_id'] ainda tem um valor

0
user1426141