/openlayers-view-animations-pwa

A progressive web app made with Glitch and OpenLayers, with location tracking and custom OpenLayers controls

Primary LanguageHTMLMIT LicenseMIT

OpenLayers View Animations PWA

A progressive web app made with Glitch and OpenLayers by Prashant. The app can track the user's location (if permission is granted). The app also features custom OpenLayers controls.

Custom OpenLayers Controls

  1. ◎ Location
  2. ↻ Rotate the map clockwise
  3. ↺ Rotate the map anticlockwise
  4. 𝐓 Take a short tour
  5. 🇬🇧 Go to London with a panning effect
  6. 🇷🇺 Go to Moscow with an elatic effect
  7. 🇹🇷 Go to Istanbul with a bouncing effect
  8. 🇮🇹 Go to Rome with a spinning effect
  9. 🇨🇭 Got to Bern with a flying effect
  10. 🇮🇹 Rotate the map with the center as Rome
  11. 🏡 Go to Mumbai with an elastic effect

Screenshot

Install

OpenLayers:View Animations

Made with Glitch

\ ゜o゜)ノ

Click Show in the header to see your app live. Updates to your code will instantly deploy and update live.

Glitch is the friendly community where you'll build the app of your dreams. Glitch lets you instantly create, remix, edit, and host an app, bot or site, and you can invite collaborators or helpers to simultaneously edit code with you.

Find out more about Glitch.

Your Project

On the front-end,

  • edit public/client.js, public/style.css and views/index.html
  • drag in assets, like images or music, to add them to your project

On the back-end,

  • your app starts at server.js
  • add frameworks and packages in package.json
  • safely store app secrets in .env (nobody can see this but you and people you invite)