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.

Options

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

disable

• Type: boolean
• Default: false

Skal kontrollen deaktiveres. Herved fungerer det, som om kontrollen ikke var tilføjet. Kan bruges til midlertidig at fjerne en kontrol.

detach

• Type: string

Angiv en reference til et alternativ html-element, som denne kontrol skal vises i. Det kan benyttes til at placere indholdet af en kontrol et andet sted på sin side. Hvis detach har værdien "abc", så skal der tlføjes et element til HTML'en på denne form: <div data-widget-detach="abc"/>. Hvis elementet ikke findes, så fungerer kontrollen, som hvis detach ikke var angivet.

css

• Type: string | string[]

Angiv en sti til en css-fil, der skal loades efter denne kontrol. Herved vil det være muligt at lave en brugertilpasset style af kontrollen.

className

• Type: string

Tilføj en speciel CSS class til elementet. Dette kan bruges til at styre hvordan elementet ser ud eller placeres på siden.

keepInFullscreen

• Type: boolean
• Default: false

Benyttes når funktionen er "detached" og funktionen "fullscreen" er inkluderet i konfigurationen. Hvis "keepInFullscreen" sættes til true, så er funktionen tilgængelig når kortet vises i fullscreen.

eventtype

• Type: string | string[]

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

• Type: string
• Default: cloud

Hvordan skal info vises. Gyldige værdier: "popup" og "cloud".

closeButton

• Type: boolean
• Default: 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

• Type: boolean
• Default: true

Kan benyttes ved "type": "cloud". Skal kortet automatisk panorere så infoboksen er inden for kortets udsnit?

scrollTo

• Type: boolean
• Default: 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

• Type: integer
• Default: 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

• Type: array
• Default: [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

• Type: object | object[]

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

• Type: 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. Læs mere om zoomOptions her.

Eksempler

Eksempler, der bruger denne komponent:

• Cluster clusterinfo

  Med clustering af mange data i kortet kan man opnå en bedre formidling

• Cluster med zoombegrænsning clusterinfo

  Når der zoomes langt ind i kortet, skifter cluster til almindelig punktvisning

• Data direkte i konfigurationen kortdatainfo

  Data skrives direkte ind i konfigurationen og vises på kortet - uden brug af services

• Data fra WKT data

  Hent data fra et hvilken som helst datastruktur hvor geometrien er defineret som WKT

• Datofilter filterdatoinfo

  Vis kun data, der er gældende for en given periode. Brugeren kan selv ændre hvilken periode, der skal vises data for.

• Erhvervsområder fra plandata.dk med WFS infowfs

  Hent data direkte fra plandata.dk. Men sørg for at begrænse antallet af objekter, da det kan medføre, at siden bliver langsom

• Erhvervsområder fra plandata.dk med WMS info

  Hent data direkte fra plandata.dk. I dette eksempel hentes data først, når der klikkes i kortet.

• Erhvervsområder fra plandata.dk med WMS og WFS infowmswfs

  Hent data direkte fra plandata.dk. I dette eksempel lægges vektordata oven på et WMS-lag. Herved vises WMS'en hurtigt, men vi kan godt vente på, at vektorlaget er lidt længere tid om at loade. Dette er specielt anvendeligt, hvis vi har mange data, eller man gerne vil have kartografien fra en WMS-server.

• Filter filterinfo

  Mulighed for at filtrere hvilke data, der vises i kortet. Det kan både konfigureres til blot at vise en delmængde af data fra start samt at give brugeren mulighed for selv at vælge kriterier.

• Forsinket visning infoforsinket visning

  Tilføj objekter til kortet med en lille forsinkelse

• Historie storyinfodata

  Med story mode er det muligt at guide brugeren igennem en række oplysninger og samtidig præsentere oplysningerne i kortet. Herved kan man fortælle brugeren en historie i stedet for blot at vise en liste.

• Info infowms

  Med enkel infovisning af data i kortet kan man opnå en bedre formidling

• Info hentet fra flere services infolagvælger

  I de tilfælde, at det ikke er muligt at hente alle features ud i browseren, er det muligt at få info fra en eller flere services i stedet.

• Info hentet fra service info

  I de tilfælde, at det ikke er muligt at hente alle features ud i browseren, er det muligt at få info fra en service i stedet.

• Info med foruddefineret template infotemplate

  Benyt en af de foruddefinerede templates til f.eks. info popup. Brug f.eks. 'namedtemplate': '#popup001' som i eksemplet her.
  Det er muligt at angive hvilke attributter der skal med, men det er også muligt at angive dem, der ikke skal med. Hvis både 'excludeAttr' og 'includeAttr' udelades kommer det hele med.
  Hvis ikke 'title' angives, vælges den første attribut som overskrift.
  Som det ses af eksemplet, er det muligt at håmndtere links specielt. Derudover er det stadig muligt at håndtere sammensatte værdier.

• Info med funktioner info

  Ved at tilføje forskellige attributter på elementerne i templaten til en Infoboks, er det muligt at give den forskellige funktioner. Det kan f.eks. bruges til at tilføje en 'Luk'-knap

• Info med statisk boks info

  Infoboksen kan vises på flere måder. Her er et eksempel, hvor infoboksen er fast i øverste venstre hjørne. Den kan også placeres som en flydende boks i kortet eller helt afkoblet fra kortet.

• Info ved brug af template infotemplate

  Indholdet i infoboksen er styret af data samt en template, der kan ligge ved siden af data.

• Join data kortinfo

  Berig data fra en service med lokale data. Dette kan f.eks. bruges til at tilføje informationer fra kodelister eller blot at berige en ekstern service, som man ikke selv har kontrol over. Derudover kan give en højere grad af genbrug ved at de samme data bruges i forskelige sammenhæng.

• Jordstykker info

  Info på jordstykker hentet fra Dawa

• Jordstykker fra Datafordeleren ud fra BBOX bbox

  Benyt loadingstrategy til at hente vektordata direkte fra datafordeleren.dk. Herved kan samtlige jordstykker findes i kortet som vektordata

• Kombineret filter filterclusterinfo

  Avanceret filtrering på baggrund af flere værdier fra data. Filteret er placeret ved siden af kortet for at skabe et bedre overblik over hvilke kriterier, der er angivet. Filteret er stylet, så det passer til ikonerne i kortet.

• Kommuneplan kommuneplan

  Få vist oplysninger om en given kommuneplanramme hentet direkte fra Plandata.dk med både tekst og kort. Angiv blot planID på din widget, og alt andet sker automatisk. Brug den samme widget til at vise en hvilken som helst kommunplanramme.

• Konfliktsøgning ud fra en adresse konfliktsøgninginfosøglokalplaner

  Udfør en konfliktsøgning ved at vælge en adresse

• Kort kortwmsinfohoverfullextent

  Enkel kortvisning med WMS og GeoJSON

• Labels stylelabelinfo

  Vis tekster i kortet ud fra data. Teksterne kan være sammensat fra flere kolonner.

• Lagkonfigration fra fil lag

  Hent konfigurationen til laget fra en fil. Det gør det nemt at konfigurere lag på tværs af konfigurationer. På tilsvarende måde er det også muligt at hente konfigurationen til 'view'.

• Listevisning med info listeinfo

  Brug listevisningen i kombination med info - men med forskellg indhold

• Listevisning med knap liste

  I listen vises en knap, som man skal trykke på for at zoome og markere objektet i kortet. Ved at bruge en knap, øger det tilgængeligheden på siden, og gør det nemmere at navigere for personer, der ikke kan bruge en mus. Det er dog stadig muligt at klikke på en feature i kortet og få den markeret i listen.

• Lokalplaner fra plandata.dk ud fra BBOX bbox

  Benyt loadingstrategy til at hente vektordata direkte fra plandata.dk. Herved kan samtlige vedtagede lokalplaner findes i kortet som vektordata

• Multiselect filter filterclusterinfo

  Filtrering på baggrund af værdier fra data. Filteret kan for eksempel bruges som en lagvælger. Det er muligt at vise/skjule alle.

• POI poi

  Vis points of interests fra Septimas store samling af interessepunkter. I dette eksempel vises samtlige biblioteker i Danmark

• POI performance poi

  Vis 10000 points of interests fra Septimas store samling af interessepunkter i kortet. I dette eksempel benyttes 'styleType': 'static' hvorved vi kan opnå en bedre performance. Skriv til kontakt@septima.dk hvis du vil høre mere om denne service.

• POI performance 2 poi

  Vis 10000 points of interests fra Septimas store samling af interessepunkter i kortet. I dette eksempel benyttes 'styleType': 'semistatic' hvorved vi kan opnå en bedre performance

• POI performance 3 poi

  Vis points of interests fra Septimas store samling af interessepunkter i kortet. I dette eksempel benyttes 'loadingstrategy': 'bbox' hvorved punkterne hentes inden for at aktuelle kortudsnit. Herved kan vi se de mange punkter for hele landet når man er zoomet ind og herved opnå den samme gode performance. Skriv til kontakt@septima.dk hvis du vil høre mere om denne service.

• Punktstyle stylesymbolinfo

  Definér hele stylen på et objekt, herunder også symboler.

• SVG ikoner style

  Brug SVG til at skabe skarpe og detaljerede ikoner i kortet

• Scroll til infoboks info

  Hvis infoboksen f.eks. er placeret under eller over kortet, er det muligt at få browseren til at scrolle til boksen, når objektet vælges i kortet. Herved gøres brugeren opmærksom på at der vises noget information et andet sted på siden

• Skraveringer style

  Brug skravering til at udfylde flader i kortet. Der findes en række forskellige skraveringer, hvor det er muligt at styre farve, linjetykkelse, vinkel mv. Se mere under fillpattern i dokumentationen.

• Stiplet linje style

  Brug flere styles på samme objekt til f.eks. at få stiplede linjer. Det kan også bruges til at danne komplekse ikoner og meget andet

• Streaming af FlatGeobuf fil flatgeobuf

  Data hentes fra en statisk fil på flere Gb. Kun relevate data hentes når de skal bruges og derfor er det hurtigt.

• Style styleinfo

  Brug de foruddefinerede styles med farver og ikoner, eller bestem selv, hvordan data skal præsenteres i kortet.

• Style fra fil styleinfo

  Hent style fra en ekstern kilde. Herved kan den samme style genbruges i flere lag eller konfigurationer

• Supplerende data datacomputed

  Brug computedProperties til at tilføje supplerende attributter på data ud fra eksisterende attributter. Dette kan f.eks. bruges til nemt at definere kategorier,der skal bruges flere steder.

• Søg i S4 søg

  Integration til Spatial Suite. Det gør det muligt at søge i de data, som du selv udstiller via S4.

• Søgning søginfo

  Tilføj et søgefelt til din hjemmeside. Mulighed for at søge i en række forskellige data, herunder officielle BBR-adresser, lokalplaner og meget mere. Knyt søgningen til et kort og zoom hen til det, du finder

• Valgsteder wfsinfo

  Solrød Kommune har lavet dette eksempel, der benytter Datafordeleren og Dataforsyningen til at vise valgdestrikter og valgsteder i kommunen

• WFS fra Plandata wfsinfo

  Hent vektordata fra Plandata.dk's WFS tjeneste som GML (men brug hellere GeoJSON hvis muligt ved at tilføje &outputFormat=json til URL'en)

• WMS lag dawainfowms

  Få vist informationer hentet direkte fra Danmarks Adresser

• Zoom til lokalt objekt i kortet locate

  Start kortet ved at zoome ind til en specifik feature ud fra en URL-parameter

• Zoom til objekt fra CartoDB locatefilterinfo

  Start kortet ved at zoome ind til en specifik feature ud fra en URL-parameter

• Zoom til valgte info

  Info kan konfigureres til at zoome ind til det valgte objekt i kortet