Dokumentation

For at bruge Septima Widget skal du blot have en licens og indsætte følgende to linjer på din hjemmeside:

<div data-widget-url="https://septima.dk/widget/config/layer.json"></div>
<script src="https://widget.cdn.septima.dk/latest/widgetconfig.js"></script>

Kort (map)

Elementet "map" definerer en widgets overordnede kortegenskaber

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css string/array Angiv en sti til en css-fil, der skal loades efter komponenten. Herved vil det være muligt at lave en brugertilpasset style af elementerne. Ved at angive et array af stier eller en liste adskilt af et komma er det muligt at loade flere filer.
title string Gør elementet mere tilgængeligt
crs string EPSG:25832 Kortets koordinatreferencesystem defineret i EPSG, eksempelvis: EPSG:25832
maxZoomLevel number 0

Angiver, hvor langt brugeren må zoome ud i kortet. Jo lavere tal, der angives, jo længere ud kan brugeren zoome. Den lavest mulige værdi er "0".

minZoomLevel number 11 Angiver, hvor langt brugeren må zoome ind i kortet. Jo højere tal, der angives, jo længere ind kan brugeren zoome. Den højeste værdi, der kan angives, bestemmes af det anvendte kort.
view object

Elementet view definerer et korts opstartstilstand. Det vil sige, centerpunkt defineret ved x og y koordinater i kortet samt zoomlevel:

"view": {
    "zoomLevel": 6,
    "x": 724406,
    "y": 6175994
}

Alternativt er det muligt at angive extent som en bbox med det udsnit, der skal vises.

"view": {
    "extent": [445058, 6066492, 890702, 6400726]
}

Det er også muligt at angive et maxExtent, der gør, at brugeren ikke kan panorere væk for et givent extent.

"view": {
    "zoomLevel": 0,
    "x": 724406,
    "y": 6175994,
    "maxExtent": [445058, 6066492, 890702, 6400726]
}

Find et passende view her

layer array En liste af lag, der skal vises i kortet
height number/string

Angiv, hvor højt kortet skal være. Værdien kunne for eksempel være 300 eller 300px, der begge sætter højden på kortet til 300 pixels. Højden kan også angives i procent. For eksempel 100%, der kan benyttes til fuldskærmskort.

Denne egenskab kan ligeledes angives direkte på den div, der definerer widget'en. Det gøres ved at tilføje en attribut, der hedder data-widget-height:

<div data-widget="mapwidget" data-widget-height="100%"></div>
useHash boolean false Skal den aktuelle position gemmes i URL'en, så man kan sende URL'en til en anden og se præcis det samme udsnit, så sæt useHash til true.
useStore object

Med useStore er det muligt at gemme flere ting omkring kortets aktuelle visning, herunder centerpunkt og zoomniveau til det rette sted, næste gang brugeren ser denne widget, samt hvilke lag, der er vist. Det er for eksempel relevant, når brugeren forlader siden og vender tilbage hurtigt efter. Som udgangspunkt bliver det gemte sted husket i 30 sekunder (30.000 millisekunder). Denne værdi kan ændres ved at sætte expire til et andet antal i millisekunder:

"useStore": {
    "expire": 600000
}

Herved udløber den først efter 600.000 millisekunder, svarende til ti minutter.

Sæt expire til never for aldrig at udløbe:

"useStore": {
    "expire": "never"
}

For at altivere at lag også huskes, tilføjes "layer": true. Herved vil de sidst viste lag være aktive næste gang brugeren kommer ind på siden. Default er "layer": false

Tilsvarende vil "map": false gøre at kortets centerpunkt og zoomniveau ikke gemmes. Default er "map": true

"useStore": {
    "expire": "never",
    "map": true,
    "layer": true
}

For at sikre at det, der gemmes bliver brugt af den samme Widget, benyttes URL'en som identifikation. Men dele af URL'en kan være dynamiske selvom det er den samme Widget, der vises. Derfor er det muligt at angive en liste med URL parametre, der ikke skal tages med som identifikatin. Det gøres ved at angive en liste med en eller flere parametrenavne på denne måde: "ignoreURLParams": ["husnummerid"]

"useStore": {
    "expire": "never",
    "ignoreURLParams": [
        "husnummerid"
    ]
}
mapcontrols object

Med mapcontrols er det muligt at styre, hvordan interaktionen i kortet skal være. Det er for eksempel muligt at disable zoom med musehjulet. Det gøres ved at sætte mouseWheelZoom til false:

"mapcontrols": {
    "mouseWheelZoom": false
}

Følgende navigationsfunktioner der kan deaktiveres: mouseWheelZoom, dragRotate, shiftDragZoom, doubleClickZoom, dragPan, pinchZoom, pinchRotate, keyboard og scaleline.

Derudover kan onFocusOnly sættes til true, hvis brugeren skal have kortet i fokus før der kan navigeres i det. Default er false.

Det er ligeledes muligt at styre hvor meget der zoomes ind ved dobbeltklik ved at angive et tal for zoomDelta.

Følgende funktioner kan aktiveres: scaleline og zoom. Eksempelvis:

"mapcontrols": {
    "zoom": true
    "scaleline": true
}

For scaleline er det muligt at angive forskellige parametre i stedet for true. Det kan bruges til at styre hvilket element (angiv ID på elementet) scaleline skal vises i som her:

"mapcontrols": {
    "scaleline": {
        "target": "elementID"
    }
}
epsgDefs object Her er det muligt at definere projektioner, der bruges i kortet. Hvis ikke angivet, så kaldes https://epsg.io for at hente ukente projektioner. Kontakt os for nærmere oplysinger.

Datalag (layer)

I layer-elementet angives de lag, kortet skal bestå af. Hvert lag er et objekt, men man også angiver en URL til en fil, der indeholder laget. Herved kan man anvende konfigurationen af et lag i flere widgets.

Hvert layer har følgende elementer:

Name type default description
disable boolean false Skal laget deaktiveres. Herved fungerer det, som om laget ikke var tilføjet. Kan bruges til midlertidig fjerne et lag.
id string ID, der kan bruges til f.eks. at skabe relationer mellem lag eller funktioner.
className string Kan f.eks. bruges til at tvinge lag til at blive renderet i forskellige canvas ved at angive to forskellige className. Det kan også bruges til at styre indholdet i det canvas, som laget tegnes i.
background string Angiv en farve. Kan bruges til at sætte baggrundsfarven på et lag. Dette er specielt velegnet til vektortiles baggrundskort.
name string

Indeholder en læsbar tekst, der bruges af funktioner som f.eks. lagvælger m.fl., hvor der skal vises en tekst for hvert lag.

namedlayer string

Angiver navnet på et default baggrundskort. På nuværende tidspunkt findes følgende navngivne lag, der kan benyttes: #dk_standard, #dk_luftfoto, #dk_graa, #dk_skaerm, #dk_forvaltning, #dk_vejkort, #dk_natur, #dk_dagi, #dk_kommune, #dk_topo, #dk_dhm, #dk_dhm_overflade, #dk_mat, #plandata, #plandata_wmts, #osm, #septima_vt_3857, #dk_luftfoto_3857 samt #mapbox_vt

Der er muligt at overstyre enkelte parametre ved blot også at tilføje de parametre, der ønskes overstyret. For #dk_forvaltning, #plandata og #plandata_wmts kan man med fordel vise forskellige lag fra de enkelte service ved at angive layername. For #dk_mat kan man styre farven på jordstykkerne ved at angive styles til f.eks.: "styles": "Jordstykke_Gaeldende_Gul". Derudover er det muligt at angive et ID på at datasæt fra DMPs datakatalog og få vist det pågældende lag i kortet. Dette åbner op for en masse nye lag, som ikke kræver nogen konfiguration.

visible boolean true Angiver, om laget skal vises fra start
ignore boolean false Laget bliver tilføjet, men det fremgår ikke af lagvælgeren og laget vil ikke være synligt i kortet. Dette er f.eks. relevant når laget benyttes som fallback til et andet lag.
fallback string Hvis er lag er kritisk for anvendelsen af løsningen, er det muligt at angive et ID på et altarnativt lag, der skal vises hvis dette lag fejler. Brugeren vil som udgangspunkt ikke opdage at et andet lag benytte. Lagvælger og andre funktioner vil fungere som før, men laget hentes fra en anden service. Bemærk at denne mulighed kun kan benytte på rasterlag som f.eks. WMS, WMTS og lignende.
copyright string Tilføj en copyright-tekst i kortet. Hvis der skal være et link, kan det tilføjes ved at benytte HTML.
extent array Angiver, om laget kun skal vises inden for et bestemt extent. Alt uden for dette extent vises (og hentes) ikke.
type string

Elementet type angiver typen af laget. Gyldige værdier: "geojson", "esrijson", "shp", "json", "djangojson", "datasourcejson", "gml", "gpx", "sheet", "OSM", "TileJSON", "GeoTIFF", "ArcGISRest", "XYZ", "VectorTiles", "Mapbox", "Stamen", "WMS" eller "WMTS"

Ved typen geojson er følgende øvrige elementer tilgængelige: features, features_host, features_dataType, features_type, features_style, template, template_[funktionsnavn], features_callbackparam, features_template

Ved typen flatgeobuf er følgende øvrige elementer tilgængelige: features, features_host, features_type, features_style, template, template_[funktionsnavn], features_template

Ved typen esrijson er følgende øvrige elementer tilgængelige: features, features_host, features_dataType, features_type, features_style, template, template_[funktionsnavn], features_callbackparam, features_template

Ved typen shp er følgende øvrige elementer tilgængelige: features, features_host, features_type, features_style, template, template_[funktionsnavn], features_template

Ved typen json er følgende øvrige elementer tilgængelige: features, features_host, features_dataType, features_type, features_style, template, template_[funktionsnavn], features_callbackparam, features_geometrycolumn, features_geometryFormat, features_template

Ved typen djangojson er følgende øvrige elementer tilgængelige: features, features_host, features_dataType, features_type, features_style, template, template_[funktionsnavn], features_callbackparam, features_geometrycolumn, features_template

Ved typen datasourcejson er følgende øvrige elementer tilgængelige: features, features_host, features_dataType, features_type, features_style, template, template_[funktionsnavn], features_template

Ved typen gml er følgende øvrige elementer tilgængelige: features, features_host, features_dataType, features_type, features_style, template, template_[funktionsnavn], features_template

Ved typen gpx er følgende øvrige elementer tilgængelige: features, features_host, features_dataType, features_type, features_style, template, template_[funktionsnavn], features_template. Bemærk: Sæt "features_dataType": "text"

Ved typen sheet er følgende øvrige elementer tilgængelige: features, features_host, features_style, template_[funktionsnavn] samt sourceOptions

Ved typen wms er følgende øvrige elementer påkrævet: host, format, layername

Ved typen wmts er følgende øvrige elementer påkrævet: host, format, layername, resolutions, matrixIds, matrixSet

Ved typen OSM skal ingen andre elementer angives

Ved typen Stamen skal ingen andre elementer angives, men det er muligt at angive layername (default er "watercolor")

Ved typen TileJSON er følgende element påkrævet: host

Ved typen VectorTiles er følgende element påkrævet: host

Ved typen Mapbox er følgende element påkrævet: host

Ved typen ArcGISRest er følgende øvrige elementer påkrævet: host, extent. For at vælge et specifikt lag, tilføj da layername ("show:0" hvis det er det første lag).

Ved typen XYZ er følgende element påkrævet: host

sourceOptions object

Her er det muligt at styre den præcise konfiguration af laget. Dette relevant for typerne "OSM", "TileJSON", "GeoTIFF", "ArcGISRest", "XYZ", "VectorTiles", "Stamen", "WMS" eller "WMTS", men primært "GeoTIFF", der kan indeholde specielle attributter.

Ved typen sheet angives hvilket "ark" der skal læses (defautl er Ark1). Skriv f.eks. "sheet": "deltagere". Det er også muligt at springe de første x antal rækker over, hvis de f.eks. indeholder noget ligegyldigt information. Dette gøres med "skipFirstRows": 2. Første række læses som "header" og hvis den indeholder nogle brugbare navne, kan de bruges som kolonnenavne i data. Men gør det ikke det, er det muligt at angive en liste af navnet i parameteren "header" på denne måde: "header": ["kolonne1","kolonne2","kolonne3"]. Det er også muligt at angive "header": "A". Det gør at kolonnerne hedder "A", "B", osv. som i regnearket. Hvis data indeholder en form for geometri, indsættes det ved at benytte "geometryTemplate": "POINT(<%= D %> <%= E %>)", der er en template, der danner en WKT.

"sourceOptions": {
    "sheet": "Ark1",
    "header": "A",
    "skipFirstRows": 2,
    "geometryTemplate": "POINT(<%= D %> <%= E %>)"
}
crs string EPSG:25832 Kortets koordinatreferencesystem defineret i EPSG, eksempelvis: EPSG:25832
features boolean false Angiver, om laget anvender vektordata for dynamisk visning og interaktion. Vektordata skal være i formatet GeoJSON. Ved at angive denne parameter er det muligt både at hente data som WMS, WMTS eller andet rasterlag, samtidig med at man henter vektordata til bedre interaktion for brugeren.
data object Indsæt data (GeoJSON) direkte i konfigurationen. Dette kan bruges som et alternativ til at hente vektordata fra en service med "feature_host". Det er også velegenet til at vise enkelte objekter i kortet, såsom adresse eller mødested. Indholdet skal overholde fra GeoJSON-specifikationen - læs mere her
selectable boolean false Kun relevant for lag med vektordata i klienten. Hvis selectable er sat til true, vil cursoren skifte til en hånd når brugeren fører musen over et objekt i kortet. Derudover aktiveres "click" eventet på laget. Dette benyttes i f.eks. Widget-API'et.
features_host string Internetadressen, hvor vektordata hentes fra, angiver, hvor kortet skal hente vektordata. Det kan eksempelvist være en statisk GeoJSON fil på samme domæne eller fra en ekstern webservice. Hvis data hentes fra en webservice eller en statisk fil på et andet domæne, skal data leveres med JSONP. Elementet "features_dataType" skal i dette tilfælde angives til værdien "jsonp". Bemærk at ved typen "shp" blot skal angives URL'en til filen uden ".shp".
features_template string

Her angives en skabelon for, hvorledes JSON fra service skal transformeres til GeoJSON. Attributter fra data kan angives i skabelonen med følgende notation <%= attributnavn %> - læs mere om templates her.

features_infohost string/object

Hvis "features_infohost" er en streng, er det en URL til den service, hvor vektordata kan hentes fra, når der klikkes i kortet Når "features_infohost" er en streng, skal servicen returnere GeoJSON. Det kan eksemplevis være en WFS-service eller en anden service, der kan returnere en række ud fra et punkt (x, y), en wkt eller en bbox. I denne internetadresse vil <%= x %> blive erstattet med x-værdien for det punkt, der søges på. <%= y %> vil blive erstattet med y-værdien for det punkt, der søges på. Tilsvarende kan man skrive <%= wkt %> og <%= bbox %>. Derudover erstattes <%= buffer %> af det aktuelle opløsning (resolution) ganget med 3. Dette kan bruges til at finde et objekt uden at skulle ramme præcist. Data skal leveres med JSONP. Det er kun den første række, der bliver vist information for.

Hvis servicen returnerer noget andet end GeoJSON (f.eks. ESRIJSON), skal "features_infohost" være et objekt, der indeholder "host" samt "type" i stil med dette:

{
    "host": "//myservice.dk/gis/rest/.../query?...&where=wkt=POINT(%20)",
    "type": "esrijson"
}

Bemærk at "eventtype" skal sættes til "mapclick" (eller ["click", "mapclick"]) for at "features_infohost" kaldes.

features_dataType string Gyldige værdier: "json" eller "jsonp". Hvis data hentes fra en webservice eller en statisk fil på et andet domæne, skal data leveres med JSONP. Se også features_host.
features_dataPath string Kan benyttes til at udvælge dele af de returnerede JSON data. Det kan f.eks. bruges hvis dele af data indeholder den egentlige GeoJSON.
features_callbackparam string callback Hvis servicen leveres med JSONP, men parameteren med navnet på funktionen ikke hedder "callback", angives denne parameter.
features_type string Typen af geometrier. Gyldige værdier: "Point", "Polygon" eller "Line". Hvis data er multigeometri, bliver det automatisk detekteret. Bemærk at GeometryCollection IKKE er understøttet.
features_geometrycolumn string Hvis servicen leveres med djangojson eller json, ligger geometrien i en navngiven kolonne, der skal angives her for at kunne vise det i kortet.
features_geometryFormat string geojson Hvis servicen leveres med typen json, ligger geometrien i en navngiven kolonne, der skal angives i features_geometrycolumn for at kunne vise det i kortet. Det forventes at kolonnen indeholder en GeoJSON geometri. Hvis kolonnen indeholder WKT, skal features_geometryFormat sættes til WKT.
features_style object

Hvordan skal objekterne styles i kortet. Det er muligt både at angive sti til ikoner, farver og gennemsigtighed, samt hvordan et objekt skal se ud, når det er valgt i kortet

Angiv et array af features_style og gør det muligt at lave avancerede styles, ved at kombibere to styles. Det kan f.eks. beuges til at lave linjer med flere farver eller til at have forskellig markering afhængigt af om objektet er valgt eller ej.

styleType string dynamic

En features_style kan både styre stylen afhængig af zoom samt af data. Det betyder at hver gang, der sker noget i kortet, så skal stylen gentegnes. Hvis der er mange features i kortet, kan dette tage lidt tid og reducere performance. Men hvis ens style ikke kræver denne dynamik, kan det gøre performance bedre ved at håndtere stylen mere statisk. Dette kan ikke detekteres automatisk og derfor skal man selv fortælle laget hvilken styleType der skal bruges og dermed optimere performance.

Ved at vælge static, er det ikke længere muligt at lade stylen være afhængig af zoom og data. Det betyder at det ikke er muligt at bruge f.eks. labels. Ved at sætte styleType til static, vil der heller ikke komme en "select" style på når brugeren vælger featuren i kortet ved f.eks. info.

Ved at vælge semistatic, er det muligt at lade stylen være afhængig af zoom, men ikke af data. Det betyder at det heller ikke her er muligt at bruge f.eks. labels. Derimod vil semistatic give muligt at have en "select" style på når brugeren vælger featuren i kortet ved f.eks. info.

features_method string GET Hvordan skal servicen kaldes. Gyldige værdier: "GET" eller "POST".
template eller template_[funktionsnavn] string ""

Her angives en html-skabelon for, hvorledes infoboksen skal præsenteres, når brugeren enten klikker eller holder musen over et objekt i kortet. Attributter fra data kan angives i html-skabelonen med følgende notation <%= attributnavn %> - læs mere om templates her.

For at benytte templates til specifikke funktioner, som eksempelvis "Find nærmeste" angives "route" som en del af template-navnet ("template_route"). Tilsvarende for template_table

userfilter object Hvilke objekter skal vises i kortet. Kan benyttes alene eller sammen med filter.
reloadOnFilterChange boolean false Hent data igen når filteret ændres. Herved kan filtreringen ske "server side" i stedet for i klienten. Kan benyttes sammen med filter.
cluster object Vis punkter i kortet som en samling af punkter. Herved er det nemmere at overskue mange punkter for brugeren. Bemærk, at cluster ikke er understøttet i IE8 eller ældre browsere.
declutter boolean false Sørger for at objekter ikke ligger oven i hinanden. Det er primært til punkter, hvis denne funktion sørger for at ikonerne ikke ligger oven på hinanden ved kun at vise et af punkterne, hvis der er overlap. Denne funktion kan også bruges til at sørge for at labels ikke er overlappende.
host string Ved WMS, WMTS og Mapbox. URL til service
crossOrigin string undefined Hvis der er brug for at få fat i billeder som data, er det nødvendigt at servicen, der levere billederne har CORS header på. Derudover skal crossOrigin sættes til: "crossOrigin": "anonymous". Det er f.eks. i forbindelse med "print" i klienten eller "WEBGL".
layername string Ved "WMS" eller "WMTS". Navnet på laget fra servicen
format string image/png Ved "WMS" eller "WMTS". Formatet af det billede, som servicen skal levere
params object En liste med parametre, der tilføjes til URL'en. Kan kun benyttes til VectorTiles og Mapbox hvor det f.eks. kan bruges til at angive access_token, samt WMS til f.eks. SLD_BODY
opacity number 1 Sæt lagets opacity. Kan antage værdier mellem 0.001 og 1. Kan benyttes til billedlag (såsom WMS og WMTS). På vektorlag benyttes features_style
minResolution number Herved kan man styre, hvornår laget skal vises i kortet. Resolution er antallet af meter pr. pixel
maxResolution number Herved kan man styre, hvornår laget skal vises i kortet. Resolution er antallet af meter pr. pixel
zIndex number 0 Angiver den rækkefølge lagene bliver renderet i kortet. Laget med det højeste zIndex kommer øverst. Hvis to lag har det samme zIndex kommer det sidste lag øverst
singleTile boolean false Ved "WMS". Hent ét billedet i stedet for tiles. Er specielt anvendeligt ved WMS-lag, der indeholder labels eller ikoner
preload number 0 Ved lag, der hentes som tiles som f.eks. "WMTS", "WMS" med "single": flase og "VectorTiles". Angiv et antal zoom niveauer, der skal hentes lavtopløselige tiles for på forhånd. 0 betyder at ingen tiles indlæses på forhånd
resolutions array Ved "WMTS". Resolutions denne WMTS service leverer i
matrixIds array Ved "WMTS". MatrixIds denne WMTS service leverer
matrixSet array Ved "WMTS". MatrixSet denne WMTS service leverer
relation string/object Det er muligt at angive en relation mellem laget og en eller flere andre lag. Hvis der angives en streng, så refereres der til et andet lag layername, der har strengens værdi. Hvis man i stedet angiver et objekt, så er det muligt at angive et match på egenskaber. Herved kan relationen for eksempel være mellem dette lag og alle lag med type="WMS". Dette gøres med "relation": {"type": "WMS"}
delay number 0 Features tilføjes til kortet med en forsinkelse angivet i millisekunder
featureDelay number/string 0 De enkelte features tilføjes til kortet med en individuel forsinkelse i millisekunder. Herved bliver de synlige én ad gangen. Værdien kan angives som millisekunder eller som en template. Læs mere om templates generelt her
animate object Tilføj features til kortet med en animation. Det kunne være, at linjer tegnes som en rute i kortet
loadingstrategy string all

Kontroller den måde vektordata hentes på. Som default er værdien all. Det betyder at alle data hentes fra start. Ved at sætte værdien til bbox hent de vektordata, der er inden for det viste kortudsnit. Hver gang kortudsnittet ændres, hentes der nye data. Benyt en template til at definere features_host eller params og benyt f.eks. parameteren "bbox" på denne måde:

"params": {
    "bbox": "<%= bbox[0] %>,<%= bbox[1] %>,<%= bbox[2] %>,<%= bbox[3] %>"
},

eller via features_host:

"https://geoserver.plandata.dk/geoserver/wfs?...
&bbox=<%= bbox[0] %>,<%= bbox[1] %>,<%= bbox[2] %>,<%= bbox[3] %>",
lazyload boolean false Hent først vektordata når laget vises i kortet. Kræver at visible er sat til false, så laget ikke er vist fra start.
cache boolean true Ved vektorlag. Sørger for at browseren cache'er resultatet af et request, så transport af data minimeres.
reloadInterval number Genindlæs data med et fast interval. Intervallet angives i millisekunder og kan f.eks. bruges til at vise "live" data på kortet. Dette kan bruges til vektorlag samt WMS lag.
reloadIntervalCache boolean false Kun relevant når "reloadInterval" er sat. Som default vil man ikke cache data, hvis de skal reloades med et fast interval. Dette gøres ved at tilføje en tilfældig parameter til URL'en, når data hentes. Herved betragter browseren og serveren det som et nyt kald. I specielle tilfælde er denne parameter ikke hensigtsmæssig. Ved at sætte "reloadIntervalCache" til true, tilføjes denne tilfældige parameter ikke til URL'en når data hentes. I det tilfælde er det serverens opgave at sørge for at data ikke er cached.
transition boolean Fade et lag ind og ud når de hhv. vises og skjules. Dette giver en glidende effekt, men er langt fra relevant i alle situationer.
paramNames object

Det er muligt at angive en eller flere nøgler, der skal bruges til at kalde den service, man bruger, med. Det kan bruges til kun at vise bestemte features i kortet eller bestemte lag:

"paramNames": {
    "key": "planid"
}

Herved kigges der først på om URL-parameteren planid er angivet. Hvis ikke, kigges der efter data-widget-planid på div-elementet.

Værdien benyttes til at estatte teksten <%= key %>, der eventuelt er angivet i host eller features_host. Det er også muligt at bruge de andre muligheder, der er med templates. Læs mere om templates generelt her

join object

Berig data fra en supplerende datakilde.

"join": {
    "type": "json",
    "host": "https://septima.dk/widget/data/kom_kategori.json",
    "dataType":"json",
    "on": {
        "komnr": "kommunekode"
    }
}

Data kan også angives direkte i konfigurationen:

"join": {
    "data": {
        "type": "FeatureCollection",
        "features": [{
            "type": "Feature",
            "properties": {
                "kommunekode": 730,
                "kategori": 1,
                "info": "Gælder alene for Fælledparken"
            }
        }]
    },
    "on": {
        "komnr": "kommunekode"
    }
}

I on er det muligt at angive én eller flere kolonner, der skal matche før featuren bliver beriget. Det er p.t. kun muligt at supplere data med et eksakt match.

computedProperties array

Tilføj supplerende beregnede kolonne til data, der kan benyttes til f.eks. at skabe en nemmere kategorisering. Det er muligt at angive en listen med nye kolonnenavne angivet i name. For hver kolonne angives en template, der kan transformere eksisterende kolonne til nye. For at styre formatet af den nye kolonne, angives det vha. type, der kan antage typerne "string" (default), "number", "date" eller "object".

Herunder ses forskellige eksempeler,der konverterer eksisterende kolonner til noget andet:

"computedProperties": [
    {
        "column": "adresse",
        "template: "<%= vejnavn %> <%= husnummer %>, <%= postnummer %> <%= postdistrikt %>"
        "type": "string"
    },
    {
        "column": "pris",
        "template: "<%= grundpris %>",
        "type": "number"
    },
    {
        "column": "overtagelse",
        "template: "<%= dato %>",
        "type": "date"
    },
    {
        "column": "interval",
        "template: "{from: <%= start %>, to: <%= end %>}",
        "type": "object"
    }
]
orderBy array

Sortering af data når de f.eks. vises i listevisningen. Det er muligt at angive en listen med kolonnenavne angivet i column, der skal sorteres på. For hver kolonne kan man angive sorteringsretningen med desc med værdien true eller false. Hvis værdien i kolonne er et tal, angives datatypen som "number" under type.

Herunder ses et eksempel hvor der først sorteres på "status" og derefter på "grundpris":

"orderBy": [
    {
        "column": "status",
        "desc": true
    },
    {
        "column": "grundpris",
        "desc": false,
        "type": "number"
    }
]
groupBy array

Gruppering af data. Angiv en liste med kolonnenavne, der skal grupperes på. Hvis data indeholder geometri, forudsættes det er geometrien er ens på tværs af rækkerne, der grupperes. Derfor benyttes geometrien fra den første forekomst. informationen for alle rækker, der er grupperet, er gemt i attributten data og kan benyttes i forbindelse med f.eks. infoboksen eller listevisningen.

Herunder ses et eksempel hvor data er grupperet efter kolonnen pladsid:

"groupBy": ["pladsid"]
fillpattern boolean false Denne parameter er kun nødvendig at benytte hvis stylen med fillpattern hentes fra en separat fil. Ellers detekteres det automatisk.
updateWhileAnimating boolean false Stylen opdateres i kortet mens der foregår en animation ved f.eks. zoom til. Dette kan være lidt tungt hvis laget indeholder mange features.
prefilter array

Tilføj et filter på data, der er hentet fra en service. Herved er det muligt kun at vise udvalgte data i kortet. prefilter består af en liste af udtryk, der alle skal være opfyldt for at en feaure vises.

Følgende operationer kan anvendes: =, !=, <, >, <=, >=, in, notin og tilføjes som vist her:

"prefilter": [ 
    {"name": "type", "op": "!=", "val": "test"},
    {"name": "klynge_id", "op": "=", "val": 101}
]

Style (features_style)

Styling af objekter i kortet.

Det er muligt at anvende værdien fra en kolonne i data til at styre de enkelte style-egenskaber. Det gøres ved at indsætte <%= KOLONNENAVN %> i stedet for en style. Det kunne eksempelvis gøres på denne måde:

"icon": "https://septima.dk/widget/img/icon_<%=type%>.png"

eller

"strokecolor": "<%= farvekolonne %>"

Når man angiver sin style, har man ud over værdierne fra kolonnerne også adgang til geometritypen via <%= _geometryType %>, parametre fra f.eks. URL'en via <%= _params %> samt oplysninger om det aktuelle kort. Kortets oplysninger findes f.eks. med <%= _currentMap.resolution %>, men der er også adgang _currentMap.center, der er et array, og _currentMap.zoom. Det kan f.eks. bruges til:

"strokewidth": "<% if(_currentMap.resolution > 10) { print(1) } else { print(4) } %>"

Læs mere om templates her.

Hver af de nedenstående style-egenskaber har en tilsvarende egenskab med suffix "_selected". Disse angiver, hvordan style skal være for et valgt objekt i kortet. Det valgte objektikon bestemmes således af egenskaben "icon_selected".

Indholdet af features_style kan også være en URL til en fil, der indeholder denne style. Det gøres simpelt ved at angive "features_style": "https://septima.dk/widget/data/styles/test.json". Herved kan en style benyttes på tværs af lag og konfigurationer.

Name type default description
namedstyle string

Der findes en række forskellige foruddefinerede styles, der kan benyttes. Lige nu findes der #000, der bruges når features skal være klikbare men ikke synlige. Det kan f.eks. bruges oven på et WMS lag. Derudover findes #001, #002, ... , #010 samt #011

Der er muligt at overstyre enkelte parametre ved blot også at tilføje de parametre, der ønskes overstyret

hidden boolean false Det er muligt at styre om en style skal være synlig. Dette kan med fordel bruges sammen med template.
zIndex number Hvis flere objekter ligger oven på hinanden, der et muligt at bestemme hvilket objekter, der skal ligge øverst. Dette kan med fordel bruges sammen med template. Bemærk at zIndex kun gælder inden for et lag, og kan derfor ikke bruges til at styre visningen på tvæs af lag.
minResolution number Gør det nemt at styre om en style skal vises i et givent zoom. Dette er specielt anvendeligt hvis man benytter flere styles på et lag. Resolution er antallet af meter pr. pixel
maxResolution number Gør det nemt at styre om en style skal vises i et givent zoom. Dette er specielt anvendeligt hvis man benytter flere styles på et lag. Resolution er antallet af meter pr. pixel
icon string Sti til ikon (gælder for punktdata). Stien kan være relativ i forholde til den side, hvor kortet er, eller absolut
scale number 1 Skalér ikoner i kortet. Værdien 0.5 betyder at ikonet vises i halv størrelse, mens 2 betyder at ikonet vises i dobbelt størrelse. Virker på billed- samt SVG-ikoner.
imgSize array Benyttes KUN i forbindelse med SVG-ikoner. Angiv den originale størrelsen på SVG-ikoner med f.eks. [65,73] hvis ikonet er 65 pixel bredt og 73 pixel højt. Det virker fint uden i alle browsere, med undtagelse af IE. Kan også angives som tekst på samme form: "[65,73]".
symbol string none Brug et symbol i stedet for et ikon. Lige nu findes der følgende symboler: circle, square, triangle, star, cross og x.
svg string none

Det er muligt at angive SVG inline i konfigurationen. Dette kan f.eks. bruges til at styre SVG'en individuelt pr. feature ved at benytte værdier fra data, som beskrevet i ovenstående.

Værdien af alle fill="currentColor" attributter i SVG'en, erstattes automatisk af værdien fra fillcolor.

Værdien af alle stroke="currentColor" attributter i SVG'en, erstattes automatisk af værdien fra strokecolor.

Værdien af alle stroke-width="currentWidth" attributter i SVG'en, erstattes automatisk af værdien fra strokewidth.

Værdien af alle stroke-width="currentWidth" attributter i SVG'en, erstattes automatisk af værdien fra -strokewidth.

crossOrigin string undefined Hvis der er brug for at få fat i billeder som data, er det nødvendigt at serveren, der leverer billederne har CORS header på. Derudover skal crossOrigin sættes til: "crossOrigin": "anonymous". Det er f.eks. i forbindelse med "print" i klienten eller "WEBGL".
fillcolor string #FFFFFF Udfyldningsfarve for flader
fillopacity number 0 Udfyldningsgraden for flader. 0 betyder gennemsigtig, 1 betyder helt udfyldt. Med fillopacity = 0 kan man benytte WMS eller WMTS til styling, mens vektordata benyttes til at give brugeren en oplevelse af interaktion
strokecolor string #FFFFFF Udfyldningsfarve for linjer og outline på flader
strokeopacity number 0 Udfyldningsgraden for linjer og outline på flader. 0 betyder gennemsigtig, 1 betyder helt udfyldt. Med strokeopacity = 0 kan man benytte WMS eller WMTS til styling, mens vektordata benyttes til at give brugeren en oplevelse af interaktion
strokewidth number 1 Bredden på linjer og outline på flader.
lineDash array Angiv hvis linjer skal være stiplede. Angiv f.eks. [10, 10] hvor første og andet tal angiver hvor mange pixels hhv. mellemrum og linje skal vøre i den stiplede linje.
rotation number 0 Rotér symbol eller ikon.
xOffset number 0.5 Forskyd et ikon i x-retningen. Kan antage værdier mellem 0 og 1, hvor 0 er ved ikonets venstre kant, mens 1 er ved ikonets højre kant. Det betyder, at 0.5 er i midten af ikonet.
yOffset number 0 Forskyd et ikon i y-retningen. Angivet i et antal pixels ikonet skal forskydes i y-retningen, hvor 0 er ved ikonets nederste kant. Kan antage både positive og negative værdier.
radius number 10 Størrelsen på et symbol. Anvendes kun, når symbol er angives.
radius2 number 5 Anvendes kun, når symbol er star eller cross.
text string Vis en label på hvert objekt i kortet. Brug for eksempel <%= navn %> til at vise teksten for feltet "navn". Læs mere om templates her.
textAlign string center Placeringen af label. Brug værdierne "center", "end", "left", "right" eller "start"
textBaseline string middle Placeringen af label. Brug værdierne "alphabetic", "bottom", "hanging", "ideographic", "middle" eller "top"
textFont string normal 10px Verdana Angiv "normal" eller "bold", teksten størrelse samt fonttype.
textFillcolor string #333333 Tekstens farve.
textOutlinecolor string #fff Tekstens baggrundsfarve/outlinefarve
textOutlinewidth number 3 Tekstens outline bredde.
textXOffset number 0 Forskydning af teksten i X-retningen.
textYOffset number 0 Forskydning af teksten i Y-retningen.
textMaxWidth number Antal tegn en tekst maksimalt må være før den brydes efter næste mellemrum.
textRotation number 0 Tekstens rotation angivet i radianer (0.785398164 = 45 grader).
textMinResolution number Herved kan man styre, hvornår labelen skal vises i kortet. Resolution er antallet af meter pr. pixel
textMaxResolution number Herved kan man styre, hvornår labelen skal vises i kortet. Resolution er antallet af meter pr. pixel
textOverflow boolean false Skal teksten fylde mere end den underliggende geometri (gælder kun for polygoner)?
jsonUrl string En URL til en JSON-fil, der indeholder style til laget. Kan kun benyttes til VectorTiles og kan f.eks. bruges til at få stylen fra en JSON konfiguration
source string composite Navnet på den "source" fra JSON-filen, der definerer stylen. Kan kun benyttes sammen med jsonUrl i forbindelse med VectorTiles
geometryOptions objekt

Det er muligt at få tegnet en alternativ geometri i kortet. Det kan være startpunkt, slutpunktet eller alle knudepunkter for en linje/polygon, centroide eller interior point for en polygon, geometriens convex hull eller envelope eller tilføje en buffer til geometrien.

geometryOptions angives hvilken type man vil vælge. Mulige værdier for type er: interiorPoint, centroide, lastPoint, firstPoint, vertices, envelope, convexHull, buffer, offset og wkt. Eksempel:

"geometryOptions": {
    "type": "interiorPoint"
}

Ved buffer angives en ekstra parameter, der definerer hvilken buffer, der skal tilføjes. buffer kan angives som et tal eller som en template, der kan bruge oplysningerne fra data:

"geometryOptions": {
    "type": "buffer",
    "buffer": 27
}

Ved offset angives en ekstra parameter, der kan være enten delta eller pixels, hvor delta definerer hvor mange meter objektet skal flyttes og pixels definerer hvor mange pixels objektet skal flyttes. Kun en af de to parametre kan angives. Begge parametre skal angives som et array med to tal, der siger hvor mange hhv meter og pixels objketket skal flyttes i x og y retningen. De to tal kan også hver især angives som en template, der kan bruge oplysningerne fra data:

"geometryOptions": {
    "type": "offset",
    "delta": [10, 10],
    "pixels": [2, -2]
}

Ved wkt angives en ekstra parameter, der definerer hvilken wkt, der skal bruges som geometri. wkt kan angives som en fuld tekststreng eller som en template, der kan bruge oplysningerne fra data:

"geometryOptions": {
    "type": "wkt",
    "wkt": "POINT(550800 6293000)"
}

Bemærk: Hvis der er mange data, kan disse operationer med fordel gøres på den server, der levere data, ellers er der risiko for at det kan gå langsomt at tegne kortet.

fillpattern objekt

Få udfyldt flader i kortet med en skravering.

fillpattern angives hvilken form for skravering man vil have. Eksempel:

"fillpattern": {
    "pattern": "hatch",
    "fillcolor": "rgba(200,200,200,0)",
    "strokecolor": "rgba(200,200,200,1)",
    "offset": 0,
    "size": 1,
    "spacing": 5,
    "angle": 60,
    "scale": 2
}

Vælg mellem følgende typer skravering: "hatch", "cross", "dot", "circle", "square", "tile", "woven", "crosses", "caps", "nylon", "hexagon", "cemetry", "sand", "conglomerate", "gravel", "brick", "dolomite", "coal", "breccia", "clay", "flooded", "chaos", "grass", "swamp", "wave", "vine", "forest", "scrub", "tree", "pine", "pines", "rock", "rocks".

Se eksempel på de forskellige typer her.

Filter (userfilter)

Styring af hvilke objekter, der vises i kortet.

Herunder er et eksempel på inholdet af userfilter. Man angiver navnet på kolonnen samt hvilke egenskaber, der skal knyttes til dette filter. Der findes følgende typer: range, daterange, boolean, text, selectlist og multiselect. I eksemplet er der angivet to kolonner; "antal" og "belægning". For kolonnen "antal" vises kun objekter, der har værdier mellem 0 og 50 (begge inklusive). For kolonnen "belægning" vises kun de objekter, der har værdier under 100. Begge ranges skal opfyldes for at objektet vises.

{
    "antal": {
        "type": "range",
        "min": 0,
        "max": 50,
        "limit": [0,110],
        "template": "Antal børn: <%= min %>-<%= max %> børn"
        "label": "Antal børn:",
        "unit": " børn"
    },
    "belægning": {
        "max": 100,
    }
}

Indholdet af userfilter kan også være en URL til en fil, der indeholder userfilter. Det gøres simpelt ved at angive "userfilter": "https://septima.dk/widget/data/userfilter.json". Herved kan et userfilter benyttes på tværs af lag og konfigurationer.

Herunder findes en beskrivelse af de enkelte egenskaber, et enkelt userfilter kan have.

Name type default description
type string range Hvilken type filter er det. Angiv "range", "boolean", "selectlist", "text", "daterange" eller "multiselect"
label string Benyttes blandt andet af filter funktionen til at vise en overskrift eller teksten på en boolean knap
template string/object

Ved type:"range": Benyttes af filter funktionen til at vise det valgte interval. Herved er det muligt at lave et beregnet felt afhændigt af det valgte. Det kunne være at man gerne vil vise navnet på måneden i stedet for tallet. Læs mere om templates generelt her

Bemærk at hvis template angives, benyttes label og unit ikke.

min number/string

Ved type:"range" og type:"daterange": Den værdi som kolonnen mindst skal have. Ved type:"daterange" er det en dato i samme format som angivet i "format". Alternativt kan syntaksen "today", der så er dags dato. Det er muligt at angive "today-3d" for at vælge tre dage før i dag. Eller "today+1M" for en måned fra i dag eller "today+2y" for om to år.

max number/string

Ved type:"range" og type:"daterange": Den værdi som kolonnen højst skal have. Ved type:"daterange" er det en dato i samme format som angivet i "format". Alternativt kan syntaksen "today", der så er dags dato. Det er muligt at angive "today-3d" for at vælge tre dage før i dag. Eller "today+1M" for en måned fra i dag eller "today+2y" for om to år.

fixedMin boolean false Ved type:"range": Benyttes i forbindelse med filter funktionen til at fryse sliderens startpunkt.
fixedMax boolean false Ved type:"range": Benyttes i forbindelse med filter funktionen til at fryse sliderens slutpunkt.
startDate string

Ved type:"daterange": Den dato, der tidligst kan vælges. En dato i samme format som angivet i "format". Alternativt kan syntaksen "today", der så er dags dato. Det er muligt at angive "today-3d" for at vælge tre dage før i dag. Eller "today+1M" for en måned fra i dag eller "today+2y" for om to år.

endDate string

Ved og type:"daterange": Den dato, der senest kan vælges. En dato i samme format som angivet i "format". Alternativt kan syntaksen "today", der så er dags dato. Det er muligt at angive "today-3d" for at vælge tre dage før i dag. Eller "today+1M" for en måned fra i dag eller "today+2y" for om to år.

limit array Ved type:"range": Benyttes blandt andet af filter funktionen til at angive, hvad udfaldsrummet maksimalt kan have
unit string Ved type:"range": Benyttes blandt andet af filter funktionen til at vise det aktuelle valg med en enhed
sliderType string double Ved type:"range": Brug single hvis man ønsker at have en slider med kun én værdi. Bemærk at min og max skal sættes til samme værdi for at få kortet til at vise det, der er valgt i slideren.
values array Ved type:"multiselect" og type:"selectlist": Hvilken værdier fra denne kolonne skal en feature have for at blive vist i kortet. Ved type:"text": En liste af værdier, der skal filtreres på fra starten
allDefaultSelected boolean false Ved type:"multiselect" og type:"selectlist": Alle værdier valgt fra starten. Et alternativ til at angive alle eksplicit
sort boolean Ved type:"multiselect" og type:"selectlist": Skal filteret sorteres efter værdien
splitString string Ved type:"range", type:"multiselect" og type:"selectlist": Hvis data indeholder flere værdier i samme tekstfelt, vil det være muligt at splitte teksten. Det betyder at hvis en kolonne i data f.eks. indholder værdien Have,Hus for én feature mens en anden indeholder Hus, så kan du lave et filter, der indeholder Have og Hus som hvert sit valg. Når brugeren vælger Hus, så vises begge features selvom den ene indeholdt teksten Have,Hus
buttontype check Ved type:"selectlist": Skal listen fungere som checkbuttons eller radiobuttons. Ved "buttontype":"check" kan flere værdier fra listen være valgt på én gang. Ved "buttontype":"radio" kan kun én af værdierne i listen være valgt.
value boolean Ved type:"boolean": Skal de features, der overholder de booleske udtryk, vises
eq boolean, number, string Ved type:"boolean": Værdien som en feature skal have for, at den er true
regexp string Ved type:"boolean": Et regulært udtryk som en feature skal matche for, at den er true
regexpTrue string .* Ved type:"boolean": Et regulært udtryk som en feature skal matche for, at den er true. Herved er det muligt, at "true" og "false" ikke er komplementære. Benyttes sammen med "regexpFalse".
regexpFalse string .* Ved type:"boolean": Et regulært udtryk som en feature skal matche for, at den er false. Herved er det muligt, at "true" og "false" ikke er komplementære. Benyttes sammen med "regexpTrue".
format string "DD.MM.YYYY" Ved type:"daterange": Den måde hvorpå datoen vises, når den er valgt.
maxDateColumn string Ved type:"daterange": Hvis data er et range, der er defineret af to datoer i hver sin kolonne, angives her den kolonne, der definere slutdatoen
shortcuts object

Ved type:"daterange": Vis genveje til f.eks. "næste uge", "næste måned" og "næste år"

"shortcuts": {
    "prev": ["week", "month", "year"],
    "next": ["week", "month", "year"]
}
expand string up Ved type:"daterange": Skal datovælgeren folde ud over (up) eller under (down) knappen.
overlapMethod string some

Ved type:"daterange": Kan have værdierne some, all og allSelected.

Ved some skal der blot være et overlap mellem det valgte interval og intervallet i data.

Ved all skal det valgte intervalg ligge fuldstndigt inden for intervallet i data.

Ved allSelected skal hele intervallet i data ligge inden for det valgte interval.

format string "DD.MM.YYYY" Ved type:"daterange": Den måde hvorpå datoen vises, når den er valgt.
urlParamNames object Ved type:"daterange": URL-parametre, der indeholder startværdier for henholdsvis min- og max-værdierne. Angiv eksempelvis {"min": "startdato","max": "slutdato"}. Herved er det muligt at kalde siden med &startdato=16.12.2015&slutdato=18.12.2015 hvor de to værdier bliver indsat som min og max. Bemærk, at formatet på datoen er det format, der er angivet under format.

Animation (animate)

Styring af hvordan objekter, der tilføjes i kortet.

{
    "type": "route",
    "duration": 2000
}

Herunder findes en beskrivelse af de enkelte egenskaber, en enkelt animation kan have.

Name type default description
type string Hvilken type animation er det. Angiv "route"
duration number/string Hvor lang tid skal det tage, før featuren er tegnet i kortet. Værdien kan angives som millisekunder eller som en template. Læs mere om templates generelt her

Cluster

Samling af punkter i kortet. Herunder findes en beskrivelse af de enkelte egenskaber, der kan sættes på et cluster. Hvis ingen egenskaber er angivet, vil default-værdier blive brugt. Det er altså ikke nødvendigt at gøre noget. Bemærk, at cluster ikke er understøttet i IE8 eller ældre browsere.

Name type default description
distance number 40 Afstanden mellem punkter, der skal samles
spiral object

Når der klikkes på et cluster, vil de underliggende punkter blive spredt ud som en spiral fra centrum af clusteret. Det er muligt at angive sølgende parametre til spiralen:

"spiral": {
    "pxArc": 35,
    "pxSep": 35,
    "pxDist": 30
}

hvor pxArc er antallet af pixels, der skal være mellem to punkter, der ligger ved siden af hinanden i spiralen, mens pxSep er antallet af pixels mellem to rækker i spiralen.

pxDist bestemmer hvor langt et punkt skal vises fra centrum når der kun vises få punkter.

features_style object

Hvordan skal cluster punkterne markeres i kortet. Specielt for cluster er det også muligt at angive en radius. Default er radius dynamisk afhængig af antallet af punkter. Men det er muligt at angive en specifik radius her.

Her er et eksempel:

"features_style": {
    "strokecolor": "rgba(230, 0, 126, 0.4)",
    "strokewidth": 14,
    "fillcolor": "rgba(230, 0, 126, 1)",
    "textFont": "bold 16px Roboto",
    "radius": 18
}

I stylen er det muligt at bruge teplates til at styre indholdet stylen. Templaten kan bruge parametrene colorratio, opacityratio, radius, ratio> og text>, hvor den sidste er antallet af punkter, der ligger i dette cluster. Læs mere om templates generelt her

minResolution number 0 Hvor langt skal der zoomes ind, før et cluster vises som punkter i stedet for cluster. Dette tal angives som antallet af meter, hver pixel er i dette zoomniveau.

Data (data)

Elementet "data" definerer et kommunikationslag som erstatning for f.eks. et map. Herved er det muligt at få adgang til data uden at få vist et kort. Indholdet er defineret som lag på samme måde som på map. Bemærk, at kun vektorlag bliver anvendt

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig fjerne en kontrol.
css string/array Angiv en sti til en css-fil, der skal loades efter komponenten. Herved vil det være muligt at lave en brugertilpasset style af elementerne. Ved at angive et array af stier eller en liste adskilt af et komma, er det muligt at loade flere filer.
layer array En liste af lag, hvor data skal hentes fra. Læs mere under Lag.

Funktioner (controls)

Angiver en liste af "controls" på kortet. En "control" kan være en adressesøgeboks eller en find nærmeste boks. Navnet på den enkelte "control" er angivet i parentes ud for hver overskrift.

"controls": {
  "fullscreen": {
    "disable": false
  },
  "info": {
    "disable": false,
    "type": "cloud"
  }
}

Analytics fra Google eller Siteimprove (analytics)

Hvordan anvender brugerne Septima Widget? Med Analytics funktionen, er det muligt at følge med i, om brugeren klikker på en feature i kortet, vælger noget i listevisningen, tænder og slukker lag eller filtrerer data.

For at benytte denne kontrol kræver det, at man har et trackID fra Google Analytics eller Siteimprove. Dette kan man få ved at gå ind på https://analytics.google.com eller på https://siteimprove.com/.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
type string googleanalytics Det er muligt at angive goggleanalytics eller siteimprove.
trackID string Angiv trackID fra Google Analytics eller Siteimprove.
wait string Det er muligt at angive værdien CookieInformation, hvis der skal ventes til brugeren har givet samtykke gennem CookieInformation. Dette kræver at man allerede benytter CookieInformation på sin side.

Graf (chart)

Vis grafer ud fra data.

Det er muligt at få vist flere former for grafer, herunder cirkeldiagrammer m.m. vha. ChartJS. Konfigurationen består af tre dele; "type", "options" og "datasets". "type og "options" angives på funktionen mens "datasets" angives på laget. Alle parameter til både "options" og "datasets" fra dokumentationen kan benyttes. Bemærk at vi pt. benytter version 2.9.4 som default og at der er forskel på den og den seneste version. Det anbefales at benytte seneste version ved at angive ChartJSVersion i konfigurationen.

I tillæg til den normale ChartJS, er det muligt at benytte plugin'et chartjs-plugin-datalabels. Det eneste du skal gøre er at tilføje det til konfigurationen under "options". Derudover er det muligt at have en speciel konfiguration til hvert dataset.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
type string Angiv hvilken type graf, der skal vises. Se hvilke typer, der er at vælge imellem her.
ChartJSVersion number 2 Angiv hvilken version af ChartJS, der skal bruges. Som default benyttes versoin 2. Dette er for at være baggudkompatibel. Det anbefales at benytte versoin 4, der er den seneste version i skrivende stund.
options ocject Options er afhængig af hvilken type, der er valgt. Se dokumentationen for detaljer.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.

Konfliktsøgning (conflict)

Foretag en konfliktsøgning på f.eks. en adresse, et klik i kortet eller brugerens aktuelle position.

Konfliktsøgnigen sker ved, at der kaldes en service, der returnerer resultatet. Resultatet vises i en liste.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
title string Gør elementet mere tilgængeligt
detach 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.
template string Angiver den html-template, der anvendes til at præsentere 'find nærmeste' resultater. Hvis ikke angivet, så vises listen uden overskrift og formatering. Med template kan man styre det, der ligger uden om listen. Det kunne være en overskrift samt en forklarende tekst. Læs mere om templates generelt her. For denne template er der to tilgængelige attributter; <%= title %> og <%= content %>, hvor <%= title %> benyttes til at skrive, hvor ruten starter, mens <%= content %> er dér, hvor listen indsættes. De enkelte rækker i listen styres af template_route på laget.
target array Angiver en liste af services, der skal kaldes.
highlight boolean false Skal det fundne markeres i kortet? Dette er specielt hensigtsmæssigt, når eventtype er "mapclick", men kan også bruges i andre situationer. Denne mulighed er ikke optimal, når der bruges flere targets.
zoomOptions object Bruges kun, når "highlight" er sat til true. Hvis angivet, så zoomes der til objektet med den angivede metode. sæt evt. "preventZoom" på "search" for at undgå at de begge zoomer.
inMap boolean false Skal resultatet vises oven på kortet som en normal infoboks.
closeButton boolean false Vis en lukknap i infoboksen. Når brugeren klikker på knappen, lukkes boksen og markeringen fjernes. Dette er specielt anvendeligt i kombination med inMap</code>.</td> </tr>
features_style object Bruges kun, når "highlight" er sat til true. Her er det muligt at angive, hvordan markeringen skal styles i kortet.
eventtype string/array featureadded Typen af interaktionen. Gyldige værdier: "featureadded", "featureselected" (tidligere "click") eller "mapclick". Ved "featureselected" aktiveres konfliktsøgningen, når der klikkes på en vektorfeature i kortet. Ved "featureadded" aktiveres konfliktsøgningen, når andre funktioner tilføjer noget til kortet. Det kan for eksempel være søgefunktionen. Dog aktiveres konfliktsøgningen ved søgning på lokale data ved "featureselected", da det, der sker er at featuren vælges i kortet. Ved "mapclick" aktiveres konfliktsøgningen, når brugeren klikker et sted i kortet.
simplifyInputToPoint boolean false Når der søges, bruges en geometri som input. Nogle services har en begrænsning på, hvordan de kan kaldes. Det kan for eksempel være, at URL'en kan blive for lang, hvis den geometri, der søges med, er stor. Derfor er det muligt at angive "simplifyInputToPoint", der gør, at inputgeometrien konverteres til et punkt, inden det sendes afsted til servicen.
queryFilter boolean/string true Filtre når et inputobjekt skal aktivere en konfliktsøgning. Det vil typisk være en template, der angives. Læs mere om templates generelt her

Hvilke data skal der søges i

Opsætningen til hver enkelt target.

Name type default description
host string

En URL til den service, der skal kaldes. I URL'en vil <%= wkt %> blive erstattet med en WKT-streng for det, der laves konfliktsøgning med. Tilsvarende vil <%= x %> og <%= y %> blive erstattet med centroiden for objektet.

Mulige parametre er: <%= wkt %>, <%= x %>, <%= y %>, <%= buffer %>, <%= zoom %>, <%= resolution %>, <%= minx %>, <%= maxx %>, <%= miny %> og <%= maxy %>.

Derudover er det muligt at tjekke på hvilken eventtype der har aktiveret konfliktsøgningen. Det gøres ved at bruge <%= event %>, der har værdien mapclick, hvis brugeren har klikke i kortet, eller featureadded hvis eventet kommer via en markering fra f.eks. søgefeltet. Dette kan bruges til at differentiere kaldet afhængigt af hvad brugeren har gjort.

Hvis konfliktsøgningen aktiveres via søgefeltet, er der også muligt at benytte oplysinger herfra til at danne URL'en med. Herved kan konfliktsøgningen ske ved en kombination af geometri og/eller attributværdier. Det kan f.eks. være at man vil bruge ejerlavskoden fra "dawa" til at lave konfliktsøgningen med. Dette gøres ved at benytte <%= properties.ejerlav.kode %>. Eller hvis man søger på lokale data i søgefeltet, så kan man få adgang til et id via <%= properties.id %>. Dette kræver altså lidt viden om de data, der søges i samt at den service man benytter, understøtter andet end blot et grometrisk filter.

type string

Elementet 'type' angiver typen af servicen. Gyldige værdier: geojson, esrijson, datasourcejson, spatialqueryjson, json og djangojson. Derudover er det muligt at have værdien text, der blot sætter værdien af "template" ind. Dette kan f.eks. bruges til at indsætte en fast overskrift eller et "Læs mere" link.

dataType string jsonp Hvordan returneres data. Kan antage en af følgende værdier: "jsonp" og "json". Brug "json", hvis servicen ligger på samme domæne eller leveres med CORS-header.
paramNames object

Det er muligt at angive en række parametre til den URL, der er angivet i host. I dette eksempel kan man enten kalde siden med denne widget med URL-parameteren =?planid=1234. Alternativt kan man på DIV elementet angive attributten data-widget-planid="1234":

"paramNames": {
    "key": "planid"
}
template string/object ""

Her angives en html-skabelon for, hvorledes en eventuel tilhørende tekst skal præsenteres. Attributter fra data kan angives i html-skabelonen med følgende notation <%= attributnavn %> - Læs mere om templates her.

className string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
layers array En liste med lag, der skal tændes når konfliktsøningen får et hit. Derudover bruges det til at "mapclick" kun udfører konfliktsøgningen, hvis et eller flere af de angivede lag, er tændte.
template_nohit string/object ""

Her angives en html-skabelon for, hvorledes en eventuel tekst skal præsenteres når der ikke er nogen hits. Dette kan bruges til at få fuld kontrol pver hvad der skal vises når konfliktsøgningen ikke finder noget. Hvis angivet, så ignoreres nohitmessage. Attributter fra konfigurationen af dette target, kan angives i html-skabelonen med følgende notation <%= attributnavn %> - Læs mere om templates her.

nohitmessage string Den tekst, der vises, hvis servicen returnerer en tom liste
errormessage string Den tekst, der vises, hvis servicen fejler
nolayermessage string Den tekst, der vises, hvis et relateret lag (layers) ikke er vist

Tegn i kortet (draw)

Giver brugeren mulighed for at tegne i kortet. Dette kan f.eks. bruges i forbindelse med konfliktsøgning og formular, men det kan også være relevant i forbindelse med integration til andre systemer.

Det er muligt at styre hvilken geometritype brugeren skal tegne med samt om man kan skifte mellem f.eks. punkt og linje. Det er muligt at benytte "escape" til at afbryde, "enter" til at afslutte (svarer til at dobbeltklikker i kortet) eller "ctrl+z" til at fortryde sidste klik i kortet.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
layer string

Angiv id på det lag, som geometrien skal tegnes i.

Laget skal være et helt almindeligt vektorlag. Hvis man blot vil have et tomt lag, kan man med fordel bruge noget i stil med:

{
    "id": "tegnelag",
    "edit": true,
    "features": true,
    "type": "geojson",
    "data": {
        "type": "FeatureCollection",
        "crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:EPSG::25832" } }, 
        "features": []
    },
    "features_dataType": "json",
    "features_style": {
        "namedstyle": "#004"
    }
}

Bemærk at laget har "edit": true </td> </tr>

clearOnDraw boolean false Skal laget tømmes for objekter hver gang der tegnes et nyt objekt.
modify boolean true Mulighed for at deaktivere redigering af geometri. Dette kan specielt være hensigtsmæssig når der tegnes enkeltpunkt.
type string Hvilke geometritype skal der tegnes med. Mulige værdier er: Point, LineString og Polygon.
buttons array

Hvis brugeren skal kunne skifte mellem hvilken geometritype, der skal tegnes med, er det muligt at angive en liste med knapper, der skal være tilgængelige

Til hver knap angives hvilken geometritype knappen skal vises. Derudover er det muligt at angive en tekst, der vises som tooltip på knappen. Hvis der er behov for at skifte ikoner, så kan det gøres med CSS, ved at angive et className

Det er også muligt at angive en knap af typen Complete, der viser en knap, som brugeren kan afslutte aktuelle tegning med. Knappen vises når brugeren har placeret de to første punkter i en linje eller de tre første funkter i en polygon.

"buttons": [
    {
        "text": "Tegn punkt",
        "type": "Point",
        "className": "mdi mdi-map-marker-plus"
    },
    {
        "text": "Tegn linje",
        "type": "LineString",
        "className": "mdi mdi-vector-line"
    },
    {
        "text": "Tegn polygon",
        "type": "Polygon",
        "className": "mdi mdi-vector-square"
    },
    {
        "text": "Afslut",
        "type": "Complete",
        "className": "mdi mdi-check"
    }
]

Filter (filter)

Filtrer hvilke objkekter der skal vises i kortet, lister m.m.

Vis f.eks. en eller flere slidere, der kan filtrere hvilke data, der vises i kortet. Filter funktionen benyttes sammen med userfilter på et vektorlag.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
title string Gør elementet mere tilgængeligt
detach 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.
combine boolean false Hvis to datasæt filtreres på samme kolonnenavn, så vil det første lag styre præsentationen af slideren, men brugerens ændring på slideren vil medføre filter på alle lag, der har et userfilter med samme navn.
hideOnLayerChange boolean false Skjul filteret hvis laget slukkes.

Flow (flow)

Brug Septimas højdeservice, til at se hvilken vej en væske flyder. Det kan f.eks. bruges til at se hvor, der skal sættes ind, hvis en gylletank lækker eller en tankvogn forulykker. Anvendelsen af denne funktion kræver at man har tilkøbt adgang til Septimas højdeservice..

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
apikey string En API-nøgle, som er gyldig til Septimas højdeservice. Denne service kan bruges til mange andre ting, end blot Septima Wiget. Skriv til kontakt@septima.dk for mere information om hvad servicen kan og hvad den koster.
raster string Navnet på den raster, der skal bruges i servicen. Kontakt Septima for yderligere information
layer string

Angiv id på det lag, som geometrien skal tegnes i.

Laget skal være et helt almindeligt vektorlag. Hvis man blot vil have et tomt lag, kan man med fordel bruge noget i stil med:

{
    "id": "tegnelag",
    "edit": true,
    "features": true,
    "type": "geojson",
    "data": {
        "type": "FeatureCollection",
        "crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:EPSG::25832" } }, 
        "features": []
    },
    "features_dataType": "json",
    "features_style": {
        "namedstyle": "#004"
    }
}

Zoom til startudsnit (fullextent)

Tilføjer en knap, så det er nemt for brugeren at komme tilbage til det sted hvor kortet startede.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
title string Angiv titlen på knappen. Dette er specielt anvendeligt hvis funktionen bruges på en side hvor sproget er andet end dansk.

Fullscreen (fullscreen)

Få kortet vist, så det fylder hele skrærmen.

Kun elementer, der er inden for kortet, vil blive vist. Det vil sige, at infoboksen, søgefelt og lignende vises som normalt, mens for eksempel listevisning ikke bliver vist

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
title string Angiv titlen på knappen. Dette er specielt anvendeligt hvis funktionen bruges på en side hvor sproget er andet end dansk.
selector string Det er muligt at angive en selector, der bestemmer hvilket element, der skal fylde hele skærmen. Bemærk at det kun må være ét element. Hvis selectoren vælger flere elementer, benyttes det første.

Google Street View (googlestreetview)

Vis Google Street View for et givent punkt i kortet.

For at benytte denne kontrol kræver det, at man har en API-key fra Google. Dette kan man få ved at gå ind på denne side.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
detach 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.
keepInFullscreen boolean 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.</td> </tr>
APIKey string PÅKRÆVET - API-key fra Google
showOnLoad boolean false Vis Google Street View fra start, når kortet loades
heading number 0 Hvilken retning skal Street View starte med at kigge. 0 er mod nord
pitch number 0 Hvilken hældning skal Street View starte med at kigge. 0 er vandret
radius number 50 Angiver hvor stor en radius, der skal søges efter et Street View fra det markerede punkt. Hvis ikke der findes et Street View inden for denne radius, bliver brugeren gjort opmærksom på det.
features_style object Hvordan skal punktet styles i kortet. Det er for eksempel muligt at angive sti til ikon

Tooltip i kortet (hover)

Få vist en simple infoboks når musen føres over objekter i kortet.

Tilføj template_hover til laget for at bestemme hvad der bliver vist i den simple infoboks.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.

HTML (html)

Tilføj indhold til din hjemmeside ud fra data. Det kan bruges til at vise forklaringer, billeder m.m. på siden ud fra indlæste data.

For at benytte denne kontrol kan der på div-elementet tilføjes en attribut, der fortæller hvilken nøgle, der skal benyttes for at hente de ønskede objekter, der ønskes vist i kortet. Angiv div-elementet på denne måde: <div data-widget="..." data-widget-key="2277350"></div>, hvor data-widget-key indeholder nøglen. Dette foregår på samme måde som for kommuneplan funktionen.
Det er ligeledes muligt at angive URL-parameteren widget-key med nøglen (for eksempel widget-key=2277350).

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
html string Angiver den URL, der skal benyttes til at finde et eller flere objekter. I URL'en er det muligt at angive <%= key %> eller <%= filter %> substitueres de af værdier fra parameteren key eller keyfilter.
host string Angiver den URL, der skal benyttes til at finde et eller flere objekter. I URL'en er det muligt at angive en template, hvor man eksempelvis skriver <%= key %>, der substitueres de af værdier fra parameteren key.
type string geojson Hvilket format kommer data i. Kan antage en af følgende værdier: "geojson", "esrijson", "json", "djangojson", "datasourcejson" samt "local". Ved "local" søges der i de features, der allerede er tilføjet til kortet.
dataType string jsonp Hvordan returneres data. Kan antage en af følgende værdier: "jsonp" og "json". Brug "json", hvis servicen ligger på samme domæne eller leveres med CORS-header.
paramNames object

Det er muligt at angive en række parametre til den URL, der er angivet i host. I dette eksempel kan man enten kalde siden med denne widget med URL-parameteren =?planid=1234. Alternativt kan man på DIV elementet angivet attributten data-widget-planid="1234":

"paramNames": {
    "key": "planid"
}
template string/object ""

Her angives en html-skabelon for, hvorledes en eventuel tilhørende tekst skal præsenteres. Attributter fra data kan angives i html-skabelonen med følgende notation <%= attributnavn %> - læs mere om templates her.

template_feature string ""

Her angives en html-skabelon for, hvorledes hver feature, som host returnere, skal præsenteres. Attributter fra hver feature kan angives i html-skabelonen med følgende notation <%= attributnavn %> - læs mere om templates her.

activateButton object

Aktivér HTML'en 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:

"activateButton": {
    "title": "Vis signaturforklaring",
    "className": "my-style",
    "html": ""
}
reloadInterval number Genindlæs data med et fast interval. Intervallet angives i millisekunder og kan f.eks. bruges til at vise "live" data.

Billede (image)

Vis et billede på din hjemmeside. Det kan f.eks. bruges til at vise en generel signaturforklaring.

Samme funktionalitet kan opnås gennem funktionen HTML, hvor der er flere muligheder

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
detach 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.
url string URL til billedet.
altText string Alternativ tekst, der vises hvis billedet ikke hentes korrekt. Bruges også i forbindelse med tilgængelighed, så en skærmlæser kan fortælle brugeren hvad billedet viser.
activateButton object

Aktivér billedet 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:

"activateButton": {
    "title": "Vis signaturforklaring",
    "className": "my-style",
    "html": ""
}

Info (info)

Få vist en infoboks når brugeren klikker på et objekt i kortet.

Kontrol, der styrer, om der skal være info på data, og om det skal vises, når musen føres over data eller ved at klikke på data. Tilføj blot template_info til laget for at bestemme indholdet af infoboksen.
I sin template er det muligt at tilføje forskellige funktioner ved at angive en attribut på et HTML-element. Det kan f.eks. være data-widget-toggle="udvid" der gør at klasses på infoboksen skifter til "udvid" når der klikkes på elementet. Hvis man angiver data-widget-close="true", så lukkes infoboksen, når der klikkes på dette element. Hvis data-widget-carousel="true" tilføjes, kan der oprettes en karrusel, der f.eks. kan bruges til at vise billeder. Dette kan dog kræve lidt CSS kendskab.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
detach 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.
eventtype string/array Typen af interaktionen. Gyldige værdier: "hover", "click", "featureselected" eller "mapclick". Ved "mapclick", søges der også via en service, hvis der er angivet en "features_infohost" på laget. Ved "featureselected" kommer infoboksen frem hvis et objekt vælges via f.eks. listevisningen
type string cloud Hvordan skal info vises. Gyldige værdier: "popup" og "cloud".
closeButton boolean false Vis en lukknap i infoboksen. Når brugeren klikker på knappen, lukkes boksen og markeringen fjernes. Bemærk at denne funktion pt. ikke er hensigtsmæssig hvis man samtidig har sat multifeature til mere end 1.
autoPan boolean true Kan benyttes ved "type": "cloud". Skal kortet automatisk panorere så infoboksen er inden for kortets udsnit?
scrollTo boolean true Kan benyttes ved "type": "popup" samt hvor infoboksen er detached. Skal browseren scrolle til infoboksen uden for kortet, når et objekt vælges i kortet?
multifeature integer 1 Hvis der ligger flere vektorfeatures i samme punkt, er det som default kun den øverste features, der rammes. Ved at angive "multifeature", er det muligt at bestemme hvor mange features, der skal vises info på. Hvis der er flere features, listes de over hinanden i infoboksen. Det er en god idé at begrænse antallet ved at sætte denne parameter til eksempelvis 5. Herved er det kun de 5 øverste features, der vises information for.
offset array [0,0] Kan benyttes ved "type": "cloud". Hvordan skal infoboksen placeres i forhold til den feature, man har klikket på. Default [0,0] er lidt over featuren. Det første tal er i x-aksens retning, mens det andet tal er i y-aksens retning. Det er også muligt at angive template_info_offset på et lag, hvis dette offset skal være forskelligt fra lag ti lag.
service object/array Et objekt, der indeholder "url" og "type" med henholdsvis url'en, der skal kaldes ved "mapclick", og hvilken type servicen er. Typen kan pt være "spatialsuite", men på sigt kunne det være andet såsom "WFS".
zoomOptions object Hvis angivet, så zoomes der til objektet når det er valgt. Det er muligt at angive, hvordan der skal zoomes til objektet i kortet.

Kommuneplan (kommuneplan)

Hent oplysninger direkte fra Plandata.dk og få oplysingerne vist så de er til at forstå for brugeren.

For at benytte denne kontrol skal der på div-elementet tilføjes en attribut, der fortæller hvilket planid, der ønskes vist. Angiv div-elementet på denne måde: <div data-widget="..." data-widget-key="2277350"></div>, hvor data-widget-key indeholder planid.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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.
detach 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.
filter string Angiv et alternativt CQL filter, der benyttes til at hente den enkelte kommuneplanramme. Default filter er: planid=<%= key %>, hvor <%= key %> bliver erstattet af det valgte planid
layer string Navnet på laget, der indeholder kommuneplanrammen. Default er theme_pdk_kommuneplanramme_vedtaget_v
key string Alternativ måde at angive hvilken kommuneplanramme, der skal vises. Angiv et planid her, og det vil blive benyttet, hvis der ikke er angivet data-widget-key på på div-elementet
features_style object Hvordan skal objekterne styles i kortet, når de er fundet
mode string readable Teksten for planen kan vises på flere måder. Som standard vises en prosatekst, der er dannet ud fra attributter på planen. Her er mode angivet med værdien readable. Hvis man gerne vil have oplysingerne vist som en læsbar liste, angives værdien readablelist.
urlParamNames object

Det er altid muligt at angive hvilken kommuneplanramme, der skal vises, ved at kalde med URL-parameteren widget-key med planid som værdi. Hvis URL-parameteren skal hedde noget andet, er det muligt at angive det i konfigurationen via urlParamNames. På denne egenskab kan man angive hvilken URL-parameter, der skal benyttes i stedet for widget-key:

"urlParamNames": {
    "mode": "mode",
    "key": "planid",
    "layer": "kommuneplanlag"
}

Hvis parameteren ikke findes, benyttes værdien fra data-widget-key på på div-elementet eller key i konfigurationen.

På samme måde er det muligt at angive hvilket lag fra Plansystem, der skal hentes data fra. Dette gøres tilsvarende med widget-layer.

Hvis parameteren ikke findes, benyttes værdien fra data-widget-layer på på div-elementet

Tilsvarende er det muligt at angive hvilket "mode", data skal vises i. Dette gøres med parameteren widget-mode.

Hvis parameteren ikke findes, benyttes værdien fra data-widget-mode på på div-elementet

Lagvælger (layerswitch)

Almindelig lagvælger med mulighed for at tilføje grupper m.m.

Kontrol, der gør at brugeren kan tænde og slukke for de enkelte lag. Derudover vises signaturen for vektorlagene

Hvis man gerne vil bruge et specielt ikon for et lag i lagvælgeren, er det muligt at angive legendConfig på laget. Herved kommer ikonet ud for lagets navn i lagvælgeren:

"legendConfig": {
    "icon": "https://septima.dk/widget/img/ortofoto.png"
}
"legendConfig": {
    "svgIcon": "<svg width='32px' height='43px' viewBox='0 0 32 43' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'>...</g></svg>"
}

Hvis man i stedet vil have en egenlig signatur under teksten for laget, tilføjes følgende til konfigurationen til laget:

"legendConfig": {
    "img": "https://geoserver.plandata.dk/geoserver/ows?service=WMS&request=GetLegendGraphic&format=image%2Fpng&width=20&height=20&layer=theme_pdk_lokalplan_vedtaget_v"
}

Tilsvarende er det muligt at angive en inline SVG på denne måde:

"legendConfig": {
    "svg": "<svg width='32px' height='43px' viewBox='0 0 32 43' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'>...</g></svg>"
}

Hvis man bruger Spatial Suite, så er der nogle lidt mere avancerede muligheder med signaturforklaringen. Det betyder bl.a. at signaturforklaringen er dynamisk afhængig af zoomneveau m.m. For at bruge signaturen fra Spatial Suite, tilføjes følgende til konfigurationen til laget. Derudover skal "id" på laget være navnet på temaet, der skal vises signatur for. Det er dog en forudsætning af man har Widget modulet til Spatial Suite.

"legendConfig": {
    "type": "sps",
    "host": "https://sps-demo.septima.dk",
    "profile": "septima"
}

Hvis man vil have fuld kontrol over hvad der skal være i lagvælgeren for dette lag, kan man tilføje html på denne måde:

"legendConfig": {
    "html": "<div class='my-layer-class'><div class='widget-layerswitch-text'>Lokalplaner</div></div>"
}

Herunder findes en beskrivelse af de enkelte egenskaber, der kan sættes på lagvælgeren.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
title string Gør elementet mere tilgængeligt
detach 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.
keepInFullscreen boolean 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.</td> </tr>
layers string/array Angiv, hvad der skal vises i lagvælgeren. Ved at angive "all" vises alle lag. Ved at angive "vectors" vises kun vektorlagene. Ved at angive "images" vises billedlagene (WMS og WMTS). Derudover er det muligt at angive et array af id'er på udvalgte lag. Dette kræver, at der er angivet et id på lagene. For at få vist to specifikke lag angives det på denne måde: ["lag1","lag2"].
excludeLayers array Fravælg hvilke lag, der ikke skal vises i lagvælgeren. Det muligt at angive et array af id'er på udvalgte lag, der ikke skal vises. Dette kræver, at der er angivet et id på lagene. For at ekskludere to specifikke lag angives det på denne måde: ["lag1","lag2"]. Dette er specielt hensigtmæssigt, hvis layers er sat til all.
showbuttons boolean true Ved at sætte "showbuttons": false deaktiveres muligheden for at tænde og slukke for lagene.
showlegend boolean true Ved at sætte "showlegend": false vises signaturen ikke for lagene.
showheader boolean false Ved at sætte "showheader": true vises der en overskrift for lagvælgeren og det er muligt for brugeren at vise/skjule lagvælgeren ved at klikke på overskriften.
showheaderCollapsed boolean false Kun når showheader er sat. Ved at sætte "showheaderCollapsed": true vises der en overskrift for lagvælgeren, som brugeren kan klikke på for at vise selve lagvælgeren.
showheaderCollapsedAccordion boolean false Kun når showheader er sat. Ved at sætte "showheaderCollapsedAccordion": true fungerer en overskrift i lagvælgeren som en accordion. Det betyder at når brugeren klikke på overskriften, så foldes den ud og de andre overskrifter foldes sammen.
selectAll boolean/string false Ved at sætte "selectAll": true vises der en knap, der gør det muligt at tænde/slukke for alle lag i lagkontrollen på en gang. Hvis man angiver en tekst, er det muligt at styre hvilken tekst, der skal vises. F.eks. "selectAll": "Vis/skjul alle lag"
type string list Angiver, hvordan lagvælgeren skal vises. Gyldige værdier: "list" eller "dropdown". Ved list bliver lagvælgeren vist som en liste, hvor man kan klikke på de enkelte rækker i listen og herved vise/skjule det pågældende lag. Ved dropdown er listen skjult, og brugeren kan trykke på en "knap" for at få vist listen.
expand string up Ved "type": "dropdown". Skal dropdown folde op eller ned. Gyldige værdier: "up" eller "down".
dropdownlimit number 3 Ved "type": "dropdown". Hvor mange lag må der højst blive vist, før der kun vises, hvor mange der er.
dropdowntext string Ved "type": "dropdown". Angiv en statisk tekst i dropdown menuen. Hvis "dropdowntext" ikke er angivet, vises der en tekst, der er afhængig af hvor mange lag, der er valgt.
activateButton object

Skjul lagvælgeren fra start men gør det muligt for brugeren vise lagvælgeren 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:

"activateButton": {
    "title": "Vis signaturforklaring",
    "className": "my-style",
    "html": ""
}
tabindex boolean false Sæt til true hvis man skal kunne tabulere sig frem og tilbage i listen med lag. Dette gør at der kommer en "outline" på elementet i lagvælgeren når det kommer i fokus og gør derved listen mere tilgængelig.
layerOrder boolean false Brug rækkefølgen i layers i lagvælgeren og ikke den rækkefølge, som lagene i kortet har.
groups array

Opret grupper i lagvælgeren. Konfigurationen er en liste (array) af objekter, der hver definerer title, id, type, expanded, layers og showCount. Der er dermed muligt at udvælge hvilke lag, der skal være i hver gruppe. Her er et eksempel på, hvordan groups kan angives:

"groups": [
    {
        "title": "Baggrundskort",
        "type": "radio",
        "expanded": false,
        "layers": ["lag1","ortofoto"],
        "showCount": false
    },
    {
        "title": "Børn og unge",
        "type": "check",
        "expanded": true,
        "layers": ["kommunegraense","skoledistrikter","boernehaver","skoler"],
        "showCount": true
    }
]

Med denne opsætning lagene med id "lag1" og "ortofoto" blive vist i den første gruppe mens de fire andre lag vil blive vist i den anden gruppe. Den første gruppe vil være klappet sammen fra start, mens den anden gruppe vil være foldet ud. Den første gruppe har typen "radio", hvilket betyder at et klik på et lag i denne gruppe, medfører at de andre lag slukkes.

title er overskriften i gruppen.

type bestemmer om der kan vælges en eller flere lag i gruppen.

expanded angiver om gruppen skal være foldet ud fra start.

layers relaterer sig til hvilke lag, gruppen skal indeholde. Dette er en liste med id'er på lagene.

showCount sat til true betyder at antallet af lag samt antallet af tændte lag i en gruppe vises. Herved er det muligt at se lidt mere om hvad den pågældende gruppe indeholder. Som default bliver antallet ikke vist.

paramNames object

Det er muligt at angive en række parametre, der styre hvordan lagvælgeren opfører sig.

Pt. er det muligt at angive en liste med ID'er på lag (adskilt af komma), der skal vises. Det er kun lag, der er med i lagvælgeren, det er muligt at styre. I dette eksempel kan man enten kalde siden med denne widget med URL-parameteren =?visiblelayers=lag1,lag4 for at de to lag. Alternativt kan man på DIV elementet angivet attributten data-widget-visiblelayers="lag1,lag4":

Tilsvarende er det muligt at angive hvilke grupper, der skal være foldet ud (expanded). Det gøres som ved "layers" blot med "groups". Hvis parameteren er angivet, vil den styre grupperne, ellers vil værdien angivet i expanded styre det.

"paramNames": {
    "layers": "visiblelayers"
    "groups": "expandedgroups"
}
Bemærk For at få vist signaturen for vektorlag, skal laget indeholder features_type. Se hvilke typer det kan være under layer

Skift baggrundskort (layertoggle)

Skift baggrundskort i stil med Google Maps.

Knap, der gør, at brugeren kan skifte (toggle) mellem forskellige baggrundskort, der er angivet i konfigurationen. For at et lag kommer med i denne knap, skal der på laget angives legendConfig hvor icon er angivet:

"legendConfig": {
    "icon": "https://septima.dk/widget/img/ortofoto.png"
}

Derudover er det vigtigt at sætte visible til true på det lag, der skal vises fra start og false for det lag, der skal være skjult fra start.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
layers array all Vælg hvilke lag, der skal vises i lagvælgeren. Det muligt at angive et array af id'er på udvalgte lag, der skal vises. Dette kræver, at der er angivet et id på lagene. For at vælge to specifikke lag angives det på denne måde: ["lag1","lag2"]. Som default vises alle lag, der har et id samt legendConfig.
excludeLayers array Fravælg hvilke lag, der ikke skal vises i lagvælgeren. Det muligt at angive et array af id'er på udvalgte lag, der ikke skal vises. Dette kræver, at der er angivet et id på lagene. For at ekskludere to specifikke lag angives det på denne måde: ["lag1","lag2"]. Som default vises alle lag, der har legendConfig.

Zoom til (locate)

Zoom til data. Det kan f.eks. bruges til at vise et kort, der er zoomet ind på en bestemt børnehave. Men det kan også bruges til at zoome ind til et bestemt område i kortet ud fra et ID.

Få kortet til automatisk at vise et bestemt objekt i kortet. Det kan for eksempel bruges i forbindelse med visning af et kort for et bestemt område på en hjemmeside.

For at benytte denne kontrol kan der på div-elementet tilføjes en attribut, der fortæller hvilken nøgle, der skal benyttes for at hente de ønskede objekter, der ønskes vist i kortet. Angiv div-elementet på denne måde: <div data-widget="..." data-widget-key="2277350"></div> hvor data-widget-key indeholder nøglen. Dette foregår på samme måde som for kommuneplan funktionen.

Det er ligeledes muligt at angive URL-parameteren widget-key med nøglen (for eksempel widget-key=2277350)

Hvis URL-parametrene x og y eller wkt er angivet, benyttes det som geometri til funktionen. Derudover kan minResolution angives. Herved er det nemt at få vist en widget ud fra en koordinat. Brug parameteren srs hvis geometrien er i en anden projektion.

Tilsvarende kan div-elementet indeholde attributterne som f.eks. <div data-widget="..." data-widget-x="12.5705286" data-widget-y="55.6770083" data-widget-srs="EPSG:4326"></div> og få samme funktionalitet.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
host string Angiver den URL, der skal benyttes til at finde et eller flere objekter. I URL'en er det muligt at angive en template, hvor man for eksempel skriver <%= key %>, der substitueres de af værdier fra parameteren key.
type string geojson Hvilket format kommer data i. Kan antage en af følgende værdier: "geojson", "esrijson", "json", "djangojson", "datasourcejson" samt "local". Ved "local" søges der i de features, der allerede er tilføjet til kortet.
dataType string jsonp Hvordan returneres data. Kan antage en af følgende værdier: "jsonp" og "json". Brug "json", hvis servicen ligger på samme domæne eller leveres med CORS-header.
paramNames object

Det er muligt at angive en række parametre til den URL, der er angivet i host. I dette eksempel kan man enten kalde siden med denne widget med URL-parameteren =?planid=1234. Alternativt kan man på DIV elementet angive attributten data-widget-planid="1234":

"paramNames": {
    "key": "planid"
}
requiredParams array

Ved at angive en liste med påkrævede parametre, der skal være angivet for at servicen kaldes, kan man begrænse hvad der bliver kaldt med. Dette er et eksempel, der kræver at "planid" skal være angivet som parameter:

"requiredParams": ["planid"]
template string ""

Her angives en html-skabelon for, hvorledes en eventuel tilhørende tekst skal præsenteres. Attributter fra data kan angives i html-skabelonen med følgende notation <%= attributnavn %> - Læs mere om templates her.

eventtype string For at aktivere locate når der klikkes på en features i kortet, sættes eventtype til click. Samtidig skal der på laget, der klikkes på, være angivet template_locate. Denne template bruges til at hente værdien fra det objekt der er klikket på. Værdien bruges så til at udføre en helt almindelig locate.
pageTitle string

Her angives en skabelon for, hvad titlen på siden skal skiftes til. Attributter fra data kan angives i skabelonen med følgende notation <%= attributnavn %> - Læs mere om templates her.

zoomOptions object Hvis angivet, så zoomes der til objektet når det er valgt. Det er muligt at angive, hvordan der skal zoomes til objektet i kortet.
features_style object Hvordan skal objekterne styles i kortet, når de er fundet
input object Giv brugeren mulighed for at indtaste en vilkårlig geometri og få den vist i kortet. Det kan være WKT, GeoJSON, en koordinat eller en BBOX.
prefilter array

Tilføj et filter på data, der er hentet fra en service. Herved er det muligt kun at zoom til udvalgte data i kortet. prefilter består af en liste af udtryk, der alle skal være opfyldt for at en feaure vises.

Følgende operationer kan anvendes: =, !=, <, >, <=, >=, in, notin og tilføjes som vist her:

"prefilter": [ 
    {"name": "type", "op": "!=", "val": "test"},
    {"name": "klynge_id", "op": "=", "val": 101}
]

Aktuelle position (location)

Zoom til brugerens aktuelle GPS position. Kan bruges til blot at flytte kortet til et relevant sted, men positionen kan også bruges til at foretage en konfliktsøgning.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
zoomOptions object Hvis angivet, så zoomes der til objektet når det er valgt. Det er muligt at angive, hvordan der skal zoomes til objektet i kortet.
features_style object Hvordan skal objekterne styles i kortet, når de er fundet. Objektet indeholder oplysninger om nøjagtighed, hastighed, højde of retning. Det kan bruges til at style markeringen efter. Parametrene er: accuracy, speed, alltitude og heading
onStart boolean true Skal der zoomes ind til aktuelle position ved opstart af kort.
onClick boolean false Skal der tilføjes en knap, der giver brugeren mulighed for at zoomes ind til aktuelle position, når det passer ham.
silent boolean false Skal positionen bruges til at aktivere andre funktioner. I nogle tilfælde kan aktuelle position forstyre andre funktioner, og det kan derfor være nødvendigt at deaktivere handlingen, men stadig vise positionen i kortet.
className string Bruges sammen med "onClick" til at styre hvilket ikon, der skal vises på knappen.
title string Bruges sammen med "onClick" til at titlen på knappen. Dette er specielt anvendeligt hvis funktionen bruges på en side hvor sproget er andet end dansk.
distance number 0 Hvor meget skal man bevæge sig før prikken i kortet skal flytte sig. Dette er spcielt anvendeligt når aktuelle position benyttes i forbindelse med f.eks. konfliktsøgning eller find nærmeste.
follow boolean false Skal kortet følge med når brugeren bevæger sig. Hvis brugeren bevælger sig uden for det viste kortudsnit, centreres kortet om brugerens position. Herved flytter kortet sig ikke hele tiden, men først når man kommer for langt væk.
paramNames object

Det er muligt at angive en række parametre, der styre hvordan funktionen konfigureres. Pt. er det muligt at angive værdien for onStart og onClick med URL-parameteren =?location.onStart=true&location.onClick=false. Alternativt kan man på DIV elementet angivet attributten data-widget-location.onStart="true" og data-widget-location.onClick="false". Det kræver at man angiver følgende i konfigurationen:

"paramNames": {
    "onClick": "location.onClick",
    "onStart": "location.onStart"
}
Bemærk De fleste nye browsere har en begrænsning, der gør at de kun tillader brugerens aktuelle position, hvis sitet benytter HTTPS. Derfor vil denne funktion ofte ikke virker, med mindre dette er tilfældet.

Mål afstand og areal (measure)

Tilføj et måleværktøj til kortet, så det er muligt at måle afstande og arealer.

Med dette værktøj giver du brugeren mulighed for at måle afstande og arealer ved at tegne linjer eller flader i kortet. Du kan selv styre hvordan resultatet skal vises via en template. Det er muligt at benytte "escape" til at afbryde, "enter" til at afslutte (svarer til at dobbeltklikker i kortet) eller "ctrl+z" til at fortryde sidste klik i kortet.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
template string ""

Her angives en html-skabelon for, hvorledes målene skal præsenteres for brugere. Målene kan ses ved at tilføje "debug": true i konfigurationen og kan angives i html-skabelonen med følgende notation <%= formatted.html %> - Læs mere om templates her.

Fælgende parametre kan benyttes i templaten:

{
    "vertices": 4,
    "area": 108178.75732421875,
    "last": 1231.1360836260728,
    "length": 2966.6013881474846,
    "formatted": {
        "distance": "2,97",
        "distanceUnit": "km",
        "area": "108179",
        "areaUnit": "m2",
        "html": "Areal: 108179 m2"
    }
}

modify boolean false debug kan bruges i forbindelse med opsætningen og gør det muligt at se hvad man har adgang til i sin template. Når debug er sat til true, så kommer alle tilgængelige informationer ud i konsollen i browseren.
debug boolean false debug kan bruges i forbindelse med opsætningen og gør det muligt at se hvad man har adgang til i sin template. Når debug er sat til true, så kommer alle tilgængelige informationer ud i konsollen i browseren.
features_style object Kan angives hvis man gerne vil have at det tegnede i kortet skal se anderledes ud.
buttons array

Angiv én eller to knapper, der aktivere måleværktøjet. Den ene knap er til at måle afstande med mens den anden er til at måle arealer med.

Til hver knap angives hvilken geometritype knappen skal aktivere. Brug LineString for at måle afstande eller polygon for at måle arealer. Derudover er det muligt at angive en tekst, der vises som tooltip på knappen. Hvis der er behov for at skifte ikoner, så kan det gøres med CSS, ved at angive et className. Hvis className ikke angives benyttes der et default ikon

"buttons": [
    {
        "text": "Mål afstand",
        "type": "LineString",
        "className": "mdi mdi-vector-line"
    },
    {
        "text": "Mål areal",
        "type": "Polygon",
        "className": "mdi mdi-vector-square"
    }
]

Aktivér kort (overlay)

Skal brugeren aktivere kortet inden brug? Dette er specielt hensigtsmæssigt i forbindelse med scroll på mobile enhender, men også når brugeren scroller med musehjulet. Her vil denne funktion forhindre, at der hovedløst zoomes eller panoreres i kortet.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
activateTitle string Aktiver kort Med activateTitle er det muligt at styre hvilken title, der bliver vist på knappen når kortet er inaktivt.
deactivateTitle string Deaktiver kort Med deactivateTitle er det muligt at styre hvilken title, der bliver vist på knappen når kortet er aktivt.
activateText string Aktiver kortet Med activateText er det muligt at styre hvilken tekst, der bliver vist på knappen når kortet er inaktivt.
onlyOnce boolean false Skal knappen forsvinde når brugeren først har aktiveret kortet. Herved kan kortet ikke deaktiveres igen.

Oversigtskort (overviewmap)

Vis et oversigtskort for det aktuelle kortudsnit.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
detach 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.
keepInFullscreen boolean 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.</td> </tr>
showOnLoad boolean false Vis oversigtskortet fra start, når kortet loades
layer array En liste af lag, der skal vises i oversigtskortet. Bemærk at lagene skal være i samme projektion som kortet.
viewOptions object

Angiv hvordan oversigtskortet skal agere når brugeren navigerer i kortet. Det kan f.eks. være hvilke resolutions, der skal hoppen mellem:

"viewOptions": {
    "resolutions": [1600, 1000]
}

Alle options, der er angivet her kan benyttes.

activateButton 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:

"activateButton": {
    "title": "Vis signaturforklaring",
    "className": "my-style",
    "html": ""
}

Udskriv (print)

Udskriv kortet som PDF.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
title string Print Tooltip på knappen.
templates array []

Her angives hvilke formater, der skal kunne udskrives i. P.t. er det kun muligt at angive ét format.

Som default oprettes der et PDF-dokument med kortet. I templates angives hvor stort kortet skal være samt opløsningen. Bemærk at det kan tage lidt tid at generere dokumentet, hvis opløsningen er høj. Angiv orientation til enten "langscape" (default) eller "portrait". Derudover er det muligt at angive parpirformatet med format til f.eks. "a4" (default).

Angiv filename med navnet på den fil, der bliver dannet. Filnavnet skal inkludere formartet, f.eks. pdf.

Det er også muligt at udskrive som et billede. Dette gøres ved at angive outputformat med værdien image.

"templates": [{
    "name":"Udskriv i A4 liggende",
    "orientation": "landscape",
    "format": "a4",
    "ppi": 150,
    "map_height": 210,
    "map_width": 297
}]

Hvis man har en service, der kan generere en udskrift af kortet, er dette også muligt. Det kan f.eks. være QGIS Server, Geoserver eller Spatial Suite. Det kræver dog, at servicen indeholder alle lag, der skal udskrives:

"templates": [{
    "name": "Udskriv i A4 liggende",
    "map_height": 187,
    "map_width": 277,
    "url": "https://kort.haderslev.dk/spatialmap?page=print.pdf.new&mapheight=&mapwidth=&map_size= &mapext=&layers=&opacities=1&scalebarname=pdf&pageformat=a4&orientation=landscape&map_resolution=200&printscale=8&pdfprintlegend=true&printformats=a4_landscape&map_angle=360&ppi=200&titleblock=true&copyrighttext=&date=&profile=widget_kp17"
}]

Find nærmeste (route)

Find de nærmeste objekter i kortet ud fra f.eks. en adresse, brugerens aktuelle position eller et klik i kortet.

For at styre hvad der bliver vist i listem med nærmeste, tilføjes template_route på laget. Her har man adgang til alle atributter på data. Det kan bruges til f.eks. at vise navnet på børnehaven m.m.

Ud over navnet vises afstanden og tiden. Hvis man gerne vil styre hvordan afstand/tid vises, er det muligt ved at tilføje template_route_time. Her har man adgang til dist samt time, så man kan vise præcist hvad man har brug for.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
detach 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.
keepInFullscreen boolean 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.</td> </tr>
apikey string En apinøgle, som er gyldig til Septimas rutewebservice
profile string car Angiver den ruteprofil, der anvendes fra ruteservicen. "car" beregner bilruter, "bicycle" beregener cykelruter, "foot" beregner for gående, mens "bus" beregner for kørsel med større køretøjer. Derudover er det også muligt at benytte "air", der beregner afstanden via luftlinje. Ved luftlinje vil tiden være beregnet ud fra en hastighed på 7,2 km/t (2000 ms/m)
profileselect objekt

Giver brugeren mulighed for at skifte mellem forskelige ruteprofiler

"profileselect": [
    {"name": "Bil", "value": "car", "icon": "car"},
    {"name": "Cykel", "value": "bicycle", "icon": "bike"},
    {"name": "Gang", "value": "foot", "icon": "walk"},
    {"name": "Lastbil", "value": "bus", "icon": "truck"},
    {"name": "Luftlinje", "value": "air", "icon": "air"}
]
limit integer 3 Antallet af nærmeste, der skal vises i listen
template string Angiver den html-template, der anvendes til at præsentere 'find nærmeste' resultater. Hvis ikke angivet, så vises listen uden overskrift og formatering. Med template kan man styre det, der ligger uden om listen. Det kunne være en overskrift samt en forklarende tekst. Læs mere om templates generelt her. For denne template er der to tilgængelige attributter; <%= title %> og <%= content %>, hvor <%= title %> benyttes til at skrive, hvor ruten starter, mens <%= content %> er dér, hvor listen indsættes. De enkelte rækker i listen styres af template_route på laget.
zoomOptions object Hvis angivet, så zoomes der til objektet når det er valgt. Det er muligt at angive, hvordan der skal zoomes til objektet i kortet.
animate object

Indstillinger for animationen af ruten i kortet.

"animate": {
    "duration": 600
}
prioritizeWithinGeometry object

Brug den valgte geometri til at finde én polygon med via en service. Alle punkter inden for denne polygon, bliver prioriteret højere end andre, og vises øverst i listen.

"prioritizeWithinGeometry" skal være et objekt, der indeholder "host" samt "type" i stil med dette:

"prioritizeWithinGeometry": {
    "host": "//myservice.dk/gis/rest/.../query?...&where=wkt=POINT(%20)",
    "type": "esrijson"
}
data objekt

Skal beregningen foregå ved opstart, gøres det ved at tilføje "data" direkte til funktionen. Data bliver ikke vist nogen steder og bruges kun til beregning af de nærmeste.

"data": {
    "type": "FeatureCollection",
    "crs": { "type": "name", "properties": {"name": "urn:ogc:def:crs:EPSG::25832"}},
    "features": [{
        "type": "Feature",
        "properties": {},
        "geometry": {
            "type": "Point",
            "coordinates": [724509,6175921]
        }
    }]
}

Rute (routing)

Beregn ruter mellem to punkter i kortet. Det er muligt at klikke i kortet eller søge et punkt via søgefeltet.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
detach 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.
keepInFullscreen boolean 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.</td> </tr>
apikey string En API-nøgle, som er gyldig til Septimas rutewebservice.
header string Angiver den html-template, der anvendes til at præsentere i overskriften på boksen. Hvis ikke angivet, så vises der en default tekst. Teksten behandles som en template, hvor der er adgang til "profile", "dist" og "time". For denne template er følgende attributter tilgængelige; <%= profile %>, <%= time.s %>, <%= time.m %>, <%= time.h %>, <%= dist.distance %> og <%= dist.unit %>. De kan alle benyttes til at fortælle brugeren hvorlang ruten er og hvor lang tid det tager med den pågældende ruteprofil.
subheader string Angiver den html-template, der anvendes til at præsentere sammen med listen af punkter. Hvis ikke angivet, så vises der ikke nogen tekst. Med "subheader" kan man styre teksten under listen. Teksten behandles som en template, hvor der er adgang til "points". Herved kan teksten være afhængig af antallet af punkter. Læs mere om templates generelt her. For denne template er der to tilgængelige attributter; <%= title %> og <%= content %>, hvor <%= title %> benyttes til at skrive, hvor ruten starter, mens <%= content %> er dér, hvor listen indsættes. De enkelte rækker i listen styres af template_route på laget.
profile string car Angiver den ruteprofil, der anvendes fra ruteservicen. "car" beregner bilruter, "bicycle" beregener cykelruter, "foot" beregner for gående, mens "bus" beregner for kørsel med større køretøjer. Derudover er det muligt at benytte "air", som beregner luftlinjeafstanden mellem punkterne.
profileselect objekt

Giver brugeren mulighed for at skifte mellem forskelige ruteprofiler

"profileselect": [
    {"name": "Bil", "value": "car", "icon": "car"},
    {"name": "Cykel", "value": "bicycle", "icon": "bike"},
    {"name": "Gang", "value": "foot", "icon": "walk"},
    {"name": "Lastbil", "value": "bus", "icon": "truck"},
    {"name": "Luftlinjeafstand", "value": "air", "icon": "airplane"}
]
limit integer Antallet af destinationer, der skal vises i listen.
zoomOptions object Hvis angivet, så zoomes der til objektet når det er valgt. Det er muligt at angive, hvordan der skal zoomes til objektet i kortet.

Hvad, der skal søges i

Opsætningen til hver enkelt søgning.

Name type default description
type string Søg i adresser (address), CVR (cvr), Plandata.dk (plan), Septima Search Service (s3), S4 index (s4), GSearch fra Dataforsyningen (gsearch) eller i objekter i kortet (local)
minResolution number 3.2 Hvor langt skal der maksimalt zoomes ind til. Dette tal angives som antallet af meter, hver pixel er i dette zoomniveau.
options object

Afhængig af hvad der søges i, skal der angives en række parametre:

Til alle typer er det muligt at angive parameteren "minimumShowCount": 3 med et antal hits, der altid skal vises selvom der er flere. For adressesøgningen er denne værdi default 3, mens den for alle andre er 0.

Til "type":"dawa" eller "type":"address" kan angives med parameteren "highlightRoad": true, der bestemmer om man vil have markeret vejen i kortet når vejen vælges i listen. Derudover er det muligt at angive "kommunekode" for at begrænse søgningen til bestemte kommuner. Det kan f.eks. gøres med:

"kommunekode": "101"
Kommunekoden kan være en liste med kommunekoder, f.eks.:
"kommunekode": "101,161,163"

Til "type":"geosearch" er det muligt at angive "kommunekode" på samme måde som ved "type":"dawa". Derudover kan der angives "targets", der er et array af, hvad der skal søges i:

"targets": ["postdistrikter","matrikelnumre"]
. Det er ikke muligt at anvende "adresser" og "stednavne", da der er specelle drivere til det.

Til "type":"stednavn" kan der angives parameteren "kommunekode" på samme måde som ved "type":"dawa". Med denne type søges der i de officielle danske stednavne.

Til "type":"local" angives parametrene "singular", "plural", "displaynameProperty" samt "descriptionProperty".

Til "type":"s3" angives parametrene "host", samt "service".

Til "type":"s4" angives parametrene "host", samt "datasources".

Til "type":"cvr" er det muligt at angive "kommunekode" på samme måde som ved "type":"dawa".

Til "type":"plan" er det muligt at angive "kommunekode" på samme måde som ved "type":"dawa".

Til "type":"arcgis" angives parametrene "catalogUrl", "serviceName" samt "layers".

crs string EPSG:25832 Servicens koordinatreferencesystem defineret i EPSG, eksempelvis: EPSG:25832
geometryProxy object

Brug det fundet objekt (adresse) til at finde den geometri, der rent faktisk skal benyttes til f.eks. at markere i kortet. Både geometrien fra det fundet objekt samt oplysnignerne fra objektet, kan bruges i forbindelse med "host".

"geometryProxy" skal være et objekt, der indeholder "host" samt "type" i stil med dette:

"geometryProxy": {
    "host": "//myservice.dk/gis/rest/.../query?...&where=wkt=POINT(%20)",
    "type": "esrijson"
}

Det er muligt at angive "condition": "..." på "geometryProxy". Herved er det muligt at styre hvornår denne proxy skal kaldes. Indholdet i "condition" er en template, der tager inputtet fra den valgte vej, husnummer eller hvad der nu er valgt.

silent boolean false Skal valget af denne driver bruges til at aktivere andre funktioner som f.eks. Konfliktsøgning eller Find nærmeste.
layer string/object ""

Her angives id'et på det lag, der skal tændes når et objekt af denne type vælges i søgefeltet. Hvis flere lag skal tændes, angives en kommasepareret liste med id'er. Det er også muligt at angive en skabelon, der bruger det valgte objekts attributter til at danne lagnavnet med. Attributter fra data kan angives i skabelonen med følgende notation <%= attributes.kategori %> - læs mere om templates her.

iconURI string Bestem selv hvilket ikon, der skal vises i søgefeltet. Vædrien skal være en URI. Det betyder at billedet skal skrevet som tekst i stil med "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PS...".
popup object

Vis en popup for det markerede objekt.

"popup" skal være et objekt, der kan indeholder "delay", "template" samt "geometryOptions" (som beskrevet under features_style) i stil med dette:

"popup": {
    "delay": 1500,
    "className": "widget-map-popup"
    "template": "
<%= dist %> meter - <%= time %> sekunder
", "geometryOptions": { "type": "interiorPoint" } }
Vigtigt! Hvis du vil søge i lokale data, men bruge templates og styles fra data i stedet for at angive dem under søgefunktionen, er det muligt. Tilføj blot template_search_title og template_search_description til laget samt fjern "displaynameProperty" fra konfigurationen til funktionen.

Vis markering (showpoint)

Få et simpelt kort med markering af en adresse eller en koordinat.

For at benytte denne kontrol, kan der på div-elementet tilføjes en attribut, der fortæller hvilken adresse eller koordinat, der skal vises i kortet.

Angiv div-elementet på denne måde: <div data-widget="..." data-widget-address="frederiksberggade 19, 1459"></div> hvor data-widget-address indeholder en adresse.

Der er også muligt at angive en koordinat med data-widget-point="724472,6175908". Hvis der tilføjes data-widget-text="Septima" vil punktet få tilføjet en attribut, der hedder "text" og den vil indeholde værdien. Herved kan man bruge det sammen med sin template til at få vist f.eks. en infoboks. Hvis det er en adresse, der er angivet, vil alle attributter fra DAWA være tilgængelig. Det er f.eks. vejnavn, husnr m.fl.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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.
zoom number 10 Hvor langt skal der zoomes ind i kortet
zoomStyle string slow Angiver, hvordan der skal zoomes hen til objektet. Ved none vises kortet blot. Ved slow zoomes der langsomt hen til objektet (ca. 2 sekunder), fast zoomer hurtigt (ca. 1 sekund), mens faster zoomer meget hurtigt (ca 0,5 sekunder).
features_style object Hvordan skal punktet styles i kortet. Det er for eksempel muligt at angive sti til ikon
layer string Vedat angive et ID på et lag, bliver punktet tilføjet til laget i stedet for et midlertidigt lag. Herved er der flere muligheder for at kombinere det med andre funktioner

Historie (story)

Fortæl en historie med dine data. I stedet for blot at vise en masse prikker på et kort, kan man med denne funktion guide brugeren gennem oplysingerne.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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 string Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.
detach 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.
text string Den tekst, der bliver vist til at starte med.
zoomOptions object Hvis angivet, så zoomes der til objektet når det er valgt. Det er muligt at angive, hvordan der skal zoomes til objektet i kortet.

Swipe (swipe)

Sammenlign to lag i kortet vha. "Swipe" funktionen..

</tr>
Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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.
layers array Angiv en liste med id'er på udvalgte lag, der skal sammenlignes. Dette kræver, at der er angivet et id på lagene. Der skal angives to specifikke lag på denne måde: ["lag1","lag2"].
position number 0.5 Hvor skal den starte. Angiv et tal mellem 0 og 1.
orientation string vertical/td> Skal man swipe `vertical` eller `horizontal`.

Listevisning (table)

Vis data som en liste. Det er specielt anvendeligt hvis man gerne vil gøre sine data tilgængelig for synsbesværede og andre handicappede. Hvis listen vises sammen med et kort, er der interaktion mellem listen og kortet. Det betyder at når brugeren klikker på et objekt i kortet, scolles der til objektet i listen og der kommer en markering i listen. Hvis man klikker i listen, zoomes der til objektet i kortet.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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.
title string Gør elementet mere tilgængeligt
detach 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.
showlist boolean true Kan sættes til false hvis funktionalitet omkring listevisningen vil bibeholdes, men selve listen skal være skjult. Det er f.eks. til download af CSV fil.
showheader boolean false

Skal der vises en overskrift for listen. Hvis der er flere lister, kommer der en overskrift for hver liste. Hvis listen er tom, skjules overskriften.

Som default vises lagets "navn" (der der er angivet i "name"). Hvis man ønsker en alternativ overskrift, kan det styres ved at tilføje template_table_header til laget ellse ved at angive showheaderTemplate her. I denne template kan man skrive en fast tekst/HTML, som vises over listen.

Hvis man ønsker at få vist antallet af rækker i listen i overskriften, skal man blot tilføje et HTML-element med class='widget-table-header-count' til template_table_header/showheaderTemplate. Indholdet af dette element vil blive erstattet af et tal, der siger hvor mange rækker der er vist.

showheaderTemplate string

Hvis showheader er angivet, er det her muligt at angive en alternativ måde overskriften skal vises på. Templaten bliver kaldt med alle parametre fra laget. Det betyder at man f.eks. kan agive <h1><%= name %></h1> for at få vist en overskrift med et H1 element. Men det er herved også muligt at indsætte ikoner og meget mere.

showheaderCollapsed boolean

Kan bruges når showheader er true. Hvis den er angivet, vil det være muligt for brugeren at folde de enkelte lister sammen. Hvis showheaderCollapsed er true er listerne foldet sammen fra start, mens de er foldet ud hvis showheaderCollapsed er false. Som default er det ikke muligt for brugeren at folde listerne sammen.

showheaderCollapsedAccordion boolean false

Kan bruges når showheader er true og showheader er angivet. Hvis showheaderCollapsedAccordion er true, vil de enkelte lister fungere som en accordion. Det betyder at der kun vises én liste ad gangen. Når brugeren folder en liste ud, så foldes de andre sammen.

updateHeaderOnFilterChange boolean false

Kan bruges når showheader er true og template_table_header er angivet på laget. Hvis updateHeaderOnFilterChange er true, vil templaten blive kaldt hver gang filteret opdateres. Herved kan overskriften på listen være afhænig af det aktuelle filter.

downloadCSV boolean/string false Kan bruges når showheader er true. Vis en download-knap i overskriften for en liste. Når brugeren trykker på knappen, så hentes data som en CSV-fil. Hvis downloadCSV er en tekst, så vil teksten blive vist på knappen i stedet for det ikon, der default vises.
download object

Download funktionen gør det muligt at hente data som CSV eller PDF (tabelform) og konfigureres som et objekt med forskelige parametre. Hvis man blot vil have en knap, der downloader data som CSV, så tilføjes:

"download": {
    "type": "csv",
    "button": true
}

Kanppen tilføjes i overskriften over listen og kræver derfor at showheader er true.

Men det er også muligt at angive:

button - kan have værdien true hvorved der vises en knap med et ikon. Hvis button er en tekst, så vil teksten blive vist på knappen i stedet for det ikon, der default vises.

filename - navnet på den fil, der hentes. Default er det, der er angivet i name på laget, men ellers liste.

type - pt. understøttes csv og pdf. csv er default.

seperator - for "type": "csv", hvilken seperator skal benyttes. Default er ,.

onLoad - Downloader data med det samme. Det bruges typisk hvis en widget tilføjes dynamisk eller hvis en widget er skjult fra start.

format - for "type": "pdf", hvilket format pdf-dokumentet skal have. Det kan f.eks. være a4.

orientation - for "type": "pdf", landscale eller portrait.

"download": {
    "button": true,
    "filename": "liste",
    "format": "csv",
    "seperator": ",",
    "onLoad": false
}
zoomOnClick boolean true Skal der zoomes i kortet, når man klikker i listen (kun aktuel, når kortet er vist).
zoomOnMapClick boolean false Skal der zoomes i kortet, når man klikker på en feature i kortet.
mapFilter boolean false Skal listen kun vise de features, der er synlige i kortet (kun aktuel, når kortet er vist).
emptyText string Den tekst, der vises hvis listen er helt tom. Som default vises der ikke noget og listen er ofte også altid synlig. Men hvis man bruger filter eller mapFilter så kan der opstå situationer hvor listen ikke viser noget.
clickToggle boolean false Når man klikke på et element, der allerede er valgt i listen, så fravælges elementet i listen og i kortet.
scrollToMap boolean false Når man klikke på et element i listen, så scrolles der til kortet, så man kan se, hvad der er klikket på. Dette er specielt anvendeligt, når listen ligger under eller over kortet.
tabindex boolean false Sæt til true hvis man skal kunne tabulere sig frem og tilbage i listen. Dette gør at der kommer en "outline" på listeelementet når det kommer i fokus. Dette kan gøre listen mere tilgængelig.
zoomOptions object Hvis angivet, så zoomes der til objektet når det er valgt. Det er muligt at angive, hvordan der skal zoomes til objektet i kortet.
countSelector string Angiv en selector, der vælger det element, hvor det samlede antal viste rækker i tabellen, skal sættes ind i. Det kan f.eks. være "countSelector": "#count-placeholder".

Upload (upload)

Giver brugeren mulighed for at indlæse egne data i kortet. Dette kan f.eks. bruges hvis man vil se hvordan egne data ser ud..

Det er muligt at styre hvilken om data skal slettes i kortet hver gang der tilføjes data som om der skal zoomes til data efter indlæsningen. Det er muligt at uploade Flatgeobuf (.fgb), GeoJSON (.geojson) og Shapefiler (.zip). Bemærk at shapefiler skal være en zip-fil, der indeholder en .shp, .dbf osv.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
layer string

Angiv id på det lag, som geometrien skal tilføjes til.

Laget skal være et helt almindeligt vektorlag. Hvis man blot vil have et tomt lag, kan man med fordel bruge noget i stil med:

{
    "id": "tegnelag",
    "features": true,
    "type": "geojson",
    "data": {
        "type": "FeatureCollection",
        "crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:EPSG::25832" } }, 
        "features": []
    },
    "features_dataType": "json",
    "features_style": {
        "namedstyle": "#004"
    }
}
clear boolean false Skal laget tømmes for objekter hver gang der indlæses et nyt datasæt.
zoomOptions object Hvis angivet, så zoomes der til data når de er indlæst. Det er muligt at angive, hvordan der skal zoomes til objektet i kortet.

Zoom til data (zoomtolayer)

Zoom til data i kortet. Det er f.eks. hvis data ændrer sig, så vil denne funktion sikre, at startudsnittet altid er det rigtige, når kortet vises.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidigt at fjerne en kontrol.
zoomStyle string slow Angiver, hvordan der skal zoomes ind. Ved none vises kortet blot. Ved slow zoomes der langsomt hen til objektet (ca. 2 sekunder), fast zoomer hurtigt (ca. 1 sekund), mens faster zoomer meget hurtigt (ca. 0,5 sekunder).
buffer number 1.2 Angiver, hvor meget luft der mindst skal være omkring de features, der zoomes til. Buffer angives som et forhold; det vil sige, at 1.2 lægger 20 % til, mens 1.5 lægger 50 % til.
minResolution number 3.2 Hvor langt skal der maksimalt zoomes ind til. Dette tal angives som antallet af meter, som hver pixel er i dette zoomniveau.
zoom number 1 Zoom ind til et specifikt zoomniveau, hvor 0 er helt ude, mens 16 er meget langt inde. Hvis den ikke er angivet, vil en af ovenstående vinde, og zoomniveauer vil ikke automatisk blive 1.
layers array Angiv en liste med vektorlag, der skal zoomes til. De specifikke lag angives på denne måde: ["lag1","lag2"]. Hvis ikke angivet, zoomes der til et tilfældigt vektorlag, hvis der er flere.
persist boolean false Skal zoomet gemmes som default zoom, så det kan bruges i f.eks. "Zoom til startudsnit".

Custom "control"

Det er muligt tilføje sin egen "control", der kan være udviklet til noget helt specielt. Herved er det muligt at referere til denne "control" i konfigurationen som enhver anden "control". Dog er det et krav at konfigurationen indeholder en egenskab, der hedder path med stien til det sted, hvor der ligger en js-fil, der har det samme navn som kontrollen (med stort begyndelsesbogstav). Ellers kan man benytte de normale egenskaber, som de fleste andre "controls" har samt de egenskaber, som den selv bestemmer.

Name type default description
disable boolean false Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.
css 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.
detach 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.
path string Ved at sætte "path": "http://host/controls/" indlæses kontrollen som enhver anden kontrol. Det er vigtigt, at der under denne sti ligger en js-fil med samme navn som kontrollen (dog med stort begyndelsesbogstav). På denne måde kan man have koden til en kontrol liggende et helt andet sted.
??? ??? Det er muligt for at have egne egenskaber, der kan bruges på lige fod med de andre.

zoomOptions

På mange funktioner er det muligt at angive zoomOptions, der bruges til at styre hvordan funktionen zoomer i kortet. Herunder er beskrevet, hvilke parametre der kan angives i zoomOptions:

"zoomOptions": {
    "zoomStyle": "slow",
    "minResolution": 3.2,
    "preventZoom": false,
    "buffer": 1.2,
    "panOnly": false
}
Name type default description
zoomStyle string slow

Ved none vises kortet blot. Ved slow zoomes der langsomt hen til objektet (ca. 2 sekunder), fast zoomer hurtigt (ca. 1 sekund), mens faster zoomer meget hurtigt (ca 0,5 sekunder).

minResolution number 3.2 Hvilken opløsning der skal zoomes til. Tallet er antallet af meter pr. pixel.
activateZoom boolean true Skal zoom aktiveres.
preventZoom boolean false Skal zoom deaktiveres.
buffer number 1.2 Hvor meget luft skal der være omkring et objekt, der zoomes til. Hvis 1.2 angives, betyder det at der lægges 20% til omkring objektet.
panOnly boolean false Skal der kun panoreres i kortet og ikke ændres zoomniveau.
persist boolean false Skal zoomet gemmes som default zoom, så det kan bruges i f.eks. "Zoom til startudsnit".