Strongest wind on the grid · 10:30 UTC

19.4m/s

at 60°S 120°W

Usage

One layer, one overlay.

Transform feedback
Particle positions advance on the GPU every frame; the CPU never touches them.
IDW texture
generateWindTexture turns scattered samples into a U/V texture with inverse-distance weighting.
Live data
This page reads current 10 m wind from Open-Meteo on a 15° grid, refreshed hourly.

Full props table in the README.

import { Map } from 'maplibre-gl';
import { MapboxOverlay } from '@deck.gl/mapbox';
import { WindParticleLayer, generateWindTexture } from 'maplibre-gl-wind';

// direction = where the wind blows TOWARD (weather APIs: from + 180)
const wind = generateWindTexture(points, { width: 240, height: 120 });

const map = new Map({
  container: 'map',
  style: 'https://tiles.openfreemap.org/styles/liberty',
});

map.addControl(
  new MapboxOverlay({
    layers: [
      new WindParticleLayer({
        id: 'wind',
        image: wind.canvas.toDataURL(),
        imageUnscale: wind.imageUnscale,
        numParticles: 8192,
        speedRange: [0, 20],
      }),
    ],
  }),
);