openlayers--添加数据源
调用地图服务接口后,对接口返回值做处理--添加数据源
if(res.features.length) {
//获取--根据行政区代码查询对应行政区的中心点
let lons = res.features[0].properties.LON;
let lats = res.features[0].properties.LAT;
pagemap.getView().setCenter([lons,lats])
if(res.features && res.features.length > 0) {
let { features } = res
//边界的点位数组---中心点点位的数组
let polygonFeatures = [], pointFeatures = []
//叠加边界以及数量
features.map(feature => {
//绘制边界
let rings = feature.geometry.coordinates[0]
let featurePolygon = new ol.geom.Polygon(rings)
let _feature = new ol.Feature({geometry: featurePolygon})
//featureStyle 边界线以及边界内容的样式
_feature.setStyle(this.featureStyle()['sourceData'])
polygonFeatures.push(_feature)
//绘制中心点文字
let pointCenter = [feature.properties.LON,feature.properties.LAT];
let featurePoint = new ol.geom.Point(pointCenter)
let pointFeature = new ol.Feature({
geometry: featurePoint,
name: data.value,
});
//createPointStyle 中心点的图文标注样式设置
pointFeature.setStyle(this.createPointStyle(pointFeature));
})
//乡镇排名叠加火情点
if(this.paimingArr){
this.paimingArr.map(item=>{
let pointFireCenter = [Number(item.longitude),Number(item.latitude)];
let featureFirePoint = new ol.geom.Point(pointFireCenter)
let pointFireFeature = new ol.Feature({
geometry: featureFirePoint,
name: item.towername,
});
//createImgStyle 行政区内所有点位的图文标注样式设置
pointFireFeature.setStyle(this.createImgStyle(pointFireFeature));
pointFireFeature.set('monthFireInfo',item);
pointFeatures.push(pointFireFeature)
})
}
this.addVectorLayers(pointFeatures)
this.clickToPop();
}
}
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单,K8s 太复杂?w7panel 让容器管理更轻松!