0

Utilizo o pacote cornford google googlmapper do laravel onde toda inteligencia fica no controller e maoa passa para a view via java script renderizado, preciso inserir legenda no marcador do mapa para que fique igual ao exemplo abaixo:inserir a descrição da imagem aqui

1 Resposta 1

0

A manipulação de textos no mark é bem complexa e limitada. Não encontrei forma de fazer isso, a não ser pelo uso da biblioteca markerwithlabel.

Utilizando a mesma basta você criar o markwithlabel:

js:

marker = new MarkerWithLabel({
                        position: new google.maps.LatLng(point.Latitude, point.Longitude),
                        icon: icon.jpg,
                        labelContent: "Ponto de chegada",
                        labelAnchor: new google.maps.Point(62, 42),
                        labelClass: "my-custom-class-for-label",
                        map: map
                    });

E criar a classe que responde a formação dele:

.my-custom-class-for-label {
            text-align: left;
            font-weight: bold;
            font-size: 20px;
            color: #fff;
        }

Lembrando que é importante que você inclua os scripts da mesma em seu projeto, você pode copiar este js (https://github.com/LuizSD/mapsWithUrlParam/blob/master/js/markerwithlabel.js)

Exemplo de uso: https://github.com/LuizSD/mapsWithUrlParam

Texto explicando uso: https://medium.com/@barvysta/google-marker-api-lets-play-level-1-dynamic-label-on-marker-f9b94f2e3585

4
  • Desde já agradeço mais não funcionou, não sei porque essas parte não está funcionando: labelContent: "Ponto de chegada", labelAnchor: new google.maps.Point(62, 42), labelClass: "my-custom-class-for-label", 12/09/2017 às 16:11
  • Opa, você chegou a incluir a biblioteca github.com/LuizSD/mapsWithUrlParam/blob/master/js/… é preciso colocar ela no seu projeto. Só assim será possível instanciar um objeto do tipo MarkerWithLabel. 12/09/2017 às 17:28
  • Neste objeto você consiguira utilizar os atributos labelClass e labelContent. Que são o conteudo da label e a classe que ela respeita 12/09/2017 às 17:29
  • Importei a Biblioteca, quando uso: new google.maps.Marker o marcador aparece como no exemplo mais quando uso: MarkerWithLabel a imagem some não aparece 13/09/2017 às 18:32

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 .