Collection of free HTML and CSS Map Animation examples from Codepen and other resources.
Table of Contents
- Nuclear Detonation (1945-1996)
- Airport Distance Map
- SVG Event Map
- Interactive Geographical Map
- Context UX Patterns
- Mapbox Map Marker Icons
- The Geo location API
- Map with leaflet.JS
- Animated Map Pins
- Location Map
- Dynamic Geo Map with SVG
- Greyscale Magnifying
- New Zealand Visual Itinerary
- Data Visualization
- Animated Driving GPS Background
- World Map with Secret Surprise
Nuclear Detonation Timeline (1945-1996)
See the Pen Nuclear Detonation Timeline (1945-1996) by James Holmes (@32bitkid) on CodePen.
Airport Distance Map
See the Pen Airport Distance Map by Shaw (@shshaw) on CodePen.
SVG Event Map
See the Pen Animated SVG – Event Map by Taylor Ho (@tellaho) on CodePen.
Interactive Geographical Map
See the Pen Interactive Geographical Map w/ SVG & JavaScript by Dudley Storey (@dudleystorey) on CodePen.
Context Shifting
See the Pen Context-Shifting in UX Patterns by Sarah Drasner (@sdras) on CodePen.
Mapbox Map with Animated
See the Pen Mapbox Map with Animated Marker Icons by Arden (@aderaaij) on CodePen.
Building Interactive
See the Pen Building Interactive Maps with Leaflet & the Geolocation API by Mark Lee (@leemark) on CodePen.
Simple Map
See the Pen Simple map with leaflet.js by Jakob Fuchs (@jakobfuchs) on CodePen.
Animated Map Pins
See the Pen Animated Map Pins by Jeff Bridgforth (@webcraftsman) on CodePen.
Location Map
See the Pen Location Map by DigitalOcean (@scout0773) on CodePen.
Dynamic Geo Map
See the Pen Dynamic Geo Map with SVG and jQuery by SitePoint (@SitePoint) on CodePen.
Greyscale Magnifying
See the Pen Greyscale Magnifying glass effect by Hugo Darby-Brown (@hugo) on CodePen.
New Zealand Visual Itinerary
See the Pen New Zealand Visual Itinerary by Aysha Anggraini (@rrenula) on CodePen.
Animated View Box
See the Pen Animated viewBox Data Visualization by Sarah Drasner (@sdras) on CodePen.
Animated Driving GPS Background
See the Pen Animated Driving GPS Background by Stefanie Kielbasa (@skielbasa) on CodePen.
Interactive SVG World🌎
See the Pen 🌎 Interactive SVG World Map with Secret Surprise by Jeffrey Bennett 😃 (@PickJBennett) on CodePen.
Post a Comment