WebGIS中距离及面积测量的原理和实现以及坐标转换的简单介绍
1.背景
在这一章里我们将讨论基础工具栏中另外两个常用工具:距离测量工具盒面积测量工具。
距离测量工具要求实现如下功能:
a.通过鼠标点击,在地图上将每个点击点连成线段进行表示
b.每个线段处表示出此线段代表的实际距离
c.双击鼠标,停止此轮测量,表示出所有线段总长度
d.允许鼠标拖动地图
面积测量工具的需求与测量工具的需求大致相同,描述为下:
a.通过鼠标点击,在地图上将点击点连成面
b.双击鼠标,停止此轮测量,表示出面的总面积
c.允许鼠标拖动地图
2.从原理谈起
在完成上述需求时,我们首先得了解此功能涉及到的核心原理,其实就是我们在初等几何中学过的距离公式和面积公式。
这里我先给出一个模型示意图:
2.1距离换算公式
L(AB)= Math.sqrt((x1-x2)*(x1-x2)+(y1-y2)*(y1-y2));
2.2多边形面积换算公式
首先我直接给出公式:
S(total)=Math.abs(0.5*(x1*y2-y1*x2+x2*y3-y2*x3+….+xn*y1-yn*x1)));
这个公式到底是怎么推导出来的呢?我这里跟大家大致说下。
2.2.1 用坐标点表示三角形面积
我们都知道三角形中最通用的面积公式:S=1/2*a*h。
在我之前的文章(存储过程判断两线重合点)里还提到过另外一个公式,海伦公式:
S=Math.sqt((p*(p-a)*(p-b)*(p-c))),其中p=1/2*(a+b+c)。
这里我们继续推导海伦公式,我们已经知道A(x1,y1),B(x2,y2),C(x3,y3)。则:
a=Math.sqt((x2-x3)*(x2-x3)+(y2-y3)*(y2-y3)),b和c同理。
将用坐标点表示的a,b,c,p代入海伦公式,我们可以得出面积在坐标系下的另外一个等同公式:
S= Math.abs(0.5*(x1*y2-y1*x2+x2*y3-y2*x3+x3*y1-y3*x1));
2.2.2 由三角形面积推导出多边形面积
如模型中,我们在多边形内部设定一个P(x0,y0)点,通过P点连接多边形中各端点,便可将多边形分割成(n-2)个三角形。
则多边形的面积变成了:
S(total)=S(PAB)+S(PBC)+S(PCD)+…+S(PNA);
将三角形的面积坐标公式代入,最后可以算出一个抵消掉了P点坐标的通用公式:
S(total)=Math.abs(0.5*(x1*y2-y1*x2+x2*y3-y2*x3+….+xn*y1-yn*x1)));
2.2.3注意
通过推导公式,我们可以看出,该公式对环状多边形的面积无效。
3.实现过程
3.1 具体步骤
距离量测和面积量测的实现方式上大致是一样的。
a.初始化三个参数,isDone为true,flag为false,isClick为false。
b.鼠标mouseDown时,首先判断done是否为true,如果是,则清掉地图上已有的绘制。记录此时的startPoint,并且给定三个参数,isDone为false,flag为true,isClick为true。
c.鼠标mouseMove时,判断此时flag是否为true。如果是true,则触发平移功能。如果是false,首先判断isDone是否为 true,如果是,先对之前所有的点进行清空重绘,再判断isClick是否为true,如果是,则随着鼠标移动实时绘制线段。
d.鼠标mouseUp时,记录此时的endpoint,可以通过startpoint和endpoint算出此时的线段长度。将flag变为false,即停止平移功能。
e.鼠标doubleClick时,将isDone参数改为true,flag改为false,isClick改为false。算出整个过程中的总距离或者总面积。
3.2 注意问题
因为此功能添加入了地图平移功能,所以在实时绘制时,如果不注意很容易出现绘制点偏移问题。
关于该偏移的引发,我在前面两章做了比较详细的解释,也提供了解决方法,大家如果不是很明白,可以回头看看。
在具体步骤中,我提到mouseMove事件中有个清空重绘过程,便是为了防止地图移动所照成的影响。同时,在每一个点的绘制时,一定要减去总偏移量。
3.3效果展示
这里分别给出距离量测和面积量测的两个效果图:
4.进一步探讨
以上,我们给出的公式,均是针对平面坐标的,即做过投影转换的坐标。假如,我们得到的坐标是经纬度坐标,此公式还能用么?
答案是不能。所以我们得自己做投影转换,将经纬度坐标转成平面坐标。这类转换公式,涉及的原理比较复杂,代码的实现也相对困难。
目前,我接触过的转换有WGS84的,BeJing54的,XiAn80的以及一些地方自己的地理坐标系,这其中还涉及到四参数和七参数方法。具体的过程,在这个系列的以后章节我再跟大家详细讨论。
不过,在精度要求不高的情况里,我们可以统一用Mecator(UTM)投影进行转换,并且使用四参数方法,将四参数固定即可。
5.总结
这一章里,我们留了一个巨大的问题,即坐标转换问题。该问题是一个很大的学问,不过我们能够一般性理解并且使用这方面的算法即可。在下一个章节里, 我将跟大家一起探讨基本功能中剩下的另外两个功能,清空功能和地图定位功能。在下下章,我们将一起探讨基本功能中所涉及到的比较难的一个功能,I查询功 能,该功能的合理实现和合理展现均是需要仔细推敲的。欢迎大家持续关注。