Background Image of a River

Projects

Serverless Web Maps

Using SQLite in the Browser and Service Workers to Power Web Maps from Object Storage

This project uses the sql.js-httpvfs library to serve vector and raster tiles from mbtiles hosted on object storage. The mbtiles could live alongside the website or be hosted on any publicly accessible url. A service worker intercepts the tile requests then returns tile data from the mbtiles fetched using simple SQL queries.

project-link Live Demo

City of Lancaster Public Transit

A NodeJS GTFS Feed & Interactive Map Generator

This project consists of a NodeJS script that generates a GTFS feed and interactive map. The only requirements are a GeoJSON routes file, a GeoJSON and stops file, and a handful of static GTFS text files. The result is a feed that can be published to Google, Transit, or any transit feed service, as well as an interactive map with schedules for each route. The schedules can be fixed route with specific times or loop routes that run every hour.

project-link Live Demo

Peaks 3D Visualization

An Exporation of the Highest Mountain Peaks in the US

An exploration of the Mapbox GL JS 3D terrain functions, using the tallest US mountain peaks in each state as the study subject. Each map view in this demo project was carefully selected to provide an excellent view of the peak and its surroundings. The terrain extrusion still has a tendency to crash browsers.

project-link Live Demo

Wedding Website

A Single-Page Wedding Wedsite with an Interactive Map

This single-page website features image modals, an interactive map and a contact form. The website is bundled with the Parcel bundler and hosted with Netlify which also takes care of form reponses.

project-link Live Demo

Pandemix Data Visualization

What if all US COVID Deaths occurred in one geographic area?

This project is based on the amazing map Brazilian Lupa. It uses a dot density visualization to represent deaths from US COVID-19 clustered in one geographic area. The populations are based on US Census Block Groups, with one dot representing 20 US deaths. All statistics are generated client-side using vector tiles and web-workers

project-link Live Demo

GPX Visualize

A Visualization for GPS Tracks

This pojects uses the medium of GPS tracks to explore the linking of charts and maps. The application has a dark and light theme with custom map styles for each. The display can be exported to a an image by clicking in the upper right corner of the visualization.

project-link Live Demo

Shagbark Product Locator Map

A Locator Map with Search and Nearest Store Finder

Using the original Mapbox JS store locator example as a starting point, the Shagbark map adds a couple of unique features including store text search and a nearest store locator. The project pulls data from a Google Sheet in NodeJS while building. This allows the client to easily update store locations and available products. Custom icons with the client logo are used to mark store locations. An open source version of this store locator is available on GitHub.

project-link Live Demo