Přidání vrstvy obrázku do mapy

V tomto článku se dozvíte, jak překrýt obrázek pevnou sadou souřadnic. Tady je několik příkladů různých typů obrázků, které se dají překryty do map:

  • Obrázky pořízené z dronů
  • Plán budovy
  • Historické nebo jiné specializované mapové obrázky
  • Podrobné plány webů úloh
  • Obrázky meteorologické radary

Tip

ImageLayer je snadný způsob, jak překrýt obrázek na mapě. Upozorňujeme, že prohlížeče můžou mít potíže s načítáním velkého obrázku. V takovém případě zvažte rozdělení obrázku na dlaždice a jejich načtení do mapy jako TileLayer.

Vrstva obrázků podporuje následující formáty obrázků:

  • JPEG
  • PNG
  • BMP
  • GIF (bez animací)

Přidání vrstvy obrázků

Následující kód překryje obrázek mapy Newarku v New Jersey z roku 1922. ImageLayer se vytvoří předáním adresy URL obrázku a souřadnic pro čtyři rohy ve formátu [Top Left Corner, Top Right Corner, Bottom Right Corner, Bottom Left Corner].

//Create an image layer and add it to the map.
map.layers.add(new atlas.layer.ImageLayer({
    url: 'newark_nj_1922.jpg',
    coordinates: [
        [-74.22655, 40.773941], //Top Left Corner
        [-74.12544, 40.773941], //Top Right Corner
        [-74.12544, 40.712216], //Bottom Right Corner
        [-74.22655, 40.712216]  //Bottom Left Corner
    ]
}));

Plně funkční ukázku, která ukazuje, jak překrýt obrázek mapy Newark New Jersey z roku 1922 jako vrstvu Obrázku, najdete v tématu Jednoduchá vrstva obrázku v Azure Maps Ukázky. Zdrojový kód pro tuto ukázku najdete v tématu Zdrojový kód vrstvy jednoduchých obrázků.

Snímek obrazovky znázorňující mapu s obrázkem mapy Newark New Jersey z roku 1922 ve vrstvě image

Import souboru KML jako základního překryvu

Tato ukázka ukazuje, jak přidat informace o překryvu země KML jako vrstvu obrázku na mapě. Překryvné vrstvy KML poskytují severní, jižní, východní a západní souřadnice a otočení proti směru hodinových ručiček. Vrstva obrázku ale očekává souřadnice pro každý roh obrázku. Překryv země KML v této ukázce je pro katedrálu Chartres a pochází z Wikimedia.

Kód používá statickou getCoordinatesFromEdges funkci z Třídy ImageLayer . Vypočítá čtyři rohy obrázku pomocí informací o severu, jihu, východě, západu a otočení překrytí země KML.

Plně funkční ukázku, která ukazuje, jak použít zemněnou vrstvu KML jako vrstvu obrázku, najdete v tématu KML Základní překryv jako vrstva obrázku v Azure Maps Ukázky. Zdrojový kód pro tuto ukázku najdete v tématu KmL Ground Overlay as Image Layer source code (Zdrojový kód vrstvy obrázku).

Snímek obrazovky znázorňující mapu s překryvem ZEMĚ KML, který se zobrazuje jako vrstva obrázku

Tip

getPixels Funkce a getPositions třídy vrstvy obrázku slouží k převodu mezi geografickými souřadnicemi vrstvy umístěného obrázku a souřadnicemi obrazových bodů místního obrázku.

Přizpůsobení vrstvy obrázku

Vrstva obrázku má mnoho možností stylů. Plně funkční ukázku, která ukazuje, jak různé možnosti vrstvy obrázku ovlivňují vykreslování, najdete v tématu Možnosti vrstvy obrázku v Azure Maps Ukázky. Zdrojový kód pro tuto ukázku najdete v tématu Zdrojový kód možností vrstvy obrázku.

Snímek obrazovky znázorňující mapu s panelem, který má různé možnosti vrstvy obrázku, které ovlivňují vykreslování V této ukázce můžete změnit možnosti stylů a podívat se, jaký vliv to má na mapu.

Další kroky

Další informace o třídách a metodách použitých v tomto článku:

Další ukázky kódu, které můžete přidat do map, najdete v následujících článcích: