Skip to content

一、地理信息系统基础:GIS 是什么

GIS(Geographic Information System) 本质是:

用计算机处理“带有空间位置的数据”。

普通数据:

用户ID  年龄  性别

GIS 数据:

经度  纬度  人口  温度

例如:

116.397, 39.908 → 北京

所以 GIS 数据 =

空间位置 + 属性数据

例如:

经度纬度城市人口
116.3939.90北京2100万

二、坐标系统(最重要)

地图必须知道:

地球上的一个点在哪里

最常见是 经纬度坐标

经度:东西
纬度:南北

例如北京:

116.397°E
39.908°N

这个坐标系统叫:

WGS84

GPS 用的就是这个。

很多地图都用它,例如:

  • GPS
  • Google Map

三、为什么需要“坐标投影”

问题来了:

地球是球体 屏幕是平面

必须把 球 → 平面

这就叫:

坐标投影(Projection)

就像:

橙子皮 → 摊平

一定会产生 变形

四、常见投影:Web Mercator

互联网地图基本用:

Web Mercator

很多地图用它:

  • Google Maps
  • OpenLayers
  • Leaflet
  • Mapbox

坐标叫:

EPSG:3857

特点:

单位不是经纬度
而是 米

例如:

经纬度
116.397,39.908

转换后:

12958000, 4850000

这就是:

WGS84 → WebMercator

五、中国地图为什么不一样

中国地图有坐标加密

常见三种:

坐标系用在哪
WGS84GPS
GCJ02高德 / 腾讯
BD09百度

例如:

北京

WGS84
116.397 39.908

GCJ02
116.403 39.915

所以开发经常需要:

坐标转换

六、空间关系(Spatial Relationship)

GIS 的核心能力其实是:

判断空间对象之间的关系

例如:

1 相交

两个图形是否交叉

A ∩ B

例如:

一个区域
是否覆盖某个城市

2 包含

A 包含 B

例如:

一个点是否在区域内

这叫:

Point In Polygon

3 距离

两个点之间距离

例如:

配送距离

公式:

Haversine

4 最近点

例如:

找最近的充电站

七、GIS 数据类型

GIS 有两种数据:

1 矢量数据(Vector)

点:

城市

线:

道路

面:

行政区

格式:

GeoJSON

示例:

json
{
 "type":"Point",
 "coordinates":[116.397,39.908]
}

2 栅格数据(Raster)

其实就是:

图片

例如:

卫星图

地图瓦片:

256x256

八、互联网地图渲染原理

地图其实是:

很多瓦片拼起来

例如:

Zoom 10

会加载很多:

256x256 图片

例如:

/tile/10/532/342.png

九、前端 GIS 技术栈

常见:

地图:

  • Mapbox GL JS
  • OpenLayers
  • Leaflet

可视化:

  • deck.gl
  • ECharts

十、你懂 GIS 原理吗?

标准回答:

GIS 的核心是处理带空间坐标的数据。 基础包括三个部分:

第一是坐标系统,比如 GPS 使用 WGS84。

第二是坐标投影,因为地球是球体,地图是平面,所以需要投影,互联网地图通常使用 Web Mercator(EPSG:3857)。

第三是空间关系,例如点是否在多边形内、两个图形是否相交、距离计算等。

在前端开发中,我们通常会处理 GeoJSON 数据,通过 Mapbox 或 OpenLayers 做渲染,同时需要做坐标转换,比如 WGS84、GCJ02 之间转换。