Turf.js簡介

本文轉自 Turf.js—讓你在瀏覽器上實現地理分析 請支持原創!

前言

我們在地圖相關系統中必不可少的就是空間分析操作相關需求,例如緩沖區、計算等高線等。憑借簡單的js我們無法將點線面進行結合分析,而Turf.js的出現幫我們解決了這一難題,讓我們在瀏覽器中也可以輕松的使用以前只屬于桌面GIS的分析功能。

Turf.js簡介及其意義

Turf.js是MapBox公司研發的基于瀏覽器端的空間分析庫,它使用JavaScript進行編寫,通過npm進行包管理。值得一提的是,良好的模塊化設計使其不僅能夠作用于瀏覽器端、還可通過Node.js在服務端使用。Turf 原生支持 GeoJSON 矢量數據。GeoJSON 的優點是結構簡單,并且得到了所有網頁地圖API的支持;但 GeoJSON 不支持空間索引,這個缺點可能會限制 Turf 處理大型文件的能力效率。其適用于輕量級(數據輕量而非功能輕量)的WebGIS應用。

瀏覽器端支持空間分析的意義在于,通過網頁地圖的不僅可提供地名搜索與路徑查詢(目前 Google Maps 的功能其實與十年前并沒有太大區別),而且可以在瀏覽器中分享空間分析模型。以前的 WebGIS 功能當然也支持空間分析,但是分析過程需要在服務器端進行,本地能夠進行的設置有限,現在使用 Turf.js 可以將分析過程完全移到本地,如果頁面中提供了參數設置的話,可以在本地對模型進行修改并立即看到分析結果。這樣的直接好處有兩個方面:更渲的數據展示,以及更加復雜的用戶交互(復雜交互本身需要空間分析作為基礎)。

安裝

引入全部功能

// 下載$ npm install @turf/turf

// 引入import * as turf from '@turf/turf'import { lineString, along } from '@turf/turf'

如果想引用指定模塊,可以下載功能名稱對應的npm包(功能名稱對應其包的名稱)

$ npm install @turf/collect

import collect from '@turf/collect';

功能

Turf 有著質量極高的官方文檔,詳細介紹了每個功能模塊的使用,并有在線示例可以直接上手試用。

Turf的功能分為幾大類,我們列舉幾個常用類并抽出一兩個常用方法做展示。

MEASUREMENT

area(計算區域面積)

獲取一個或多個feature,并返回其面積平方米。

參數

返回

number - area in square meters

示例

var polygon = turf.polygon([[        [108.09876, 37.200787],        [106.398901, 33.648651],        [114.972103, 33.340483],        [113.715685, 37.845557],        [108.09876, 37.200787]      ]]);var area = turf.area(polygon);

npm install @turf/area

centerOfMass(計算多邊形質心)

取任何Feature或FeatureCollection,并利用這個公式返回其質心:多邊形質心。

參數

返回

Feature - the center of mass

示例

var polygon = turf.polygon([[[-81, 41], [-88, 36], [-84, 31], [-80, 33], [-77, 39], [-81, 41]]]);var center = turf.centerOfMass(polygon);

npm install @turf/center-of-mass

TRANSFORMATION

buffer(計算緩沖區)

為給定半徑的Feature計算一個緩沖區。支持的單位是英里、公里和度數。

參數

options選項

返回

(FeatureCollection|Feature <(Polygon|MultiPolygon)>|undefined) - buffered features

示例

var point = turf.point([-90.548630, 14.616599]);var buffered = turf.buffer(point, 500, {units: 'miles'});

npm install @turf/buffer

transformTranslate(平移)

在給定的方向角上沿沿恒向線移動指定距離的任何geojsonFeature或幾何圖形。

參數

options選項

返回

GeoJSON - the translated GeoJSON object

示例

var poly = turf.polygon([[[0,29],[3.5,29],[2.5,32],[0,29]]]);var translatedPoly = turf.transformTranslate(poly, 100, 35);

npm install @turf/transform-translate

MISC

lineIntersect(計算兩端線段相交點)

獲取任何LineString或PolygonGeoJSON,并返回相交點。

參數

返回

FeatureCollection - point(s) that intersect both

示例

var line1 = turf.lineString([[126, -11], [129, -21]]);var line2 = turf.lineString([[123, -18], [131, -14]]);var intersects = turf.lineIntersect(line1, line2);

npm install @turf/line-intersect

mask(返回非遮罩多邊形)

獲取任意類型的多邊形和一個可選的遮罩,并返回一個帶孔的多邊形外部環。

參數

返回

Feature - Masked Polygon (exterior ring with holes).

示例

var polygon = turf.polygon([[[112, -21], [116, -36], [146, -39], [153, -24], [133, -10], [112, -21]]]);var mask = turf.polygon([[[90, -55], [170, -55], [170, 10], [90, 10], [90, -55]]]);var masked = turf.mask(polygon, mask);

npm install @turf/mask

JOINS

pointsWithinPolygon(返回在多邊形內的點)

找到落在(多個)多邊形內的點。

參數

返回

FeatureCollection - points that land within at least one polygon

示例

var points = turf.points([    [-46.6318, -23.5523],    [-46.6246, -23.5325],    [-46.6062, -23.5513],    [-46.663, -23.554],    [-46.643, -23.557]]);var searchWithin = turf.polygon([[    [-46.653,-23.543],    [-46.634,-23.5346],    [-46.613,-23.543],    [-46.614,-23.559],    [-46.631,-23.567],    [-46.653,-23.560],    [-46.653,-23.543]]]);var ptsWithin = turf.pointsWithinPolygon(points, searchWithin);

npm install @turf/points-within-polygon

BOOLEANS

booleanPointInPolygon(判斷點是否在多邊形內)

取一個點和一個多邊形或多多邊形,并確定該點是否位于該多邊形內。多邊形可以是凸的,也可以是凹的。

> npm install @turf/boolean-point-in-polygon

參數

options選項

返回

boolean - true if the Point is inside the Polygon; false if the Point is not inside the Polygon

示例

var pt = turf.point([-77, 44]);var poly = turf.polygon([[  [-81, 41],  [-81, 47],  [-72, 47],  [-72, 41],  [-81, 41]]]);turf.booleanPointInPolygon(pt, poly);//= true

附錄

• 官方文檔
• Turf.js中文網
• Turf: GIS for web maps (這個網頁里有 mapbox.com 基于 Turf 開發的精美地圖……的截圖)