Eventos de ferramentas de desenho

Artigo
09/03/2024

Ao usar ferramentas de desenho em um mapa, é útil responder a alguns eventos enquanto o usuário desenha no mapa. Esta tabela lista todos os eventos compatíveis com a classe DrawingManager.

Evento	Descrição
`drawingchanged`	Acionado quando qualquer coordenada em uma forma é adicionada ou alterada.
`drawingchanging`	Acionado quando qualquer coordenada de visualização em uma forma está sendo exibida. Por exemplo, esse evento é acionado várias vezes enquanto uma coordenada é arrastada.
`drawingcomplete`	Acionado quando uma forma conclui o desenho ou é retirada do modo de edição.
`drawingerased`	Acionado quando uma forma é apagada do gerenciador de desenho quando está no modo `erase-geometry`.
`drawingmodechanged`	Acionado quando o modo de desenho é alterado. O novo modo de desenho é passado para o manipulador de eventos.
`drawingstarted`	Acionado quando o usuário começa a desenhar uma forma ou coloca uma forma no modo de edição.

Para obter um exemplo de trabalho completo de como exibir dados de uma fonte de peça de vetor no mapa, consulte Eventos da ferramenta de desenho em Exemplos do Azure Mapas. Este exemplo permite que você desenhe formas no mapa e observe os eventos serem acionados. Para obter o código-fonte deste exemplo, consulte Código de exemplo de eventos de ferramentas de desenho.

A imagem a seguir mostra uma captura de tela do exemplo de um trabalho completo que demonstra como os eventos no módulo Ferramentas de Desenho funcionam.

Exemplos

Vamos ver alguns cenários comuns que usam os eventos de ferramentas de desenho.

Selecionar pontos na área de polígono

Este código demonstra como monitorar um evento de maneiras de desenho de um usuário. Neste exemplo, o código monitora formas de polígonos, retângulos e círculos. Em seguida, determina quais pontos de dados no mapa estão dentro da área desenhada. O evento drawingcomplete é usado para disparar a lógica de seleção. Na lógica de seleção, o código executa um loop em todos os pontos de dados no mapa. Ele verifica se há uma interseção do ponto e a área da forma desenhada. Este exemplo usa a biblioteca de software livre Turf.js para fazer um cálculo de interseção espacial.

Para obter um exemplo completo de como usar as ferramentas de desenho para desenhar áreas de polígono no mapa com pontos dentro delas que podem ser selecionados, confira como Selecionar dados na área de polígono desenhada nos Exemplos do Azure Mapas. Para obter o código-fonte desse exemplo, consulte Selecionar dados no código de exemplo da área do polígono desenhado.

Desenho e pesquisa na área de polígono

Esse código procura pontos de interesse dentro da área de uma forma depois que o usuário termina de desenhar a forma. O evento drawingcomplete é usado para disparar a lógica de pesquisa. Se o usuário desenha um retângulo ou um polígono, uma pesquisa dentro da geometria é executada. Se um círculo é desenhado, a posição do raio e do centro é usada para realizar uma pesquisa de ponto de interesse. O evento drawingmodechanged é usado para determinar quando o usuário alterna para o modo de desenho e limpa a tela de desenho.

Para obter um exemplo de trabalho completo de como usar as ferramentas de desenho para pesquisar pontos de interesse em áreas desenhadas, confira como Desenhar e pesquisar áreas de polígono nos Exemplos do Azure Mapas. Para o código-fonte deste exemplo, consulte [Código de exemplo para desenhar e buscar a área do polígono].

Criar uma ferramenta de medição

O código abaixo mostra como os eventos de desenho podem ser usados para criar uma ferramenta de medição. O drawingchanging é usado para monitorar a forma enquanto ela é desenhada. À medida que o usuário move o mouse, as dimensões da forma são calculadas. O evento drawingcomplete é usado para fazer um cálculo final na forma após a conclusão do desenho. O evento drawingmodechanged é usado para determinar quando o usuário alterna para um modo de desenho. Além disso, o evento drawingmodechanged limpa a tela de desenho e as informações de medição antigas.

Para obter um exemplo de trabalho completo de como usar as ferramentas de desenho para medir distâncias e áreas, confira como Criar uma ferramenta de medição nos Exemplos do Azure Mapas. Para obter o código-fonte desta amostra, consulte Criar um código de amostra de ferramenta de medição.