/
Desenha círculo / Draw circle

Desenha círculo / Draw circle

Função que desenha uma área circular no mapa.

Figura 1 - Bloco Desenha círculo

 

Este bloco faz parte do plugin Google Maps Api. Para visualizá-lo, é necessário instalar o plugin.

Compatibilidade

  • Bloco cliente: cronapi.maps.drawCircle()

Retorno

O bloco não possui retorno

Parâmetros

Id do mapa

Identificador (id) do componente Google Maps. Para selecioná-lo, é necessário vincular o bloco de programação a um formulário de referência, confira no tópico "Propriedades do Blockly" da documentação Bloco de Programação.

  • Posição: 1

  • Inglês: Map Id

  • Tipo: Objeto / Object

  • Exemplo: "map5108"

 

O campo "Identificador" correto a ser utilizado deve seguir o padrão "map" + quatro números aleatórios (ex: map5108). Para mais detalhes, consulte o tópico "Identificador" da documentação Usando a API do Google Maps em seu projeto

Id do círculo

Define um ID para o círculo de acordo com sua preferência.

  • Posição: 2

  • Inglês: Circle Id

  • Tipo: Texto / String

  • Exemplo: "IdCírculo"

Ponto central

Define o ponto em que o círculo ficará no mapa. Deve-se utilizar o retorno do bloco Criar coordenada.

  • Posição: 3

  • Inglês: Central point

  • Tipo: Objeto / Object

  • Exemplo: utilize o bloco Criar coordenada

Tamanho do raio

Define o tamanho do raio do círculo.

  • Posição: 4

  • Inglês: Radius size

  • Tipo: Texto / String

  • Exemplo:  "250"

Cor de preenchimento

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

  • Posição: 5

  • Inglês: Fill color

  • Tipo: Texto / String

  • Exemplo: "yellow" ou "#FFFF00"

Cor do contorno

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

  • Posição: 6

  • Inglês: Stroke color

  • Tipo: Texto / String

  • Exemplo: "yellow" ou "#FFFF00"

Opacidade do preenchimento

Define a opacidade referente à cor do preenchimento, indo de 0 à 1.

  • Posição: 7

  • Inglês: Opacity of filling

  • Tipo: Texto / String

  • Exemplo: "0.5"

Opções avançadas

Recebe um objeto contendo opções de customização no círculo. Acesse a documentação oficial para mais detalhes.

  • Posição: 8

  • Inglês: Advanced options

  • Tipo: Objeto / Object

  • Exemplo: "{"editable": true}"

Exemplo

No exemplo da figura abaixo, estamos desenhando um círculo nas coordenadas passadas através do bloco de programação Criar coordenada no parâmetro "Ponto central". Em Opções avançadas, inserimos o bloco de código abaixo para liberar uma interação de arrastar pontos no mapa.

{ "editable": true }

Figura 2 - Exemplo de uso do bloco Desenha círculo

 

O primeiro botão exibido na figura abaixo corresponde à função Inicializar Mapa. Ele deve ser acionado antes de ativar o botão "Desenhar Círculo", caso contrário, o mapa não será exibido.

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

Nesta página