@dsio/fire-tool v1.0.3
Fire events visualization tool
Web application for visualizing fire data from VIIRS satellite observations. It highlights active fires, fire perimeters and fireline activity to help understand fire progression.
Data sources
The app uses data from multiple STAC collections, generated by the FEDs algorithm, which tracks fire movement and severity using VIIRS thermal observations from the Suomi NPP and NOAA-20 satellites. The visualization includes:
- Fire perimeters (NRT) — eis_fire_lf_perimeter_nrt: Most recent fire perimeter data from the current year
- Firelines (NRT) — eis_fire_lf_fireline_nrt: Fireline segments indicating the movement front of active fires
- New fire pixels (NRT) — eis_fire_lf_newfirepix_nrt: New fire detections since the last VIIRS overpass
VIIRS sensors provide updates approximately every 12 hours. For more detailed information about these and other collections, see the related OpenVEDA documentation.
Technologies
- React, TypeScript
- Deck.gl + Vector tiles for rendering the fire data
- ParticleLayer for visualizing wind information
- Simple video (webm) export functionality for recording animations
- Recharts for charting of the fire stats
- U.S. Web Design System for theming a gov-style UI
Getting started
Prerequisites
- Node.js 18+
- npm or yarn
Installation
# Clone the repository
git clone https://github.com/NASA-IMPACT/us-fire-events-tool.git
cd us-fire-events-tool
# Install dependencies
npm install --legacy-peer-deps
# Create a .env file in the project root and set your environment variables
VITE_MAPBOX_TOKEN=your-mapbox-access-token
VITE_FEATURES_API_ENDPOINT='https://openveda.cloud/api/features'
# Start the development server
npm run dev
# or
yarn dev
Visit http://localhost:5173
to see the application.
Development
This project uses Vite for development.
Scripts
npm run dev
: Start development servernpm run build
: Build for productionnpm run lint
: Run ESLintnpm run preview
: Preview production build locally
Expanding ESLint Configuration
For production applications, we recommend enabling type-aware lint rules:
export default tseslint.config({
extends: [
...tseslint.configs.recommendedTypeChecked,
// Alternatively, use this for stricter rules
...tseslint.configs.strictTypeChecked,
// Optionally, add this for stylistic rules
...tseslint.configs.stylisticTypeChecked,
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
},
})
You can also install React-specific lint plugins:
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'
export default tseslint.config({
plugins: {
'react-x': reactX,
'react-dom': reactDom,
},
rules: {
...reactX.configs['recommended-typescript'].rules,
...reactDom.configs.recommended.rules,
},
})
License
This project is licensed under Apache 2, see the LICENSE file for more details.
Acknowledgments
- Fire data produced by the FEDs algorithm, based on Chen et al 2020's algorithm for California
- VIIRS thermal sensor data from Suomi NPP and NOAA-20 satellites