/ecotopia-urbana

Webmap that shows you points of interest with a small description, directions to arrive and environmental information, air quality and temperature.

Primary LanguageJavaScript

Ecotopia urbana web map

Web map that shows you points of interest with a small description, directions to arrive and environmental information, air quality and temperature.

Webmap πŸ—ΊοΈ

Table of Contents



Installation

To get started with the map you'll need the following 4 API keys:

Clone

  • Clone this repo to your local machine using https://github.com/gerardoezequiel/ecotopia-urbana.git

Setup

Find the directory and replace de apikeys

$ cd ecotopia-urbana

Run your live server

Happy mapping!

Features

  • Mapbox-GL-JS
  • Assembly (CSS)
  • HTML
  • CSS
  • Javascript

Usage

  • You have to allow access to the location from your browser!

  • To use the map you can zoom in with the scroll or control buttons enabled for it in the top right.

  • To move around the map you can press the direction dates or click on the map and drag to scroll.

  • To move the camera pitch you can press the control key + the direction arrows or press the control key and click and drag with the mouse.

  • Once the map has loaded you can activate the map of isocrones and calculate the distance that you can walk or bike 5, 15, 30 or 60 min (you can modify the parameters in the top right). By default it loads 15 minutes walking.

  • In addition, you can overlay the layers of air quality, temperature and 3d buildings by clicking on the toggle at the bottom.

Step 1

  • Option 1

    • 🍴 Fork this repo!
  • Option 2

    • πŸ‘― Clone this repo to your local machine using https://github.com/gerardoezequiel/ecotopia-urbana.git

Step 2

  • HACK AWAY! πŸ”¨πŸ”¨πŸ”¨

Step 3

  • πŸ”ƒ Create a new pull request