Alle casesGIS & Datavisualisatie

movingpolygons.com

Creator & Lead Developer

2023 — Heden/Persoonlijk Project
Bekijk project

De Uitdaging

Vormen animeren over een kaart klinkt simpel tot je het probeert. Geografische coördinaten zijn niet lineair, projecties vervormen beweging, en het renderen van tientallen gelijktijdig geanimeerde polygonen op 60fps in een browser is een prestatieuitdaging. Bestaande tools vereisen desktop-GIS-software of ondersteunen alleen statische visualisaties.

Mijn Bijdrage

De volledige tool vanaf scratch gebouwd: een Mapbox GL JS canvaslaag voor rendering, eigen great-circle interpolatie-algoritmen voor vloeiende geografische beweging, en een tijdlijneditor voor het regelen van snelheid, easing en sequentiëring van meerdere polygonen.

De UI ontworpen om toegankelijk te zijn voor niet-technische gebruikers: definieer waypoints door op de kaart te klikken, pas timing aan met sleepgrepen, pas polygoonstijlen aan en exporteer het resultaat als video of GIF. De renderingloop geoptimaliseerd om 60fps te behouden met 50+ gelijktijdig geanimeerde elementen.

Belangrijkste Resultaten

  • Vloeiende 60fps-animatie met 50+ gelijktijdig bewegende polygonen in de browser
  • Great-circle interpolatie die geografisch accurate bewegingspaden produceert
  • Export naar video/GIF voor gebruik in presentaties en social media
  • Installatie-vrije browsertool toegankelijk voor niet-GIS-gebruikers

Gebruikte Technologieën

TypeScriptMapbox GL JSGeoJSONCanvas APIWeb AnimationsReact