Você está vendo a versão antiga da página. Ver a versão atual.

Comparar com o atual Ver Histórico da Página

Versão 1 Próxima »

Desenha polígono

Com o bloco, é possível desenhar um polígono por meio de uma lista de coordenadas no mapa e fazer algumas configurações na aparência.

Parâmetros

NomeTipoDoc
Parâmetro 1objetoRecebe o ID do componente Google Maps que foi inserido na view.
Parâmetro 2stringDefine um ID para o polígono de acordo com sua preferência.
Parâmetro 3lista

Recebe uma lista de coordenadas para definir os pontos do polígono.

Parâmetro 4string

Define a cor do preenchimento do polígono, podem ser nomeadas pelo nome (em inglês) ou no formato hexadecimal.

Exemplo: yellow ou #FFFF00

Parâmetro 5stringDefine a opacidade referente à cor do preenchimento, indo de 0 à 1.
Parâmetro 6string

Define a cor do contorno do polígono, podem ser nomeadas pelo nome (em inglês) ou no formato hexadecimal.

Exemplo: yellow ou #FFFF00

Parâmetro 7stringDefine a opacidade referente ao contorno, indo de 0 à 1.
Parâmetro 8objetoConfigurações avançadas para edições no polígono. Clique aqui para mais opções de configuração diferentes do exemplo.

Compatibilidade

 Cliente

Exemplo

Nesse exemplo, após criar o bloco com a função "pol", arrastaremos o bloco Desenha polígono, que receberá no seu parâmetro Id do mapa o id do componente Google Maps que está na view e no parâmetro Id do polígono, defina um ID de sua preferência - nesse caso usaremos "poli"; no parâmetro Lista de coordenadas, arrastaremos o bloco criar lista com para criarmos uma lista, onde cada coordenada recebida será um ponto no mapa e, com isso, arrastaremos para a lista o bloco Criar coordenada passando a Latitude e Longitude como na figura 1. Após isso, em Cor do preenchimento, colocaremos "gray" para colocar a cor do círculo; em Opacidade do preenchimento, colocaremos 0.4 para ficar um pouco transparente e no parâmetro Cor do contorno, colocaremos "black" e definiremos a Opacidade do contorno em 1, onde não é nada transparente; em Opções avançadas, colocaremos o bloco de código abaixo para liberar uma interação de arrastar pontos no mapa, como na figura 2.

{ "editable": true }


Figura 1 - Bloco Desenha polígono


Figura 2 - Retorno no mapa após a execução da função referente à figura 1

e demonstração do arrastar referente à opção avançada

Mais sobre o bloco

Para mais informações sobre o bloco e o funcionamento geral do componente Google Maps, acesse nossa doc Usando a API do Google Maps em seu projeto.

  • Sem rótulos