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],
}),
],
}),
);