OpenLayers voorbeelden: Luchtfoto's Hoogwater Limburg - Juli 2021

Goedemiddag,

Hier is het OpenLayers voorbeeld van vandaag: een viewer met de luchtfoto’s van het hoogwater in Limburg afgelopen zomer TWIAV | Luchtfoto's Hoogwater Limburg - Juli 2021

Meer dan de andere voorbeelden die ik de afgelopen tijd hier heb laten zien is de app van deze week niet zo zeer een POC, maar meer een echte applicatie, een op zichzelf staand informatieproduct… :slight_smile:

Ik gebruik hier veel functionaliteit die ik de afgelopen lockdown in de eerdere voorbeelden heb verkend, maar toch ook een aantal - voor mij - nieuwe zaken. Hieronder een korten samenvatting van wat ik het afgelopen weekend heb geleerd:

  • De luchtfoto’s van de overstromingen worden door Het Waterschapshuis niet bij PDOK gehost, maar via ArcGIS. En daarom hebben deze WMTS services een ander Tiling Schema dan die van PDOK. Een oplossing voor dit probleem heb ik - in dit forum - gevonden in deze discussie, met dank aan @j.l.l.hartmann voor zijn voorbeeld.

  • Ik heb de OpenLayers extensies van Jean-Marc Viglino ontdekt, en daaruit gebruik in dit voorbeeld de Swipe button en de Toolbar.

  • En dan nog iets: ik heb het tabindex attribuut van het map element op "0" gezet (zie dit Accesible Map voorbeeld). Hierdoor kan de kaart de focus krijgen en daarmee wordt-ie bestuurbaar met het toetsenbord. Dat scheelt toch een hele muisarm als je gewoon met de + en de - en de pijltjes van Maastricht tot aan Hank langs de luchtfoto kunt navigeren.

Hier is te zien hoe hoog de Maas stond ter hoogte van de veerpont tussen Grubbenvorst en Velden: TWIAV | Luchtfoto's Hoogwater Limburg - Juli 2021

En de broncode staat - zoals te doen gebruikelijk - op GitHub:

Laat maar horen wat jullie er van vinden.

Groet,

Egge-Jan

Leuk gemaakt en mooie applicatie om te zien waar het water hoog stond!

1 like

@e.j.h.polle Een beetje een late reactie, maar ik heb een technische vraag. Over jouw code. Op https://www.npmjs.com/package/ol-layerswitcher staat voorbeeldcode met o.a.

} as BaseLayerOptions);

In jouw code zie ik dat je BaseLayerOptions en GroupLayerOptions importeert, maar - voor zover ik kan zien - niet gebruikt.
Weet je (nog) waarom je dat niet hebt gedaan?