一种地图坐标系近似转换思路以及应用

[t517134500]

前言

目前接触到的一些项目中对于2d/3d地图展示的需求普遍增多，而现有的一些技术往往都有一些局限性。如：
1.百度地图、谷歌地图等

这一类gis服务技术封装的非常完善，效果也非常棒，但是在遇到一些需要具体定制的效果时会用的非常头痛。

2.echarts、Highcharts等

这类图形库具有非常完备的二次开发能力，但是却又受限于geojson（网络上的geojson不全，且现有的一些geojson行政分区不是最新的）。

而有些时候项目上需要的是一种定制化效果明显的且可以布置到内网环境的但是又不需要高精度的地图展示效果。本文将讲述一种实现这类需求的一个简单思路：用一张UI给出的图片或是svg去实现地图的模拟并完成对应坐标点的转换。

关于地图坐标系

由于一般项目中用到的都是经纬度坐标做一些效果，这里就会涉及到地图坐标系和屏幕坐标系之间转换。
首先，一个gis服务往往会有自己的地理坐标系和投影坐标系以及自己的转换函数，不同的服务也会有自己的不同的转换函数以及混淆函数。
地理坐标系

投影坐标系

屏幕坐标系

这就造成了经纬度坐标不能在不同的gis服务中通用。而在不考虑地理坐标系，只对应投影坐标系时，其实可以看做是多个不同的平面直角坐标系。屏幕坐标也是一个直角坐标系，因此，在对应将经纬度坐标转换成屏幕坐标时可以看做是坐标系变换，即矩阵变换。
参考资料：计算机图形学的矩阵变换

矩阵变换

根据矩阵变换也是一种线性变换，可以得知：两个不同坐标系存在一个变换矩阵来相互转化各自的向量。
即一定存在T，使 T(X) = X1;
若设经纬度坐标为 (x1,y1),屏幕坐标(x,y);
则有

即：
x = x1a+y1b+c;
y = x1d+y1e+f;
如果将经纬度和其对应的屏幕坐标当做已知变量，则可以将这个方程组看做是一个6元一次方程组。而根据n元一次方程组最少需要n组一次方程来构建其唯一解可以得知：至少需要3组互不相等的对应坐标组才能得出变换矩阵。
即：至少需要3个互不相等对应点就能确定屏幕与坐标系之间的转换关系。

实现方式

在拿到UI给出的svg或者图片后，可以通过各个gis服务的官网demo中取到3个不同的对应点坐标（根据不同的坐标系到不同的gis服务中取）；
运用获取到的对应点可以推算出需要的变量，如下图：

而需要运用到时可以使用变量进行计算，如下图：

demo:利用svg实现的3d地图

扩展

其实在大部分的情况下，用来对应的图片和投影坐标系仅存在缩放和平移关系，不会存在旋转关系。因此上述代码任然有简化的可能：

即:
x1 = ax+b;
y1 = cy+d;
同理，这时只需要两组不相等的关系点就可以确定转换坐标。