JS Panorama

JavaScriptová komponenta pro zobrazení panoramatických snímků z celé České republiky.
Tato „panorama prohlížečka“ zařídí zobrazení sférických snímků ve vašich webových stránkách a umožní uživatelům se rozhlížet kolem dokola či se přesouvat na vedlejší snímky.
Komponenta se sama stará o načítání potřebných dat prostřednictvím REST API.
Pro konkrétní ukázky se podívejte na Panorama tutoriály.
REST API a JS Panorama je aktuálně v beta verzi.
Komponenta vyžaduje API klíč a je možné ji využívat prozatím pouze v rámci prémiového (placeného) přístupu.
Snímky byly pořizovány v různých částech republiky v různých letech. V rámci API jsou z licenčních důvodů prozatím dostupné pouze snímky do roku 2019
Ovládání panoramy
Uživatel se může v panoramě rozhlížet pomocí myši, případně na klávesnice (šipky vlevo vpravo či „a“ „d“).
V případě povolení přesunu mezi snímky (showNavigation:true) může přechod probíhat opět pomocí myši (klikáním na navigační šipky či místa dalších snímků) či na klávesnici (šipky dopředu dozadu či „w“ „s“)
Spotřeba panoramy
Panorama (jedna sféra) se nestahuje jako jedna velká fotka, ale skládá se z jednotlivých panorama dlaždic. Obvyklý rozměr celé panoramy je 16×8 dlaždic.
JS prohlížečka se sama stará o stažení potřebných dlaždice. Nestahuje celou sféru, ale jen ty dlaždice, které padnou do zobrazeného pohledu.
Spotřeba panoramy (v dlaždicích) se pak účtuje dle ceníku REST API.
Použití knihovny
Pro využití panoramy je potřeba přidat do hlavičky tento skript.
<script type="text/javascript" src='https://api.mapy.cz/js/panorama/v1/panorama.js'></script>
Díky němu máte k dispozici třídu Panorama, která zpřístupňuje jedinou funkci panoramaFromPosition().
funkce panoramaFromPosition()
Funkce pro zobrazení panoramy na určitých souřadnicích. Hledá nejbližší panoramu k zadaným souřadnicím v daném poloměru.
Vstupní parametry
parent | rodičovský html element pro připnutí panoramy |
lon, lat | souřadnice, v jejich okolí se vyhledává nejbližší panorama, až do určeného poloměru (viz parametr radius) |
apiKey | API klíč pro REST API |
Nepovinné parametry | |
radius | Maximální poloměr pro hledání panoramy. V metrech. výchozí hodnota: 50 m |
yaw | Natočení vzhledem k severu možné hodnoty: 0 – 2 * Math.PI výchozí hodnota 0 (sever) |
pitch | sklopení ( – nahoru, + dolů) možné hodnoty: +-Math.PI výchozí hodnota 0 |
fov | horizontální šířka zorného pole (vlatně přiblížení) možné hodnoty: Math.PI / 2 – Math.PI/20 výchozí hodnota 1.2 |
showNavigation | true/false – zapne nebo vypne možnost přesunu na vedlejší snímky výchozí hodnota: false |
lang | jazyk (používá se pro tooltipy, chybové hlášeky atd…) možné hodnoty: cs, de, el, en, es, fr, it, nl, pl, pt, ru, sk, tr, uk výchozí hodnota: cs |
interface ICreatePanoFromPositionOpts {
/** Rodič pro připnutí panoramy */
parent: HTMLElement;
/** Souřadnice wgs84 longitude */
lon: number;
/** Souřadnice wgs84 latitude */
lat: number;
/** API klíč */
apiKey: string;
/** Defaultní pohled panoramy - yaw */
yaw?: number;
/** Defaultní pohled panoramy - pitch */
pitch?: number;
/** Horizontální field of view */
fov?: number;
/** Radius pro hledání panoramy v [m] */
radius?: number;
/** Podporované jazyky: cs, de, el, en, es, fr, it, nl, pl, pt, ru, sk, tr, uk */
lang?: TLANGS;
/** Zapnout navigaci */
showNavigation?: boolean;
/** Skrýt chyby */
hideErrors?: boolean;
}
Návratové hodnoty
Funkce vrací objekt IOutput, který obsahuje tyto klíče
Informace o panoramě | |
info.lon, info.lat | Informace o skutečné poloze foceného místa |
info.date | Datum pořízení snímku ve formátu YYYY-MM-DD hh:mm:ss |
Informace o stavu | |
errorCode | „NONE“ | „PANORAMA_NOT_FOUND“ | „MISSING_API_KEY“ |
error | popis chyby |
Funkce | |
funkce destroy | funkce, která panoramu odstraní |
export interface IOutput {
/** Meta informace panoramy */
info?: {
/** Souřadnice panoramy wgs84 longitude */
lon: number;
/** Souřadnice panoramy wgs84 latitude */
lat: number;
/** Datum vytvoření YYYY-MM-DD hh:mm:ss*/
date: string;
};
/** Popis chyby */
error: string;
/** Kód chyby */
errorCode: "NONE" | "PANORAMA_NOT_FOUND" | "MISSING_API_KEY";
/** Odstranění prohlížečky */
destroy: () => void;
}