Het kunnen embedden van kaartjes op een webpagina [16]
We willen een functionaliteit toevoegen aan Atlas waarmee het eenvoudig wordt om een kaart met vooringestelde lagen te embedden op andere websites.
Het embedden van een kaart
Binnen Atlas komt een nieuwe embed knop. Wanneer een gebruiker klikt op deze embed knop dan krijgt de gebruiker een popup te zien waarin de code staat waarmee de kaart op een andere site geplaatst kan worden. De instellingen die op dat moment in Atlas geconfigureerd staan (de basislaag en de geactiveerde lagen) worden automatisch overgenomen in de embed.
De embed zelf
De embed zelf biedt een minimale set van functionaliteit aan. In de eerste versie toont de embed de basiskaart met de voorgeconfigureerde lagen. Ook is het mogelijk om de positie en het zoomniveau aan te passen. Een eerste schets op basis van de kaart van Haarlem:
In volgende versies voegen we stapsgewijs de volgende functionaliteit toe:
- Legenda
- Bronverwijzing
- Link naar Atlas
Techniek
- We slaan de positie, het zoomniveau, de geconfigureerde basislaag en de geactiveerde lagen op in de embed zelf.
- We maken gebruik van onze nieuwe Vue.js pipeline voor het maken van een aparte asset embed.js
- Een eerste versie van de embed code:
<iframe title="Externe kaart" width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://datalab.purmerend.nl/atlas/@52.4996287,4.9375696,13z/layers=his_monumenten,his_beemsterkavelindeling_1612" style="border: 1px solid black"></iframe>Open vragen
- Wat is een mooie plek voor de embed knop in Atlas?