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
| Nome | Tipo | Doc |
|---|---|---|
| Parâmetro 1 | objeto | Recebe o ID do componente Google Maps que foi inserido na view. |
| Parâmetro 2 | string | Define um ID para o polígono de acordo com sua preferência. |
| Parâmetro 3 | lista | Recebe uma lista de coordenadas para definir os pontos do polígono. |
| Parâmetro 4 | string | 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 5 | string | Define a opacidade referente à cor do preenchimento, indo de 0 à 1. |
| Parâmetro 6 | string | 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 7 | string | Define a opacidade referente ao contorno, indo de 0 à 1. |
| Parâmetro 8 | objeto |
Recebe um objeto contendo opções de customização no polígono. |
Acesse a documentação oficial para mais detalhes. Exemplo de uso: |
Compatibilidade
Cliente
Exemplo
Nesse exemplo, após após criar o bloco com a função função "pol", arrastaremos o bloco Desenha polígono, que receberá no seu parâmetro Id do mapa o , o id do componente componente Google Maps Maps que está na view e ; no parâmetro 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 parâmetro Cor do contorno, colocaremos "black" e ; definiremos a Opacidade do contorno em 1, onde não é nada transparente; , por fim, 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.
| Bloco de código |
|---|
{ "editable": true } |
Figura 1 - Bloco Desenha polígono
Figura 2 - Retorno no mapa após a execução da função referente à figura 1 1
e demonstração do arrastar referente à opção avançada
| Informações | ||
|---|---|---|
| ||
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. |