当前位置：首页 > news >正文

ECharts地图数据压缩-ZigZag算法

news 2025/10/22 7:35:50

ECharts地图数据压缩-ZigZag算法

开发过程中需要都echarts的地图数据进行压缩，经查找资料，发现echarts支持直接使用对GEOJson的coordinates进行 ZigZag压缩后的数据。
开始，尝试使用 mapshare-plus，但这个代码太老了，没有人维护，批量导出GEOJson格式文件的功能是坏的——可能大佬写着写着忘了。。。
在这里插入图片描述

修改之后，发现导出地图文件载入ECharts后有地图图形丢失的情况。。。
本人不是专业前端，无奈只有将加密方法单独摘出，万幸测试通过，没有问题

function convert2Echarts(rawStr) {let json = JSON.parse(rawStr);// Meta tag 不能删除，ECharts会识别不到json.UTF8Encoding = true;let features = json.features;features.forEach(function (feature) {let encodeOffsets = feature.geometry.encodeOffsets = [];let coordinates = feature.geometry.coordinates;if (feature.geometry.type === 'Polygon') {coordinates.forEach(function (coordinate, idx) {coordinates[idx] = encodePolygon(coordinate, encodeOffsets[idx] = []);});} else if (feature.geometry.type === 'MultiPolygon') {coordinates.forEach(function (polygon, idx1) {encodeOffsets[idx1] = [];polygon.forEach(function (coordinate, idx2) {coordinates[idx1][idx2] = encodePolygon(coordinate, encodeOffsets[idx1][idx2] = []);});});}});return JSON.stringify(json);
}function encodePolygon(coordinate, encodeOffsets) {let result = '';let prevX = quantize(coordinate[0][0]);let prevY = quantize(coordinate[0][1]);// Store the origin offsetencodeOffsets[0] = prevX;encodeOffsets[1] = prevY;for (let i = 0; i < coordinate.length; i++) {let point = coordinate[i];result += encode(point[0], prevX);result += encode(point[1], prevY);prevX = quantize(point[0]);prevY = quantize(point[1]);}return result;
}function encode(val, prev) {// Quantizationval = quantize(val);// var tmp = val;// Deltaval = val - prev;// 估计是那时候浏览器的bug，我试了客户现场的浏览器，没发现这个问题，就删了，如果需要适配老机型的需要注意// if (((val << 1) ^ (val >> 15)) + 64 === 8232) {//WTF, 8232 will get syntax error in js code//	  val--;// }// ZigZagval = (val << 1) ^ (val >> 15);// add offset and get unicodereturn String.fromCharCode(val + 64);
}function quantize(val) {return Math.ceil(val * 1024);
}

压缩后的地图数据大概是这样：
在这里插入图片描述