最近项目遇到一个要将地图分区的需求,由于前人已经离我而去,所以也只能从头再来。
首先要有一个完整地图的Json,可以从http://datav.aliyun.com/portal/school/atlas/area_selector 导出一份地图,
然后再各个省市中加上,
"area": "东北",
"area": "华北",
这样的分类吧
然后保存好文件。
接下来将文件导入另一个分区网站,https://mapshaper.org/
将文件导入这个网站, 然后点console, 在命令行中输入dissolve 'area' -o result.json即可完成下载名字为result.json的文件。
最后可能需要压缩json文件,否则打包的时候, 会导致文件过大。
压缩代码
function convert2Echarts (json) {
let results = ''
json.UTF8Encoding = true
let features = json.features
if (!features) {
return
}
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] = []
)
})
})
} else if (feature.geometry.type === 'MultiLineString') {
coordinates.forEach(function (coordinate, idx) {
coordinates[idx] = encodePolygon(
coordinate, encodeOffsets[idx] = []
)
})
}
})
results = JSON.stringify(json)
return results
}
function encodePolygon(coordinate, encodeOffsets) {
var result = '';
var prevX = quantize(coordinate[0][0]);
var prevY = quantize(coordinate[0][1]);
// Store the origin offset
encodeOffsets[0] = prevX;
encodeOffsets[1] = prevY;
for (var i = 0; i < coordinate.length; i++) {
var 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){
// Quantization
val = quantize(val);
// var tmp = val;
// Delta
val = val - prev;
if (((val << 1) ^ (val >> 15)) + 64 === 8232) {
//WTF, 8232 will get syntax error in js code
val--;
}
// ZigZag
val = (val << 1) ^ (val >> 15);
// add offset and get unicode
return String.fromCharCode(val+64);
// var tmp = {'tmp' : str};
// try{
// eval("(" + JSON.stringify(tmp) + ")");
// }catch(e) {
// console.log(val + 64);
// }
}
function quantize(val) {
return Math.ceil(val * 1024);
}
const zip = convert2Echarts(require('./result.json'))
console.log(zip);
log出来的json 就是所需的json了。
export function convert2Echarts (json) {
let results = ''
json.UTF8Encoding = true
let features = json.features
if (!features) {
return
}
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] = []
)
})
})
} else if (feature.geometry.type === 'MultiLineString') {
coordinates.forEach(function (coordinate, idx) {
coordinates[idx] = encodePolygon(
coordinate, encodeOffsets[idx] = []
)
})
}
})
results = JSON.stringify(json)
return results
}
function encodePolygon(coordinate, encodeOffsets) {
var result = '';
var prevX = quantize(coordinate[0][0]);
var prevY = quantize(coordinate[0][1]);
// Store the origin offset
encodeOffsets[0] = prevX;
encodeOffsets[1] = prevY;
for (var i = 0; i < coordinate.length; i++) {
var 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){
// Quantization
val = quantize(val);
// var tmp = val;
// Delta
val = val - prev;
if (((val << 1) ^ (val >> 15)) + 64 === 8232) {
//WTF, 8232 will get syntax error in js code
val--;
}
// ZigZag
val = (val << 1) ^ (val >> 15);
// add offset and get unicode
return String.fromCharCode(val+64);
// var tmp = {'tmp' : str};
// try{
// eval("(" + JSON.stringify(tmp) + ")");
// }catch(e) {
// console.log(val + 64);
// }
}
function quantize(val) {
return Math.ceil(val * 1024);
}