//根据geojson不同数据类型渲染对应的点线面
let id = row.id;//点击表格行获取的
presionMap.uploadMangement(id).then(response=>{
if(response.data.data!=null){
if(row.dataType ==".geojson"){
let jsonPase = eval("("+response.data.data.fillContent+")");
let coordinates = jsonPase.features[0].geometry.coordinates;
this.map.addSource("shangHaiGeoJson",{
type:"geojson",
data:jsonPase
})
this.map.addLayer({
id:"shangHaiGeoJson",
type:"fill",
source:"shangHaiGeoJson",
layout:{},
paint:{
"fill-color":"red",
"fill-opacity":0.5,
},
fillter:["==","$type","Polygon"]
})
this.map.addLayer({
id:"shangHaiGeoJsonLine",
type:"line",
source:"shangHaiGeoJson",
layout:{
"line-cap":"round",
"line-join":"round"
},
paint:{
"line-color":"red",
"line-width":5,
"line-opacity":0.5
},
fillter:["==","$type","LineString"]
})
this.map.addLayer({
id:"shangHaiGeoJsonPoint",
type:"circle",
source:"shangHaiGeoJson",
paint:{
"cirlce-color":"#ff7895",
"circle-radius":5,
"circle-stroke-width":2
},
fillter:["==","$type","Point"]
})
if(jsonPase.features[0].geometry.type ==="MultiPolygon"){
this.fly(coordinates[0][0][0],6);
}else if(jsonPase.features[0].geometry.type==="Polygon"){
this.fly(coordinates[0][0],6);
}else if(jsonPase.features[0].geometry.type ==="LineString"){
this.fly(coordinates[0],6);
}else{
this.fly(coordinates,6)
}
}
}
}).catch(error=>{
this.$message({
type:"error",
message:"文件内容格格式错误",
center:true,
duration:1500,
offset:150
})
})
根据geojson不同数据类型渲染对应的点线面
最新推荐文章于 2022-05-13 17:48:29 发布