Fra MapStore til CMS

Her ser vi på, hvordan du indlejrer et kort fra MapStore i en side på dit CMS.

Du kan vælge mellem to metoder: iframe eller JavaScript API, afhængigt af dine behov.

Design dit kort først Se eksempler

Hvad får du?

Nem integration i dit CMS
To forskellige metoder til indlejring
Komplet kode snippets til kopiering
Professionel support og dokumentation

Få hjælp

To måder at sætte et kort ind

Iframe Integration

Simpel metode til grundlæggende kortvisning. Kortet kan ikke kommunikere med andre elementer på siden.

Se iframe metode

JavaScript API

Avanceret metode der giver dig mulighed for at bygge interaktive applikationer med kortet.

Se API metode

Del kortet

Klik for at få genereret et HTML snippet du kan sætte ind i dit CMS.

Du kan dele et kort enten via kortdashboard (forside) eller fra Toolbar i højre side af kortet.

Del fra kortdashboard (forside)

Del fra Toolbar (højre side)

Kort i iframe

Kopier koden fra "Via indlejret kode" (klik gerne på ) og sæt koden ind i dit CMS.

Iframe HTML Code

1
2
3
4
5
<iframe
  allowFullScreen
  style="border: none; width: 100%; height: 400px;"
  src="https://mapstoreplay.nordiq-gis.dk/mapstore/embedded.html#/757">
</iframe>

Kort via JavaScript API

Kopier koden fra "Via indlejret kode" (klik gerne på ).

Koden her skal bruges til at oprette en hel HTML side. Hvis du vil sætte det ind i et CMS eller eksisterende side brug kun kode magen til den forneden.

Se interaktivt eksempel Tips & tricks

MapStore2 API Code

1
2
3
4
5
6
7
8
9
10
11
12
13
// MapStore2 API Integration
<script id="ms2-api" src="https://mapstoreplay.nordiq-gis.dk/mapstore/dist/nqgis-api.js"></script>
<script type="text/javascript">
    function msInit() {
        MapStore2.create('container', {
            configUrl: "https://mapstoreplay.nordiq-gis.dk/mapstore/rest/geostore/data/3718",
            theme: {
                theme: "embedded"
            },
            // mapId: 3718,
            // contextName: 'EmbeddedShowcaseInfoPopup'
        });
    }
    window.addEventListener('load', function () {
        msInit();
    });
</script>

Vigtigt

Du kan til enhver tid ændre MapId - og contextName. Disse parametre kan tilpasses til dine specifikke behov.

Design dit kort Få hjælp