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 — eis_fire_lf_perimeter_nrt: Most recent fire perimeter data from the current year
• Active Fire Front — eis_fire_lf_fireline_nrt: Fireline segments indicating the movement front of active fires
• Fire Detections — 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, Zustand
• 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 server
• npm run build: Build for production
• npm run build:lib: Build in library mode for publishing to NPM
• npm run lint: Run ESLint
• npm run preview: Preview production build locally

Publishing to npm

To publish a new version of the Fire Event Explorer as an npm package:

Bump the version

Update the version field in package.json according to semantic versioning:

• Major for breaking changes
• Minor for new, backward-compatible features
• Patch for fixes and internal improvements

Authenticate with npm

Make sure you're authenticated with npm under the correct scope. You’ll need a valid auth token with publish permissions from the relevant organization. You can also add the acquired token to your local .npmrc file. The current scope is @dsio, but the package will soon be migrated to the @teamimpact scope.

Build and publish the package

Once authenticated and the version is updated, run npm run build:lib to build the package in library mode. Once built, run npm publish. The package is published as a public package and is accessible via the npm registry.

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