Søg i Septima Widget K
Oversigtskort
Vis et oversigtskort for det aktuelle kortudsnit.
Options
Herunder findes en beskrivelse af de enkelte egenskaber, der kan sættes på oversigtskortet.
disable
- Type:
boolean
- Default:
false
Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
detach
- Type:
string
Angiv en reference til et alternativ html-element, som denne kontrol skal vises i. Det kan benyttes til at placere indholdet af en kontrol et andet sted på sin side. Hvis detach har værdien "abc"
, så skal der tlføjes et element til HTML'en på denne form: <div data-widget-detach="abc"/>
. Hvis elementet ikke findes, så fungerer kontrollen, som hvis detach ikke var angivet.
css
- Type:
string | string[]
Angiv en sti til en css-fil, der skal loades efter denne kontrol. Herved vil det være muligt at lave en brugertilpasset style af kontrollen.
className
- Type:
string
Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
keepInFullscreen
- Type:
boolean
- Default:
false
Benyttes når funktionen er "detached" og funktionen "fullscreen" er inkluderet i konfigurationen. Hvis "keepInFullscreen" sættes til true
, så er funktionen tilgængelig når kortet vises i fullscreen.
showOnLoad
- Type:
boolean
- Default:
false
Vis oversigtskortet fra start, når kortet loades.
layer
- Type:
layer[]
En liste af lag, der skal vises i oversigtskortet. Bemærk at lagene skal være i samme projektion som kortet. Læs mere layers her.
viewOptions
- Type:
object
p>Angiv hvordan oversigtskortet skal agere når brugeren navigerer i kortet. Det kan f.eks. være hvilke resolutions, der skal hoppen mellem:
json
"viewOptions": {
"resolutions": [1600, 1000]
}
Alle options, der er angivet her kan benyttes.
activateButton
- Type:
object
Aktivér oversigtskortet vha. en knap i kortet. "activateButton" kan indeholde "title", "className" og "html", der alle er optionelle. De har alle en brugbar default værdi. "title" bruges til at angive en tekst, der vises når musen holdes over knappen. "className" tilføjer en CSS-klasse til selve knappen. "html" erstatter indholdet af kanppen med det, der er angivet her. På denne måde er det muligt f.eks. at skifte ikon på knappen. Her er et eksempel på, hvordan "activateButton" kan angives:
json
"activateButton": {
"title": "Vis signaturforklaring",
"className": "my-style",
"html": "<span class='mdi mdi-map-search-outline'></span>"
}
buttonIndex
- Type:
number
- Default:
0
Hvis der er flere kompoenter med knapper i kortet, så bliver de tilføjet i en tilfældig rækkefølge. Ved at angive buttonIdex
er det muligt at bestemme rækkefølgen. Laveste index kommer først. Hvis to knapper har samme index vil det være tilfældigt hvilken der kommer færst.
Eksempler
Eksempler, der bruger denne komponent: