Interpolation and grids
Quick answer
This tutorial turns a few sample points into continuous surfaces with turf.interpolate, an inverse-distance weighting grid controlled by cellSize, gridType (point, square or hex) and weight. It also covers isolines for contour levels, tin for triangulated meshes, and hexGrid plus booleanPointInPolygon for per-cell counts. You will be able to generate density grids without exploding memory.
Key points
- Set property and weight on turf.interpolate so numeric sample values drive the grid.
- Pass a bbox array, not a polygon, as the first argument of turf.hexGrid.
- Choose five to ten breakpoints for turf.isolines so contour lines stay readable.
Example
var samples = turf.featureCollection([
turf.point([116.38, 39.90], { value: 42 }),
turf.point([116.40, 39.91], { value: 58 }),
turf.point([116.42, 39.89], { value: 35 }),
turf.point([116.44, 39.92], { value: 71 })
]);
var grid = turf.interpolate(samples, 0.5, {
gridType: 'point', // point | square | hex
property: 'value',
units: 'kilometers',
weight: 2 // 距离的幂次,越大越「只信近处」
});
console.log(grid.features.length);
console.log(grid.features[0].properties); // 含 value 插值结果var lines = turf.isolines(samples, [30, 40, 50, 60, 70], {
zProperty: 'value',
commonProperties: { unit: 'μg/m³' }
});
lines.features.forEach(function (f) {
console.log(f.properties.value, f.geometry.type);
});
Notes
- String-valued properties become NaN and leave the whole grid null without an error.
- Small cellSize values such as 0.1 kilometers can generate hundreds of thousands of cells and freeze the main thread.
English edition written for Atlaslog. Code is taken from the original Chinese page and runs unchanged.
Atlaslog (2026). Interpolation and grids. https://www.jingweizhi.com/en/turf/tutorials/interpolation.html (accessed 2026-11-03).