MapControl

MapControl visar en symbolisk, interaktiv karta över jorden som drivs av Azure Maps. Du kan visa platser, lägga till stift och anpassade lager och låta användare interagera med kartan med hjälp av panorerings-, zoom-, rotations- och pitch-kontroller.

MapControl kräver ett Azure Maps konto. Följ anvisningarna på Hantera ditt Azure Maps konto för att skapa ett konto och hämta en karttjänsttoken.

Är det här rätt kontroll?

Använd en MapControl när du vill visa geografiska data i din app, till exempel:

  • Visar en plats på en karta med en pin-kod.
  • Visar en samling intressanta platser.
  • Ger en interaktiv kartupplevelse med zoom och panorering.

Skapa en MapControl

Öppna WinUI 3-galleriappen och se mapcontrol i praktiken

WinUI 3-galleriikon WinUI 3-galleriappen innehåller interaktiva exempel på WinUI-kontroller och funktioner. Hämta appen från Microsoft Store eller bläddra i källkoden på GitHub.

Lägg till en MapControl på sidan och ange MapServiceToken till din Azure Maps nyckel.

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

Ange kartplatsen

Ange egenskaperna Center och ZoomLevel för att styra vad kartan visar.

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" />

Lägga till markörer på kartan

Använd MapIcon för att visa pushpins på kartan. Lägg till ikoner i en MapElementsLayer och lägg sedan till lagret i kartans lagersamling .

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);

Visa eller dölja interaktiva kontroller

Egenskapen InteractiveControlsVisible styr om kartan visar inbyggda överläggskontroller för zoom, rotation, tonhöjd och kartformat.

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

Hantera klick på kartelement

Prenumerera på MapElementClick-händelsen för att svara när användaren klickar på ett kartelement, till exempel en pin-kod.

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

Hantera karttjänstfel

Prenumerera på mapserviceErrorOccurred-händelsen för att identifiera problem med att kommunicera med karttjänsten, till exempel en ogiltig eller saknad MapServiceToken.

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