Mapa interaktywna

Komponent do tworzenia interaktywnych map opartych o dane np. statystyczne.

Przykład:

Format danych:

id=PL
color=#6D87C3
name=Polska
value=100
###
id=FR
n
ame=Francja
value=50
@@@
map=region/world/europeHigh 
controls_zoom=1

Opis

Dane dotyczące krajów rozdzielamy znakiem „###” i opisujemy przy pomocy następujących parametrów:
Parametr id=@ to kod elementu zapisana w standardzie ISO2 (przykładowo Polska ma kod PL, Francja - FR, PL‑02 - województwo dolnośląskie na mapie polski).
Parametr color=#000000 pozwala zmienić kolor elementu wyświetlonego na mapie (kod koloru w wartości HEX) (domyślnie color przyjmie tą samą wartość co w parametrze ogólnym).
Parametr name=@ pozwala zmienić tekst w dymku (pełną strukturę tekstu w dymku można zmienić parametrem ogólnym) (domyślnie name zawiera nazwę kraju/kontynentu w języku angielskim lub nazwę regionu).
Parametr value=# pozwala nadać wartość elementowi (można ją później wykorzystać do wyświetlenia w dymku, lub do tworzenia map w skalach).
Parametr editable=true umożliwia edycję wartości value przez użytkownika (pojawia się tabelka pod mapą).

Po znakach „@@@” możemy umieścić parametry ogólne:
Parametr background=#000000 pozwala dodać tło mapy (kod koloru w wartości HEX).
Parametr background_opacity=# pozwala zmienić przeźroczystość tła (domyślnie background_opacity=1).
Parametr behavior=# pozwala zmienić zachowanie mapy podczas interakcji na przemieszczanie całej mapy (0), przemieszczanie się po długości geograficznej (1), szerokości geograficznej (2), szerokości i długości geograficznej (3) (domyślnie behavior=0).
Parametr color=#000000 pozwala zmienić kolor nieaktywnych elementów (kod koloru w wartości HEX) (domyślnie color=#D8DCDC).
Parametr color_active=#000000 pozwala zmienić kolor aktywnego elementu (kod koloru w wartości HEX) (domyślnie color_active=#48BB8E).
Parametr color_border=#000000 pozwala zmienić kolor granic pomiędzy elementami (kod koloru w wartości HEX) (domyślnie color_border=#FFFFFF).
Parametr color_hover=#000000 pozwala zmienić kolor elementu nad którym znajduje się wskaźnik (kod koloru w wartości HEX) (domyślnie color_hover=#7C8486).
Parametr controls_export=# pozwala schować (0) lub pokazać (1) menu umożliwiające eksport mapy do pliku lub jej wydrukowanie (domyślnie controls_export=0).
Parametr controls_home=# pozwala schować (0) lub pokazać (1) przycisk powrotu do początkowego widoku [uwaga: wymaga controls_zoom=1] (domyślnie controls_home=0).
Parametr controls_minimap=# pozwala umieścić małą mapkę w prawym górnym (1), prawym dolnym (2), lewym dolnym (3) lub lewym górnym (4) rogu (domyślnie controls_minimap=0).
Parametr controls_zoom=# pozwala schować (0) lub pokazać (1) przyciski do manipulacji przybliżeniem (domyślnie controls_zoom=0).
Parametr delta_gamma=# pozwala obrócić mapę wokół osi Z (domyślnie delta_gamma=0).
Parametr delta_latitude=# pozwala obrócić mapę wokół osi Y (domyślnie delta_latitude=0).
Parametr delta_longitude=# pozwala obrócić mapę wokół osi X (domyślnie delta_longitude=0).
Parametr exclude=@ pozwala pozbyć się wybranych elementów z mapy, państwa wypisujemy po przecinku nazywając je według kodów ISO2 (przykładowo exclude=AQ).
Parametr grid=# pozwala nałożyć siatkę na mapę, widoczną tylko na wodach (1) lub na wszystkim (2) (domyślnie grid=0).
Parametr grid_color=#000000 pozwala zmienić kolor siatki (kod koloru w wartości HEX) (domyślnie grid_color=#303333).
Parametr grid_latitude=# pozwala zmienić gęstość linii szerokości geograficznej (domyślnie grid_latitude=10).
Parametr grid_longitude=# pozwala zmienić gęstość linii długości geograficznej (domyślnie grid_longitude=10).
Parametr grid_opacity=# pozwala zmienić przeźroczystość siatki (domyślnie grid_opacity=0.33).
Parametr heat=# pozwala utworzyć automatycznie stopniowaną mapę termiczną bazującą na parametrze value elementów (heat=0).
Parametr heat_max=#000000 pozwala zmienić kolor dla najwyższej wartości na mapie termicznej (kod koloru w wartości HEX).
Parametr heat_min=#000000 pozwala zmienić kolor dla najniższej wartości na mapie termicznej (kod koloru w wartości HEX).
Parametr include=@ pozwala wybrać tylko niektóre elementy z mapy, państwa wypisujemy po przecinku nazywając je według kodów ISO2 (przykładowo include=PL,DE,FR).
Parametr map=@ pozwala wybrać mapę, lista dostępnych map znajduje się poniżej (domyślnie map=worldLow) [uwaga: wielkość liter jest istotna].
Parametr projection=@ pozwala zmienić metodę projekcji mapy, lista dostępnych projekcji znajduje się poniżej (domyślnie projection=mercator).
Parametr size_x=# pozwala zmienić proporcję poziomą (domyślnie size_x=16).
Parametr size_y=# pozwala zmienić proporcję pionową (domyślnie size_y=9).
Parametr toggleable=# pozwala wyłączyć (0) lub włączyć (1) możliwość przybliżania do elementu po jego kliknięciu (domyślnie toggleable=0).
Parametr tooltip=@ pozwala dodać dymki do elementów, aby treść nie była jednakowa dla wszystkich możemy użyć {name} i {value} które zawierają nazwę i wartość przypisaną dla danego kraju (domyślnie tooltip= ).
Parametr legend={kolor:opis}...{kolor:opis}@{width:szerokość}{position:pozycja prawo/lewo/środek}{positionVertical:pozycja góra/dół}{title:tytuł nad legendą} pozwala dodać legendę do mapy. Na przykład: legend={#ffa500:Kategoria1}{#922932:Kategoria2}{#ffe680:Kategoria3}@{width:200}{position:right}{title:Tytuł123}

Formatowanie tekstu w dymku:
- Element [bold]pogrubiony[/]
- Element [italic]pochylony[/]
- Indeks górny i dolny H[subscript]2[/]O[superscript]+[/]
- Nowa linia[br]Druga linia

Dostępne projekcje:
- Albers
- AlbersUsa
- AzimuthalEqualArea
- Eckert6
- EqualEarth
- Equirectangular
- Mercator
- Miller
- NaturalEarth1
- Orthographic
- Stereographic

Najważniejsze dostępne mapy (w nawiasie podane dostępne wyższe rozdzielczości które wstawiamy zamiast Low):
- region/world/africaLow [High, Ultra]
- region/world/asiaLow [High, Ultra]
- region/world/caribbeanLow [High, Ultra]
- region/world/centralAmericaLow [High, Ultra]
- region/world/europeLow [High, Ultra]
- region/world/latinAmericaLow [High, Ultra]
- region/world/middleEastLow [High, Ultra]
- region/world/northAmericaLow [High, Ultra]
- region/world/oceaniaLow [High, Ultra]
- region/world/southAmericaLow [High, Ultra]
- region/world/worldRegionsLow [High, Ultra]
- albaniaLow [High]
- algeriaLow [High]
- bosniaHerzegovinaLow [High]
- continentsLow [High]
- polandLow [High]
- worldLow [High, Ultra]