https://github.com/davidcalhoun/deckgl-all-things-open-2022

Repo for "Visualizing Large Greenhouse Gas Datasets in the Browser With deck.gl" talk at All Things Open 2022
https://github.com/davidcalhoun/deckgl-all-things-open-2022

allthingsopen ato

Last synced: 9 months ago
JSON representation

Repo for "Visualizing Large Greenhouse Gas Datasets in the Browser With deck.gl" talk at All Things Open 2022

• Host: GitHub
• URL: https://github.com/davidcalhoun/deckgl-all-things-open-2022
• Owner: davidcalhoun
• License: mit
• Created: 2022-10-31T01:17:23.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2023-01-26T22:23:42.000Z (over 3 years ago)
• Last Synced: 2025-02-13T10:53:22.904Z (over 1 year ago)
• Topics: allthingsopen, ato
• Language: JavaScript
• Homepage: https://youtu.be/GWevJpYSBz4
• Size: 13.5 MB
• Stars: 0
• Watchers: 3
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# deck.gl @ All Things Open 2022

Repo for [Visualizing Large Greenhouse Gas Datasets in the Browser With deck.gl](https://2022.allthingsopen.org/sessions/2-for-1-visualizing-large-greenhouse-gas-datasets-in-the-browser-with-deck-gl-tba/)

The goal of this visualization: answer the question "where are the biggest methane emissions and who is responsible"?

Also check out the [talk slides](https://docs.google.com/presentation/d/1ZWWzyoWJsVWcA2O52SRLX4XC59VhDE9UlZGGjdlUM5U/edit)!

## Installation

1. Install [Node.js](https://nodejs.org), which comes with [npm](https://www.npmjs.com/).

1. \$ `git clone git@github.com:davidcalhoun/deckgl-all-things-open-2022.git && cd deckgl-all-things-open-2022`

1. \$ `npm install`

1. Create an account at [mapbox.com](https://www.mapbox.com/)

1. Copy your "Default public token" from https://account.mapbox.com/access-tokens/

1. Create a new file named `.env.local` in the root directory. This file is in `.gitignore` and shouldn't be checked into Github.

1. Open `.env.local` and add this line (be sure to paste your token): `MAPBOX_ACCESS_TOKEN=PASTE_YOUR_TOKEN_HERE`

1. Edit `src/index.js` with the Step you want to run (Step 1 by default).

1. \$ `npm start`

## Step by step previews

### [Step 1](src/Step1.js)

![Step 1](images/step1.png)

### [Step 2](src/Step2.js)

![Step 2](images/step2.png)

### [Step 3](src/Step3.js)

![Step 3](images/step3.png)

### [Step 4](src/Step4.js)

![Step 4](images/step4.png)

### [Step 5](src/Step5.js)

![Step 5](images/step5.gif)

### [Step 6](src/Step6.js)

![Step 6](images/step6.gif)