MapControl

O MapControl apresenta um mapa simbólico e interativo da Terra alimentado por Azure Maps. Pode mostrar localizações, adicionar pinos e camadas personalizadas, e permitir que os utilizadores interajam com o mapa usando controlos de panorâmica, zoom, rotação e pitch.

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

Será este o controlo correto?

Use um MapControl quando quiser mostrar dados geográficos na sua aplicação, tais como:

  • Mostrar uma localização num mapa com um alfinete.
  • Exibindo uma coleção de pontos de interesse.
  • Proporcionando uma experiência interativa de mapa com zoom e panorâmica.

Crie um MapControl

Abre a aplicação WinUI 3 Gallery e vê o MapControl em ação

Ícone da Galeria WinUI 3 A aplicação WinUI 3 Gallery inclui exemplos interativos de controlos e funcionalidades WinUI. Descarrega a aplicação na Microsoft Store ou navega pelo código-fonte no GitHub.

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

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

Definir a localização do mapa

Defina as propriedades Center e ZoomLevel para controlar o que é exibido no mapa.

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

Usa o MapIcon para mostrar os alfinetes no mapa. Adicione ícones a um MapElementsLayer e depois adicione a camada à coleção de Camadas 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 esconder controlos interativos

A propriedade InteractiveControlsVisible controla se o mapa apresenta controlos de sobreposição incorporados para zoom, rotação, inclinação e estilo do mapa.

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

Gerir cliques em elementos do mapa

Subscreva o evento MapElementClick para responder quando o utilizador clicar num elemento do mapa, como um pin.

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

Lidar com erros de serviço de mapas

Subscreva o evento MapServiceErrorOccurred para detetar problemas de comunicação com o serviço de mapas, como um MapServiceToken inválido ou em falta.

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