javascript技巧

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript技巧 > Turf.js使用

Turf.js正确使用超详细案例

作者：DRAGON_SIR_

Turf是用于空间分析的JavaScript库,它包括传统的空间操作、用于创建GeoJSON数据的辅助函数,以及数据分类和统计工具,这篇文章主要介绍了Turf.js正确使用的相关资料,需要的朋友可以参考下

概述

Turf.js 是一个用 JavaScript 和 TypeScript 编写的模块化地理空间分析引擎。它是一个强大的空间分析库，可以在浏览器端或 Node.js 服务器端运行。

核心特点

主要功能

运行环境

详细功能示例

1. 缓冲区分析 (Buffer)

创建地理要素周围的缓冲区，用于邻近度分析、创建捕获区域等。

// 创建围绕 TCU 大学的 2 英里缓冲区
const tcu = turf.point([-97.364, 32.708]);
const buffered = turf.buffer(tcu, 2, {units: 'miles'});

// 可视化：紫色半透明缓冲区
// 用途：学校服务范围、噪音影响区域、配送范围

实际应用场景:

2. 距离计算 (Distance)

使用 Haversine 公式计算两个坐标点之间的距离，考虑地球曲率。

// 计算纽约和伦敦之间的距离
const from = turf.point([-74.0060, 40.7128]); // 纽约
const to = turf.point([-0.1278, 51.5074]);   // 伦敦

const distance = turf.distance(from, to, {units: 'kilometers'});
console.log(distance); // 约 5570 公里

// 支持单位：degrees, radians, miles, kilometers

实际应用场景:

3. 空间过滤 (Spatial Filtering)

根据空间关系过滤地理要素，支持 5 种空间谓词：

// 查找与缓冲区相交的所有人口普查区
const filtered = turf.filter(tracts, bufferZone, {
  predicate: 'intersects' // 或 'within', 'contains', 'crosses', 'disjoint'
});

5 种空间谓词:

谓词说明示例
intersects重叠或接触查找与洪水区相交的建筑物
within完全在内部查找完全在学区内的房屋
contains完全包含查找包含公园的行政区
crosses穿越边界查找穿越河流的道路
disjoint完全不接触查找远离污染源的居民区

实际应用场景:

4. 几何中心计算 (Centroid & Center of Mass)

计算多边形的几何中心或质心。

// 几何中心（几何中心点）
const centroid = turf.centroid(polygon);

// 质心（面积加权中心，适用于不规则形状）
const centerOfMass = turf.centerOfMass(polygon);

// 两者可能不同：对于不规则多边形，质心更准确

实际应用场景:

5. 凸包分析 (Convex Hull)

创建包含一组点的最小凸多边形。

// 为一系列点创建凸包
const points = turf.featureCollection([
  turf.point([-76, 39]),
  turf.point([-76, 41]),
  turf.point([-78, 40]),
  turf.point([-77, 38])
]);

const hull = turf.convexHull(points);
// 结果：包围所有点的最小凸多边形

实际应用场景:

6. 泰森多边形 (Voronoi)

从点集生成 Voronoi 多边形，每个多边形包含距离该点最近的所有区域。

// 为一系列点生成 Voronoi 图
const points = turf.featureCollection([...]); // 多个点
const voronoi = turf.voronoi(points, {
  bbox: [-77, 38, -76, 40] // 边界框
});

// 每个多边形代表该点的"影响区域"

实际应用场景:

7. 叠加分析 (Overlay Analysis)

7.1 相交分析 (Intersect)

返回两个要素的实际重叠区域几何。

// 创建两个重叠的缓冲区
const buffer1 = turf.buffer(point1, 1, {units: 'miles'});
const buffer2 = turf.buffer(point2, 1, {units: 'miles'});

// 计算重叠区域
const intersection = turf.intersect(buffer1, buffer2);

// 如果无重叠，返回 null

实际应用场景:

7.2 联合分析 (Union)

合并多个多边形为一个。

const union = turf.union(polygon1, polygon2, polygon3);
// 结果：所有多边形合并后的单一多边形

7.3 差异分析 (Difference)

从一个多边形中减去另一个。

const difference = turf.difference(protectedArea, developmentZone);
// 结果：保护区内未开发的区域

8. 几何操作 (Geometric Operations)

8.1 创建几何要素

// 创建点
const point = turf.point([-76.5, 39.5]);

// 创建线
const line = turf.lineString([
  [-76.5, 39.5],
  [-76.4, 39.6],
  [-76.3, 39.7]
]);

// 创建多边形
const polygon = turf.polygon([[
  [-76.5, 39.5],
  [-76.4, 39.5],
  [-76.4, 39.6],
  [-76.5, 39.6],
  [-76.5, 39.5] // 闭合
]]);

// 创建矩形
const bbox = [-76.5, 39.5, -76.3, 39.7]; // [minX, minY, maxX, maxY]
const rectangle = turf.bboxPolygon(bbox);

8.2 几何变换

// 旋转多边形
const rotated = turf.rotate(polygon, 45, {pivot: 'center'});

// 缩放
const scaled = turf.transformScale(polygon, 2); // 放大 2 倍

// 平移
const translated = turf.translate(polygon, [1, 1]); // 向东北移动

9. 📊 空间统计 (Spatial Statistics)

9.1 点聚合分析

// 计算点的密度
const density = turf.nearestPointDensity(points, {
  radius: 100,
  units: 'kilometers'
});

// 查找最近点
const nearest = turf.nearestPoint(targetPoint, pointCollection);

9.2 网格分析

// 创建网格
const grid = turf.rectangleGrid(bbox, 1, 1, {units: 'kilometers'});

// 六边形网格（更适合空间分析）
const hexGrid = turf.hexGrid(bbox, 1, {units: 'kilometers'});

实际应用场景:

10. 路径和导航 (Routing & Navigation)

// 计算两点间的测地线（最短路径）
const greatCircle = turf.greatCircle(start, end);

// 沿线创建点
const along = turf.along(lineString, 5, {units: 'kilometers'});
// 返回从起点开始 5 公里处的点

// 线的长度
const length = turf.length(lineString, {units: 'kilometers'});

实际应用场景:

安装和使用

Node.js 环境

npm install @turf/turf

// 导入整个库
const turf = require('@turf/turf');

// 或按需导入（推荐，减小打包体积）
const buffer = require('@turf/buffer');
const distance = require('@turf/distance');
const intersect = require('@turf/intersect');

浏览器环境

<!-- CDN 方式 -->
<script src="https://unpkg.com/@turf/turf@7/turf.min.js"></script>
<script>
  const point = turf.point([-76.5, 39.5]);
  const buffered = turf.buffer(point, 1, {units: 'miles'});
</script>

现代 JavaScript (ES Modules)

import { buffer, distance, intersect } from '@turf/turf';

const point = turf.point([-76.5, 39.5]);

实际应用案例

案例 1: 共享单车站点优化

// 分析现有站点的覆盖范围
const stations = [...]; // 站点位置
const coverage = stations.map(station => 
  turf.buffer(station, 0.5, {units: 'kilometers'}) // 500 米覆盖
);

// 找出未覆盖的区域
const cityBounds = turf.polygon([...]);
const unionCoverage = turf.union(...coverage);
const gaps = turf.difference(cityBounds, unionCoverage);

// 在缺口处建议新站点
const suggestedLocations = turf.centroid(gaps);

案例 2: 紧急医疗服务分析

// 计算每个医院的服务范围（15 分钟车程 ≈ 10 公里）
const hospitals = [...];
const serviceAreas = hospitals.map(h => 
  turf.buffer(h, 10, {units: 'kilometers'})
);

// 查找未被覆盖的居民区
const residentialAreas = [...];
const uncovered = residentialAreas.filter(area => 
  !serviceAreas.some(service => turf.booleanIntersects(area, service))
);

// 建议新医院位置
const optimalLocation = turf.centerOfMass(turf.union(...uncovered));

案例 3: 城市绿地分析

// 计算每个社区的绿地可达性
const parks = [...];
const communities = [...];

communities.forEach(community => {
  const nearbyParks = parks.filter(park => {
    const dist = turf.distance(community, park, {units: 'kilometers'});
    return dist < 0.5; // 500 米内有公园
  });
  
  community.properties.greenSpaceAccess = nearbyParks.length > 0;
});

性能优势

客户端分析的优势

  1. 实时响应: 无需等待服务器，用户操作即时反馈
  2. 降低服务器负载: 空间计算在用户设备上进行
  3. 离线工作: 数据加载后可离线分析
  4. 隐私保护: 敏感地理数据不必上传到服务器

交互式应用示例

// Shiny/R 或 React 应用中的实时空间过滤
map.on('draw:created', (e) => {
  const drawnPolygon = e.layer;
  
  // 立即过滤显示结果
  const filtered = turf.filter(allFeatures, drawnPolygon, {
    predicate: 'intersects'
  });
  
  // 即时更新地图显示
  updateMapLayer(filtered);
});

支持的模块列表（部分）

类别模块
测量distance, length, area, bbox
插值interpolate, idw, tin
变换buffer, rotate, scale, translate
叠加intersect, union, difference, symDifference
要素point, lineString, polygon, featureCollection
聚合collect, combine, explode
集合nearestPoint, nearestPointOnLine, clusterEach
网格rectangleGrid, hexGrid, pointGrid
随机randomPoint, randomPolygon, randomPosition
辅助centroid, center, centerOfMass, bboxPolygon

完整 API 文档：https://turfjs.org/docs/api

总结

Turf.js 是一个功能强大、灵活易用的地理空间分析库，适用于：

核心优势:

到此这篇关于Turf.js正确使用超详细案例的文章就介绍到这了,更多相关Turf.js使用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

阅读全文