使用前提:在gis领域中,需求把上传的shp文件解析成json文件在地图上进行叠加;解析txt文件成json数据进行叠加
使用插件和方法:openlayers对象ol;解析shp和txt需要new FileReader()方法;上传文件返回的file对象;
上传返回的file对象就不进行举例了,element-ui、iview、antd等插件都支持上传的方法来返回文件的file对象;
直接上源码给大家参考;源码如下:
1、解析上传shp文件成json数据
import GeoJSON from 'ol/format/GeoJSON';
import WKT from 'ol/format/WKT';
let fileReader = new FileReader();
fileReader.readAsArrayBuffer(file);
fileReader.onload = function () {
let shapefile = require('shapefile');
shapefile.read(this.result).then((geoJson) => {
var result = _this.initJson(geoJson);
});
};
initJson(geoJson) {
var geojson_format = new GeoJSON();
var shpfeatures = geojson_format.readFeatures(geoJson);
var result = {
polygonWKT: [],
polygonJson: [],
geometry: [],
shpfeatures: shpfeatures,
currentGeometryType: 'esriGeometryPolygon'
};
var conds = []
for (var f = 0; f < shpfeatures.length; f++) {
var gType = shpfeatures[f].getGeometry().getType();
result.polygonWKT.push(new WKT().writeGeometry(shpfeatures[f].getGeometry(), {
}));
if (shpfeatures.length == 1) {
switch (gType) {
case 'Polyline':
result.currentGeometryType = 'esriGeometryPolyline';
break;
case 'Point':
result.currentGeometryType = 'esriGeometryPoint';
break;
case 'Polygon':
result.currentGeometryType = 'esriGeometryPolygon';
break;
case 'MultiLineString':
result.currentGeometryType = 'esriGeometryPolyline';
break;
case 'MultiPolygon':
result.currentGeometryType = 'esriGeometryPolygon';
break;
}
result.geometry.push(shpfeatures[f].getGeometry());
conds = shpfeatures[f].getGeometry().getCoordinates(