Překrýt dlaždicové obrázky na mapu

Důležité

Rozhraní API MapControl pro UWP a platformy Windows Maps (Windows.Services.Maps.*) jsou zastaralá a nemusí být dostupná v budoucích verzích Windows. Další informace najdete v tématu Zdroje informací o zastaralých funkcích.

Důležité

Vyřazení služeb Bing Maps for Enterprise

MapControl pro UWP a mapové služby z oboru názvů Windows.Services.Maps závisí na mapách Bing. Mapy Bing pro velké organizace jsou zastaralé a vyřadí se z provozu. V tomto okamžiku už MapControl a služby nebudou přijímat data.

Další informace najdete v centru pro vývojáře Map Bing a dokumentaci k Mapám Bing.

Poznámka:

MapControl a mapové služby vyžadují ověřovací klíč mapy s názvem MapServiceToken. Další informace o získání a nastavení ověřovacího klíče mapy najdete v tématu Žádost o ověřovací klíč mapy.

Překryjte na mapě obrázky třetích stran nebo vlastní dlaždicové obrázky pomocí zdrojů dlaždic. Použití zdrojů dlaždic k překrytí specializovaných informací, jako jsou data o počasí, data populace nebo seismická data; nebo použijte zdroje dlaždic k úplné nahrazení výchozí mapy.

Přehled dlaždicových obrázků

Mapové služby, jako jsou Mapy Bing, vystřihnou mapy na čtvercové dlaždice pro rychlé načtení a zobrazení. Tyto dlaždice mají velikost 256 x 256 pixelů a jsou předem vykreslené na několika úrovních detailů. Mnoho služeb třetích stran také poskytuje mapová data, která jsou vyříznutá do dlaždic. Pomocí zdrojů dlaždic můžete načíst dlaždice od třetích stran nebo vytvořit vlastní dlaždice a překrýt je na mapě zobrazené v MapControl.

Když používáte zdroje dlaždic, nemusíte psát kód pro vyžádání nebo umístění jednotlivých dlaždic. MapControl vyžaduje dlaždice podle potřeby. Každý požadavek určuje souřadnice X a Y a úroveň přiblížení pro jednotlivé dlaždice. Jednoduše zadáte formát identifikátoru URI nebo názvu souboru, který se má použít k načtení dlaždic ve vlastnosti UriFormatString . To znamená, že do základního identifikátoru URI nebo názvu souboru vložíte nahraditelné parametry, které označují, kam se mají předat souřadnice X a Y a úroveň přiblížení pro každou dlaždici.

Zde je příklad vlastnosti UriFormatString pro HttpMapTileDataSource, která zobrazuje nahraditelné parametry souřadnic X a Y a úroveň přiblížení.

http://www.<web service name>.com/z={zoomlevel}&x={x}&y={y}

(Souřadnice X a Y představují umístění jednotlivých dlaždic v mapě světa na zadané úrovni podrobností. Systém číslování dlaždic začíná od {0, 0} v levém horním rohu mapy. Například dlaždice na {1, 2} je ve druhém sloupci třetího řádku mřížky dlaždic.)

O systému dlaždic, který je používán v mapových službách, najdete další informace v tématu Bing Maps Tile System.

Překryvné dlaždice ze zdroje dlaždic

Překryjte obrázky z dlaždicového zdroje na mapě pomocí MapTileDataSource.

1. Vytvořte instanci jedné ze tří tříd datových zdrojů dlaždic, dědících z MapTileDataSource.

   • HttpMapTileDataSource
   • LocalMapTileDataSource
   • CustomMapTileDataSource

   Nakonfigurujte UriFormatString, který lze použít k vyžádání dlaždic, vložením nahraditelných parametrů do základního identifikátoru URI nebo názvu souboru.

   Následující příklad vytvoří instanci HttpMapTileDataSource. Tento příklad určuje hodnotu UriFormatString v konstruktoru HttpMapTileDataSource.

       HttpMapTileDataSource dataSource = new HttpMapTileDataSource(
         "http://www.<web service name>.com/z={zoomlevel}&x={x}&y={y}");
   

2. Vytvořte instanci a nakonfigurujte MapTileSource. Zadejte MapTileDataSource, který jste nakonfigurovali v předchozím kroku, jako DataSource pro MapTileSource.

   Následující příklad určuje DataSource v konstruktoru MapTileSource.

       MapTileSource tileSource = new MapTileSource(dataSource);
   

   Podmínky, ve kterých se dlaždice zobrazují, můžete omezit pomocí vlastností MapTileSource.

   • Zobrazit dlaždice pouze v konkrétní geografické oblasti zadáním hodnoty pro vlastnost Bounds.
   • Zobrazit dlaždice pouze na určitých úrovních podrobností tím, že poskytnete hodnotu pro vlastnost ZoomLevelRange.

   Volitelně můžete nakonfigurovat další vlastnosti MapTileSource , které ovlivňují načítání nebo zobrazení dlaždic, jako je vrstva, AllowOverstretch, IsRetryEnabled a IsTransparencyEnabled.

3. Přidejte MapTileSource do kolekce TileSourcesMapControl.

        MapControl1.TileSources.Add(tileSource);
   

Překryvné dlaždice z webové služby

Překryjte dlaždice obrázků získané z webové služby pomocí HttpMapTileDataSource.

1. Vytvoření instance HttpMapTileDataSource

2. Zadejte formát identifikátoru URI, který webová služba očekává jako hodnotu vlastnosti UriFormatString . Pokud chcete tuto hodnotu vytvořit, vložte do základního identifikátoru URI nahraditelné parametry. Například v následující ukázce kódu je hodnota UriFormatString :

   http://www.<web service name>.com/z={zoomlevel}&x={x}&y={y}
   

   Webová služba musí podporovat identifikátor URI, který obsahuje nahraditelné parametry {x}, {y} a {zoomlevel}. Většina webových služeb (například Nokia, Bing a Google) podporuje Uris v tomto formátu. Pokud webová služba vyžaduje další argumenty, které nejsou k dispozici s UriFormatString vlastnost, musíte vytvořit vlastní identifikátor URI. Vytvořte a vraťte vlastní identifikátor URI zpracováním události UriRequested. Další informace najdete v části Zadání vlastního identifikátoru URI dále v tomto tématu.

3. Pak postupujte podle zbývajících kroků popsaných dříve v přehledu Dlaždicového obrázku.

Následující příklad překryje dlaždice z fiktivní webové služby na mapě Severní Ameriky. Hodnota UriFormatString je určena v konstruktoru HttpMapTileDataSource. V tomto příkladu se dlaždice zobrazují pouze v rámci geografických hranic určených volitelnou vlastností Bounds .

private void AddHttpMapTileSource()
{
    // Create the bounding box in which the tiles are displayed.
    // This example represents North America.
    BasicGeoposition northWestCorner =
        new BasicGeoposition() { Latitude = 48.38544, Longitude = -124.667360 };
    BasicGeoposition southEastCorner =
        new BasicGeoposition() { Latitude = 25.26954, Longitude = -80.30182 };
    GeoboundingBox boundingBox = new GeoboundingBox(northWestCorner, southEastCorner);

    // Create an HTTP data source.
    // This example retrieves tiles from a fictitious web service.
    HttpMapTileDataSource dataSource = new HttpMapTileDataSource(
        "http://www.<web service name>.com/z={zoomlevel}&x={x}&y={y}");

    // Optionally, add custom HTTP headers if the web service requires them.
    dataSource.AdditionalRequestHeaders.Add("header name", "header value");

    // Create a tile source and add it to the Map control.
    MapTileSource tileSource = new MapTileSource(dataSource);
    tileSource.Bounds = boundingBox;
    MapControl1.TileSources.Add(tileSource);
}

...
#include <winrt/Windows.Devices.Geolocation.h>
#include <winrt/Windows.UI.Xaml.Controls.Maps.h>
...
void MainPage::AddHttpMapTileSource()
{
    Windows::Devices::Geolocation::BasicGeoposition northWest{ 48.38544, -124.667360 };
    Windows::Devices::Geolocation::BasicGeoposition southEast{ 25.26954, -80.30182 };
    Windows::Devices::Geolocation::GeoboundingBox boundingBox{ northWest, southEast };

    Windows::UI::Xaml::Controls::Maps::HttpMapTileDataSource dataSource{
        L"http://www.<web service name>.com/z={zoomlevel}&x={x}&y={y}" };

    dataSource.AdditionalRequestHeaders().Insert(L"header name", L"header value");

    Windows::UI::Xaml::Controls::Maps::MapTileSource tileSource{ dataSource };
    tileSource.Bounds(boundingBox);

    MapControl1().TileSources().Append(tileSource);
}
...

void MainPage::AddHttpMapTileSource()
{
    BasicGeoposition northWest = { 48.38544, -124.667360 };
    BasicGeoposition southEast = { 25.26954, -80.30182 };
    GeoboundingBox^ boundingBox = ref new GeoboundingBox(northWest, southEast);

    auto dataSource = ref new Windows::UI::Xaml::Controls::Maps::HttpMapTileDataSource(
        "http://www.<web service name>.com/z={zoomlevel}&x={x}&y={y}");

    dataSource->AdditionalRequestHeaders->Insert("header name", "header value");

    auto tileSource = ref new Windows::UI::Xaml::Controls::Maps::MapTileSource(dataSource);
    tileSource->Bounds = boundingBox;

    this->MapControl1->TileSources->Append(tileSource);
}

Překryvné dlaždice z místního úložiště

Překryjte dlaždicové obrázky uložené jako soubory v místním úložišti pomocí LocalMapTileDataSource. Tyto soubory obvykle zabalíte a distribuujete do své aplikace.

1. Vytvoření instance LocalMapTileDataSource.

2. Zadejte formát názvů souborů jako hodnotu UriFormatString vlastnost. Pokud chcete tuto hodnotu vytvořit, vložte do základního názvu souboru nahraditelné parametry. Například v následující ukázce kódu je hodnota UriFormatString :

       Tile_{zoomlevel}_{x}_{y}.png
   

   Pokud formát názvů souborů vyžaduje další argumenty, které nejsou k dispozici s UriFormatString vlastnost, musíte vytvořit vlastní identifikátor URI. Vytvořte a vraťte vlastní identifikátor URI zpracováním události UriRequested. Další informace najdete v části Zadání vlastního identifikátoru URI dále v tomto tématu.

3. Pak postupujte podle zbývajících kroků popsaných dříve v přehledu Dlaždicového obrázku.

K načtení dlaždic z místního úložiště můžete použít následující protokoly a umístění:

Identifikátor URI	Další informace
ms-appx:///	Odkazuje na kořen instalační složky aplikace.
	Toto je umístění, na které odkazuje vlastnost Package.InstalledLocation.
ms-appdata:///local	Odkazuje na kořen místního úložiště aplikace.
	Toto je umístění, na které odkazuje vlastnost ApplicationData.LocalFolder.
ms-appdata:///temp	Odkazuje na dočasnou složku aplikace.
	Toto je umístění, na které odkazuje Vlastnost ApplicationData.TemporaryFolder .

Následující příklad načte dlaždice uložené jako soubory v instalační složce aplikace pomocí ms-appx:/// protokolu. Hodnota UriFormatString je zadána v konstruktoru LocalMapTileDataSource. V tomto příkladu jsou dlaždice zobrazeny pouze, když je úroveň přiblížení mapy v rozsahu, kterou určuje volitelná vlastnost ZoomLevelRange.

void AddLocalMapTileSource()
{
    // Specify the range of zoom levels
    // at which the overlaid tiles are displayed.
    MapZoomLevelRange range;
    range.Min = 11;
    range.Max = 20;

    // Create a local data source.
    LocalMapTileDataSource dataSource = new LocalMapTileDataSource(
        "ms-appx:///TileSourceAssets/Tile_{zoomlevel}_{x}_{y}.png");

    // Create a tile source and add it to the Map control.
    MapTileSource tileSource = new MapTileSource(dataSource);
    tileSource.ZoomLevelRange = range;
    MapControl1.TileSources.Add(tileSource);
}

Zadání vlastního identifikátoru URI

Pokud nahraditelné parametry dostupné u vlastnosti UriFormatString nebo vlastnosti HttpMapTileDataSource či vlastnosti UriFormatString nebo vlastnosti LocalMapTileDataSource nejsou dostatečné k načtení vašich dlaždic, pak je nutné vytvořit vlastní URI. Vytvořte a vraťte vlastní URI poskytnutím vlastní obslužné rutiny pro událost UriRequested. Událost UriRequested je vyvolána pro každou jednotlivou dlaždici.

1. Ve vlastní obslužné rutině události UriRequested zkombinujte požadované vlastní argumenty s vlastnostmi X, Ya ZoomLevel objektu MapTileUriRequestedEventArgs, abyste vytvořili vlastní identifikátor URI.
2. Vraťte vlastní identifikátor URI ve vlastnosti Uri objektu MapTileUriRequest, která je obsažena ve vlastnosti Request objektu MapTileUriRequestedEventArgs.

Následující příklad ukazuje, jak poskytnout vlastní URI vytvořením vlastní obslužné rutiny pro UriRequested událost. Také ukazuje, jak implementovat model odložení, pokud musíte udělat něco asynchronně k vytvoření vlastního identifikátoru URI.

using Windows.UI.Xaml.Controls.Maps;
using System.Threading.Tasks;
...
            var httpTileDataSource = new HttpMapTileDataSource();
            // Attach a handler for the UriRequested event.
            httpTileDataSource.UriRequested += HandleUriRequestAsync;
            MapTileSource httpTileSource = new MapTileSource(httpTileDataSource);
            MapControl1.TileSources.Add(httpTileSource);
...
        // Handle the UriRequested event.
        private async void HandleUriRequestAsync(HttpMapTileDataSource sender,
            MapTileUriRequestedEventArgs args)
        {
            // Get a deferral to do something asynchronously.
            // Omit this line if you don't have to do something asynchronously.
            var deferral = args.Request.GetDeferral();

            // Get the custom Uri.
            var uri = await GetCustomUriAsync(args.X, args.Y, args.ZoomLevel);

            // Specify the Uri in the Uri property of the MapTileUriRequest.
            args.Request.Uri = uri;

            // Notify the app that the custom Uri is ready.
            // Omit this line also if you don't have to do something asynchronously.
            deferral.Complete();
        }

        // Create the custom Uri.
        private async Task<Uri> GetCustomUriAsync(int x, int y, int zoomLevel)
        {
            // Do something asynchronously to create and return the custom Uri.        }
        }

Vrstvené dlaždice z vlastního zdroje

Překryjte vlastní dlaždice pomocí CustomMapTileDataSource. Vytvářejte dlaždice programově v paměti nebo můžete napsat vlastní kód pro načtení existujících dlaždic z jiného zdroje.

Chcete-li vytvořit nebo načíst vlastní dlaždice, zadejte pro událost BitmapRequested vlastní obslužnou rutinu. Událost BitmapRequested je vyvolána pro každou jednotlivou dlaždici.

1. Ve vlastní obslužné rutině pro událost BitmapRequested zkombinujte požadované vlastní argumenty s vlastnostmi X, Ya ZoomLevel z MapTileBitmapRequestedEventArgs, abyste vytvořili nebo načetli vlastní dlaždici.
2. Vraťte vlastní dlaždici ve vlastnosti PixelData objektu MapTileBitmapRequest, která je obsažena ve vlastnosti Request objektu MapTileBitmapRequestedEventArgs. PixelData vlastnost je typu IRandomAccessStreamReference.

Následující příklad ukazuje, jak poskytnout vlastní dlaždice vytvořením vlastního obslužného programu pro událost BitmapRequested. Tento příklad vytvoří identické červené dlaždice, které jsou částečně neprůhlené. Příklad ignoruje vlastnosti X, Y a ZoomLevelMapTileBitmapRequestedEventArgs. Ačkoli se nejedná o příklad z reálného světa, tento ukazuje, jak můžete na počkání vytvářet v paměti vlastní dlaždice. Tento příklad také ukazuje, jak implementovat model odložení, potřebujete-li něco provést asynchronně k vytvoření vlastních dlaždic.

using Windows.UI.Xaml.Controls.Maps;
using Windows.Storage.Streams;
using System.Threading.Tasks;
...
        CustomMapTileDataSource customDataSource = new CustomMapTileDataSource();
        // Attach a handler for the BitmapRequested event.
        customDataSource.BitmapRequested += customDataSource_BitmapRequestedAsync;
        customTileSource = new MapTileSource(customDataSource);
        MapControl1.TileSources.Add(customTileSource);
...
        // Handle the BitmapRequested event.
        private async void customDataSource_BitmapRequestedAsync(
            CustomMapTileDataSource sender,
            MapTileBitmapRequestedEventArgs args)
        {
            var deferral = args.Request.GetDeferral();
            args.Request.PixelData = await CreateBitmapAsStreamAsync();
            deferral.Complete();
        }

        // Create the custom tiles.
        // This example creates red tiles that are partially opaque.
        private async Task<RandomAccessStreamReference> CreateBitmapAsStreamAsync()
        {
            int pixelHeight = 256;
            int pixelWidth = 256;
            int bpp = 4;

            byte[] bytes = new byte[pixelHeight * pixelWidth * bpp];

            for (int y = 0; y < pixelHeight; y++)
            {
                for (int x = 0; x < pixelWidth; x++)
                {
                    int pixelIndex = y * pixelWidth + x;
                    int byteIndex = pixelIndex * bpp;

                    // Set the current pixel bytes.
                    bytes[byteIndex] = 0xff;        // Red
                    bytes[byteIndex + 1] = 0x00;    // Green
                    bytes[byteIndex + 2] = 0x00;    // Blue
                    bytes[byteIndex + 3] = 0x80;    // Alpha (0xff = fully opaque)
                }
            }

            // Create RandomAccessStream from byte array.
            InMemoryRandomAccessStream randomAccessStream =
                new InMemoryRandomAccessStream();
            IOutputStream outputStream = randomAccessStream.GetOutputStreamAt(0);
            DataWriter writer = new DataWriter(outputStream);
            writer.WriteBytes(bytes);
            await writer.StoreAsync();
            await writer.FlushAsync();
            return RandomAccessStreamReference.CreateFromStream(randomAccessStream);
        }

...
#include <winrt/Windows.Storage.Streams.h>
...
Windows::Foundation::IAsyncOperation<Windows::Storage::Streams::InMemoryRandomAccessStream> MainPage::CustomRandomAccessStream()
{
    constexpr int pixelHeight{ 256 };
    constexpr int pixelWidth{ 256 };
    constexpr int bpp{ 4 };

    std::array<uint8_t, pixelHeight * pixelWidth * bpp> bytes;

    for (int y = 0; y < pixelHeight; y++)
    {
        for (int x = 0; x < pixelWidth; x++)
        {
            int pixelIndex{ y * pixelWidth + x };
            int byteIndex{ pixelIndex * bpp };

            // Set the current pixel bytes.
            bytes[byteIndex] = (byte)(std::rand() % 256);        // Red
            bytes[byteIndex + 1] = (byte)(std::rand() % 256);    // Green
            bytes[byteIndex + 2] = (byte)(std::rand() % 256);    // Blue
            bytes[byteIndex + 3] = (byte)((std::rand() % 56) + 200);    // Alpha (0xff = fully opaque)
        }
    }

    // Create RandomAccessStream from byte array.
    Windows::Storage::Streams::InMemoryRandomAccessStream randomAccessStream;
    Windows::Storage::Streams::IOutputStream outputStream{ randomAccessStream.GetOutputStreamAt(0) };
    Windows::Storage::Streams::DataWriter writer{ outputStream };
    writer.WriteBytes(bytes);

    co_await writer.StoreAsync();
    co_await writer.FlushAsync();

    co_return randomAccessStream;
}
...

InMemoryRandomAccessStream^ TileSources::CustomRandomAccessStream::get()
{
    int pixelHeight = 256;
    int pixelWidth = 256;
    int bpp = 4;

    Array<byte>^ bytes = ref new Array<byte>(pixelHeight * pixelWidth * bpp);

    for (int y = 0; y < pixelHeight; y++)
    {
        for (int x = 0; x < pixelWidth; x++)
        {
            int pixelIndex = y * pixelWidth + x;
            int byteIndex = pixelIndex * bpp;

            // Set the current pixel bytes.
            bytes[byteIndex] = (byte)(std::rand() % 256);        // Red
            bytes[byteIndex + 1] = (byte)(std::rand() % 256);    // Green
            bytes[byteIndex + 2] = (byte)(std::rand() % 256);    // Blue
            bytes[byteIndex + 3] = (byte)((std::rand() % 56) + 200);    // Alpha (0xff = fully opaque)
        }
    }

    // Create RandomAccessStream from byte array.
    InMemoryRandomAccessStream^ randomAccessStream = ref new InMemoryRandomAccessStream();
    IOutputStream^ outputStream = randomAccessStream->GetOutputStreamAt(0);
    DataWriter^ writer = ref new DataWriter(outputStream);
    writer->WriteBytes(bytes);

    create_task(writer->StoreAsync()).then([writer](unsigned int)
    {
        create_task(writer->FlushAsync());
    });

    return randomAccessStream;
}

Nahrazení výchozí mapy

Pokud chcete výchozí mapu zcela nahradit dlaždicemi třetích stran nebo vlastními dlaždicemi:

• Zadejte MapTileLayer .BackgroundReplacement jako hodnota vlastnosti LayerMapTileSource.
• Zadejte MapStyle.None jako hodnotu vlastnosti Style objektu MapControl.

Související témata

• centrum pro vývojáře Map Bingu
• Ukázka mapy UWP
• Pokyny k návrhu pro mapy