Skip to content

transitopia/transitopia-web

Repository files navigation

Transitopia

Transitopia Logo

Transitopia is a mapping project that aims to provide high-quality public transit, cycling, and pedestrian infrastructure maps. The goal is to promote best practices and celebrate high quality infrastructure, while calling attention to unsafe and low-quality infrastructure.

Current status (Jan 2024): We are working on cycling maps for the Metro Vancouver area, though the mapping process applies the same criteria throughout the province of BC, so the map will show cycling paths anywhere in the province of BC. Transit and Pedestrian maps will come in the future.

Online at: www.transitopia.org.

Screenshot of www.transitopia.org

This repository

This Single Page Application implements a viewer for the Transitopia map.

It uses React + TypeScript + Vite + MapLibre GL.

How to run Transitopia Locally

  1. You need Node.js and Java 17+ on your system.
  2. Clone this repo to your system.
  3. Build the vector base map tiles file: The map data file is over 800 MiB so cannot be included in this git repository. Use the Transitopia planetiler-openmaptiles repository to generate the transitopia-base-bc.pmtiles vector map data file using planetiler (see that repo's README). Copy the resulting map data file into this repo as public/transitopia-base-bc.pmtiles.
  4. Build the vector overlay tiles file: this contains the cycling paths, pedestrian paths, etc. and is specific to Transitopia. Use the planetiler-transitopia repository to generate the transitopia-cycling-bc.pmtiles vector map data file using planetiler (see that repo's README). Copy the resulting map data file into this repo as public/transitopia-cycling-bc.pmtiles.
  5. Install dependencies: npm install
  6. Run the development server: npm run dev
  7. Go to http://localhost:5173/ in your browser.

Credits

Transitopia is a project by Braden MacDonald (@bradenmacdonald on GitHub).

All source code is open source and all data is open data, but the licenses vary.

The primary source of map data is OpenStreetMap. Vector map tiles are generated using planetiler, using a modified version of the OpenMapTiles schema. The planetiler-transitopia repository has all the details on how the map is generated.

The map is rendered using MapLibre GL.

Map vector tile data is stored in the PMTiles format.

The base map style is a customized version of OpenMapTiles Positron.