前端2D地图和3D场景中的坐标系
大家好，我是 CC，在这里欢迎大家的到来~
背景
从事前端开发的前两年，做了不少和地图、3D场景相关的项目，其中涉及到很多坐标系，使用时傻傻分不清。现在有时间整理总结下常用常见坐标系。
2D地图坐标系
WGS84 - 世界大地测量系统（1984年）
数值：大地经度（longitude）大地纬度（latitude）大地高度（altitude）
地心坐标系，空间直角坐标系，是国际上 GPS 使用的坐标系。
- 坐标原点为地球质心
- Z轴指向BIH（国际时间服务机构）1984.0定义的协议地球极（CTP)方向
- X轴指向BIH1984.0的零子午面和CTP赤道的交点
- Y轴与Z轴、X轴垂直构成右手坐标系
CGCS2000 - 2000国家大地坐标系
中国最新国家大地坐标系，与 WGS84 相似。
采用 ITRF97 框架、2000.0历元的三位地心坐标系统。
- 原点位于海洋和大气的整个地球的质量中心
- Z轴指向由原点指向历元2000.0的地球参考极的方向
- X轴指向由原点指向格林尼治参考子午线与地球赤道面(历元2000.0)的交点
- Y轴与Z轴、X轴构成右手正交坐标系，采用广义相对论意义下的尺度
GCJ-02 - 火星坐标系
中国国家测绘局绘制的地理坐标系统，加密后的坐标（在原始坐标（WGS84坐标）基础上进行偏移后得到新的坐标）。
在中国境内定位和地图绘制使用该坐标系，像高德地图、腾讯地图。
加密坐标的偏移是非线性随机的，因此从火星坐标推出真实坐标是无法实现的。
BD-09 - 百度坐标系
百度基于火星坐标系使用二次加密后得到，用于百度地图。
Web Mercator - 墨卡托坐标系
墨卡托投影坐标系
由于屏幕是平面的，我们必须将球面的地理坐标“投影”到平面上。这个过程会产生变形（形状、面积、距离或方向）。
- 核心思想：通过数学公式将 (经度， 纬度) 转换为平面上的 (x, y) 像素坐标。
- 单位：像素、米。
- 常见投影：Web Mercator（EPSG:3857），这是互联网地图的事实标准。
特点：
- (0, 0) 点位于地图的左上角。
- X轴向右（东）为正，Y轴向下（南）为正。
- 世界的范围被投影到一个正方形上，经度范围 [-180, 180] 被映射到 X轴 [0, 256]（在缩放级别0时），纬度范围 [-85.06, 85.06] 被映射到 Y轴 [0, 256]（注意：无法显示南北两极）。
- 随着缩放级别 z 的增加，整个世界地图的像素尺寸是 256 * 2^z。
3D场景坐标系
笛卡尔坐标系
三条互相垂直的坐标轴（x、y、z）组成，用（x，y，z）表示空间中的一个点。
右手定则
将右手的大拇指、食指和中指分别指向y、z、x 轴正方向，它们互相垂直。
场景：WebGL、Three.js
左手定则
将左手的大拇指、食指和中指分别指向y、z、x轴正方向，它们互相垂直。
场景：Babylon.js
总结
- 2D地图坐标：将地球椭圆球面映射到2D平面地图上，区分地理坐标和投影坐标。
- 3D场景坐标：是三维笛卡尔坐标系，Three.js默认Y轴向上，Z轴向外。
参考文章
CGCS2000、WGS84和ITRF框架坐标之间的差异和转换方法
ThreeJS 坐标系（旋转跳跃，永不停歇）