API do Google Map V3: como adicionar dados personalizados aos marcadores

116

Existe uma maneira de adicionar algumas informações personalizadas aos meus marcadores para uso posterior. Existem maneiras de ter uma janela de informações e um título, mas e se eu quiser associar o marcador a outras informações.

Tenho outras coisas sendo exibidas na página que dependem dos marcadores, então quando um marcador é clicado, o conteúdo da página tem que mudar dependendo de qual marcador foi clicado. Gostaria de armazenar e recuperar os dados personalizados assim que um marcador for, digamos clicado etc.

obrigado

Uma aposta
fonte

Respostas:

213

Como o Google Marker é um objeto JavaScript, você pode adicionar informações personalizadas no formulário key: value, onde a chave é uma string válida. Elas são chamadas de propriedades do objeto e podem ser abordadas de muitas maneiras diferentes. O valor pode ser qualquer coisa legal, tão simples como números ou strings, e também funções ou mesmo outros objetos. Três maneiras simples: na declaração, notação de ponto e colchetes

var markerA = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(0, 0),
    customInfo: "Marker A"
});

var markerB = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(-10, 0)
});
markerB.customInfo = "Marker B";

var markerC = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(-20, 0)
});
markerC['customInfo'] = "Marker C";

Então, para recuperá-lo de maneira semelhante:

google.maps.event.addListener(markerA, 'click', function() {
    alert(this.customInfo);
});
Tina CG Hoehr
fonte
3
Não há nada na documentação formalizando esse padrão. Esperamos que eles o façam, em vez de quebrá-lo em uma versão posterior.
Adam
1
A propriedade 'customInfo' não existe no tipo 'Marker'.
alehn96 de
1
Se você estiver usando o texto datilografado, convém usar os colchetes em vez do ponto para atribuir tais propriedades
Cocoduf
14

Você pode adicionar suas próprias propriedades personalizadas aos marcadores (apenas tome cuidado para não entrar em conflito com as propriedades da API).

geocodezip
fonte