Screenshot of SF Building Explorer Web App

San Francisco Building Explorer

 Website Github Blog Post

Project goals

In May of 2017, new building footprints were released to the open data portal. To help showcase the release, we wanted to build a simple demonstration app that:

  1. Visualized the usage of the 3D attributes derived from LiDAR
  2. Demonstrated linking data from other open data APIs
  3. Provided transparent, open source code so others could be inspired
  4. Was easy enough to deploy locally and poke around without a lot of tooling or special knowledge of frameworks


I placed emphasis on keeping code dependencies small using minimal libraries and no frameworks. It’s a Javascript/CSS/HTML site with a single index.html. Ultimately, we wanted to develop an MVP, not a full-fledged application.

I also wanted someone to pick through the code and build understanding of what’s happening without having to understand a particular framework.

While I would not consider the codebase best practice, it meets the need and has provided people with a reference application for other purposes. For example, querying open data APIs in a frontend application.

This approach is inspired by Mapbox code examples, albeit a bit more involved.

Outcomes & Lessons

  1. Demonstrated what an “MVP” can look like to City staff and leadership in terms of time spent and deliverable
  2. Used as a reference application when people want to understand how to incorporate open data API queries in their web app
  3. Surfaced data quality issues in datasets that informed the data standards handbook
  4. Worked out patterns that could be used if iterated into a more robust application

Technology involved

Out in the world

Leader in civic data and its many uses with 10+ years experience in data management, analysis, visualization, and engineering. I helped build DataSF into a world-recognized program empowering use of San Francisco's data.
Jason Lally on Twitter