0

Fala pessoal, tudo bem? estou trabalhando no maps da Google, pegando os clientes no meu banco e colocando os Markers no mapa conforme sua latitude e longitude, quando clica no marker abre uma janela exibindo informações, até aqui tudo bem, o meu problema é:

quando eu clico em algum marker, ele sempre abre o ultimo

meu codigo:

JS

$.ajax({                                      
                url: url, 
                format: 'json',
                success: function(rows){
                        rows = $.parseJSON(rows);
                        for (var i in rows){    
                                var row = rows[i],          
                                    id = row[0],
                                    nome = row[1],
                                    lat = row[9],
                                    lon = row[10];
                                    codigo += '';

Aqui começa o marker - 1ª - pego a posicao

                                    var Posicao = new google.maps.LatLng(lat,lon);

2ª - faço o Marker

                                    var Marker = new google.maps.Marker({
                                            position: Posicao,
                                            map: map,
                                            center: Posicao,
                                            icon: imagemPin,
                                            title:"LUGAR",
                                            zIndex: 3});

3ª - as info da janela

                                    var textoInfo = "<img src='img/logo.png' style='width: 60%;'><p>Ola"+nome+", voce ta por aqui!</p>";                

                                    var infoLocal = new google.maps.InfoWindow({
                                        content: textoInfo
                                    });

4ª - aqui o evento quando eu clicar em um Marker

                                    google.maps.event.addListener(Marker, "click", function() {
                                        infoLocal.open(map,Marker);
                                    });

                                    //END MARKER

                        } 
                } 
            });

1 Resposta 1

1

O problema está lá no final, no evento:

google.maps.event.addListener(Marker, "click", function() {
    infoLocal.open(map,Marker);
});

Acontece que no momento do clique, Marker já não é mais aquele que você espera, e sim o último do loop. Trata-se do problema discutido na pergunta Como usar o valor atual de uma variável numa função mais interna?

Solução rápida:

google.maps.event.addListener(Marker, "click", (function(mrk, info) {
    return function() {
        info.open(map,mrk);
    };
}(Marker, infoLocal)));

O que o código acima faz é criar uma função anônima e invocá-la imediatamente, passando o Marker atual. Dentro dessa função ele tem um novo nome, mrk, que será "lembrado" (via closure) separadamente para cada iteração do seu loop. Essa função gera e retorna o listener que é passado ao google.maps.event.addListener.

4
  • ta dando esse erro: Uncaught SyntaxError: Unexpected token ; - no final ali : (Marker));
    – Furlan
    Commented 8/08/2014 às 19:55
  • Corrigido, tente agora
    – bfavaretto
    Commented 8/08/2014 às 20:05
  • obrigado @bfavaretto, seu codigo esta correto, funcionou!
    – Furlan
    Commented 11/08/2014 às 11:24
  • Atualizei a resposta, precisava fazer o mesmo com o conteúdo.
    – bfavaretto
    Commented 11/08/2014 às 14:10

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .