echarts地图数据的压缩

为什么80%的码农都做不了架构师？>>>   

echarts采用geojson格式的地图进行自定义或者扩展，而采用这种格式，免不了会出现一大堆坐标值，echarts为了减少地图文件的大小，对polygon对象的坐标数组进行了压缩，压缩算法为ZigZag，坐标的二维数组压缩为一段字符串，增加属性encodeOffsets作为偏移初始，是坐标数组的第一个元素的1024倍。在装载地图的时候进行解码。源代码中，解码函数如下：

function decodePolygon(coordinate, encodeOffsets) {
	        var result = [];
	        var prevX = encodeOffsets[0];
	        var prevY = encodeOffsets[1];

	        for (var i = 0; i < coordinate.length; i += 2) {
	            var x = coordinate.charCodeAt(i) - 64;
	            var y = coordinate.charCodeAt(i + 1) - 64;
	            // ZigZag decoding
	            x = (x >> 1) ^ (-(x & 1));
	            y = (y >> 1) ^ (-(y & 1));
	            // Delta deocding
	            x += prevX;
	            y += prevY;

	            prevX = x;
	            prevY = y;
	            // Dequantize
	            result.push([x / 1024, y / 1024]);
	        }			
	        return result;
	    }

在自定义地图中，如果觉得地图文件太大，不便于下载的话，可以采用同样的压缩算法，对自定义数据进行压缩，应该可以减小地图的体积（还没有实际进行测试，所以不太肯定）。

坐标数组压缩函数源码如下，基本上是解码过程的逆运算。

function encodePolygon(coordinate){
			var prevX=0,prevY=0;
			var coorstr="";
			var encodeOffsets=[];
			var result={'coordinate':coorstr,'encodeOffsets':encodeOffsets};
			for(var i=coordinate.length-1;i>0;i--){
				var x=coordinate[i][0];
				var y=coordinate[i][1];
				x=x*1024;y=y*1024;
				x-=coordinate[i-1][0]*1024;
				y-=coordinate[i-1][1]*1024;
				x=(x << 1) ^ (x >> 31);
				y=(y << 1) ^ (y >> 31);		
				coorstr=String.fromCharCode(x+64)+String.fromCharCode(y+64)+coorstr;
			}
			coorstr="@@"+coorstr;			
			encodeOffsets=[coordinate[0][0]*1024,coordinate[0][1]*1024]
			return result;
			
		}		

后面如果有时间，我再写一个用这个函数压缩地图数据的工具提供给大家。其实，我觉得Echarts有现成的工具，干嘛不发布出来，省的大家这么折腾。

参考资料： http://www.cnblogs.com/en-heng/p/5570609.html

转载于:https://my.oschina.net/rodger/blog/838763