https://github.com/ejw-data/leaflet-animation
Example of a Leaflet plugin that animates markers
https://github.com/ejw-data/leaflet-animation
html-css-javascript leafletjs
Last synced: over 1 year ago
JSON representation
Example of a Leaflet plugin that animates markers
- Host: GitHub
- URL: https://github.com/ejw-data/leaflet-animation
- Owner: ejw-data
- Created: 2022-06-14T22:30:19.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2022-06-28T01:23:57.000Z (about 4 years ago)
- Last Synced: 2025-01-22T06:47:19.505Z (over 1 year ago)
- Topics: html-css-javascript, leafletjs
- Language: JavaScript
- Homepage:
- Size: 755 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# leaflet-street-animation
Author: Erin James Wills, ejw.data@gmail.com
Photo by Erin Wills
## Overview
Below is a quick example of a leaflet animation where I incorporate the browser's built-in geolocation as a starting location and using the click event on the map to assign the ending location. The animation moves the starting marker along a generated street path until it reaches the end location. The path directions are also displayed in the upper right section of the map.
**`Future Work`**: This test case was developed for a potential rideshare and bikeshare analysis that would incorporate an interactive map to visualize vehicle activity and scheduling.
## Github Pages
https://ejw-data.github.io/leaflet-street-animation/index.html
## Technologies
* HTML/CSS/JS
* Leaflet.js
## Data Source
Not applicable
## Setup and Installation
1. Clone the repo to your local machine
1. Open repo folder in an IDE like VSCode
1. Using a virtual server like the VSCode extention LiveServer
1. Run `index.html`
## Example
Fig.1 - Path drawn by the Leaflet animation plugin