Compartilhar via

MapControl

O MapControl exibe um mapa simbólico e interativo da Terra alimentado por Azure Maps. Você pode mostrar locais, adicionar pinos e camadas personalizadas e permitir que os usuários interajam com o mapa usando controles de painel, zoom, rotação e tom.

O MapControl requer uma conta Azure Maps. Siga as instruções em Age sua conta de Azure Maps para criar uma conta e obter um token de serviço de mapa.

Esse é o controle correto?

Use um MapControl quando quiser exibir dados geográficos em seu aplicativo, como:

  • Mostrando um local em um mapa com um marcador.
  • Exibindo uma coleção de pontos de interesse.
  • Fornecendo uma experiência interativa de mapa com zoom e navegação.

Criar um MapControl

Abra o aplicativo da Galeria do WinUI 3 e veja o MapControl em ação

Ícone da Galeria do WinUI 3 O aplicativo Da Galeria do WinUI 3 inclui exemplos interativos de controles e recursos do WinUI. Obtenha o aplicativo na Microsoft Store ou navegue pelo código-fonte em GitHub.

Adicione um MapControl à sua página e defina o MapServiceToken para sua chave de Azure Maps.

<MapControl x:Name="myMap"
            MapServiceToken="YOUR_AZURE_MAPS_TOKEN"
            Height="400" />

Definir o local do mapa

Defina as propriedades Central e ZoomLevel para controlar o que o mapa exibe.

using Windows.Devices.Geolocation;

var position = new BasicGeoposition { Latitude = 47.6062, Longitude = -122.3321 };
myMap.Center = new Geopoint(position);
myMap.ZoomLevel = 12;

<!-- Set initial center and zoom in XAML is not supported; set in code-behind -->
<MapControl x:Name="myMap"
            MapServiceToken="YOUR_AZURE_MAPS_TOKEN"
            Height="400" />

Adicionar pinos ao mapa

Use MapIcon para exibir alfinetes no mapa. Adicione ícones a um MapElementsLayer e adicione a camada à coleção Layers do mapa.

using Windows.Devices.Geolocation;
using Microsoft.UI.Xaml.Controls;
using System.Collections.Generic;

var position = new BasicGeoposition
{
    Latitude = 47.6062,
    Longitude = -122.3321
};

var icon = new MapIcon
{
    Location = new Geopoint(position),
};

var layer = new MapElementsLayer
{
    MapElements = new List<MapElement> { icon }
};

myMap.Layers.Add(layer);

Mostrar ou ocultar controles interativos

A propriedade InteractiveControlsVisible controla se o mapa exibe controles de sobreposição internos para zoom, rotação, tom e estilo de mapa.

<MapControl x:Name="myMap"
            MapServiceToken="YOUR_AZURE_MAPS_TOKEN"
            InteractiveControlsVisible="True"
            Height="400" />

Lidar com cliques em elementos do mapa

Inscreva-se no evento MapElementClick para responder quando o usuário clicar em um elemento do mapa, como um pino.

myMap.MapElementClick += (sender, args) =>
{
    foreach (var element in args.MapElements)
    {
        if (element is MapIcon clickedIcon)
        {
            // Handle the clicked icon
        }
    }
};

Gerenciar erros de serviço de mapa

Assine o evento MapServiceErrorOccurred para detectar problemas de comunicação com o serviço de mapa, como um MapServiceToken inválido ou ausente.

myMap.MapServiceErrorOccurred += (sender, args) =>
{
    // Log or display the error
    System.Diagnostics.Debug.WriteLine("Map service error occurred.");
};
  • Last updated on