Indlejring
Vidi kan indlejres på en hjemmeside vha. embed.js scriptet.
Eksempel på indlejring:
<!-- Scriptet kan loades både i toppen og bunden af siden --> <script src="https://vidi.swarm.gc2.io/js/embed.js"></script> <!-- Eksempel på et Vidi div element --> <div data-vidi-token="eyJ0aXRsZSI......" data-vidi-width="800px" data-vidi-height="600px" data-vidi-tmpl="embed.tmpl"></div>
Der en række data attributer, som skal/kan sættes:
- data-vidi-token (obligatorisk)
- Projektets "token" som indeholder state-id, host, database mv. Skal angives.
- data-vidi-width (valgfri)
- Bredde på kort. Standard 100%
- data-vidi-height (valgfri,)
- Højde på kort. standard 100%
- data-vidi-tmpl (valgfri)
- Hvilken template kortet skal bruge. Standard embed.tmpl, som er en template beregnet til indlejring.
- data-vidi-search (valgfri)
- Kan sættes til "none" hvis søgeboksen skal skjules. Standard ikke sat.
- data-vidi-history (valgfri)
- Kan sættes til "none" hvis forrige/næste udsnit kanpperne skal skjules. Standard ikke sat.
- data-vidi-use-config (valgfri)
- Kan sættes til "true" og derved bruges config'en fra token, hvis den indeholder en config.
- data-vidi-use-schema (valgfri)
- Kan sættes til "true" og derved bruges schemaet fra token, hvis den indeholder et schema.
- data-vidi-host (valgfri)
- Kan sættes til en host (fx "https://example.com") som bruges i stedet for host angivet i token.
Scriptet embed.js anvender MutationObserver API'et til at detektere Vidi div elementernes opståen. Hvis hjemmesiden skal anvendes i ældre browsere (< IE11) skal scriptet placeres i bunden efter alle Vidi div elementerne eller der skal loades en polyfill for MutationObserver.
Eksempel på indlejring:
https://s3-eu-west-1.amazonaws.com/mapcentia-www/test/test.html