Openlayers4动态绘制地图分幅网络 | 您所在的位置:网站首页 › python绘制网格地图 › Openlayers4动态绘制地图分幅网络 |
Openlayers4动态绘制地图分幅网络
原创
GIS韩 2023-05-29 01:28:40 博主文章分类:Openlayers ©著作权 文章标签 Openlayers 图幅网格 vue 2d Math 文章分类 HarmonyOS 后端开发 ©著作权归作者所有:来自51CTO博客作者GIS韩的原创作品,请联系作者获取转载授权,否则将追究法律责任在Openlayers地图上根据地图分幅规则,绘制分幅网格,需要注意的有几点: 1确认什么比例尺时展示什么1:100万、1:50万...比例尺的分幅 2根据地图当前视窗位置,动态绘制注记和网络,因为全部绘制的话,网格和注意太多,严重影像运行速度 3绘制经线和纬线,不绘制网格,网格严重内存更多 代码如下: addSheetNumber(number){ getLayerByName(this.$map2d, "drawLayer") .getSource() .clear(); var d1=6; var d2=4; switch (number) { case 1000000: d1=6; d2=4; break; case 500000: d1=3; d2=2; break; case 250000: d1=1.5; d2=1; break; case 100000: d1=0.5; d2=0.3333; break; default: break; } for (let index = 0; index < 88/d2+1; index++) { if(index==0){this.outLine(index*d2,-180,index*d2,180)}else{ this.outLine(index*d2,-180,index*d2,180); this.outLine(-index*d2,-180,-index*d2,180); } } //画经线 for (let i = 0; i < 360/d1; i++) { this.outLine(-88,-180+i*d1,88,-180+i*d1); } }, toggleSheetNumber(){ const that=this; var view=this.$map2d.getView(); if(this.sheetType!=0){ //第二次点击清除网络 view.un('change:resolution',that.changeListener); view.un('change',that.resetNumberText); getLayerByName(this.$map2d, "drawLayer") .getSource() .clear(); getLayerByName(this.$map2d, "textLayer").getSource() .clear(); this.sheetType=0; return; } view.on('change:resolution',that.changeListener); view.on('change',that.resetNumberText); this.changeListener(); }, changeListener(e){ var view=this.$map2d.getView(); var ruler=view.getResolution(); if(ruler>0.02197&&this.sheetType!=1000000){ this.sheetType=1000000; this.addSheetNumber(1000000); } else if(ruler0.00549&&this.sheetType!=500000){ this.sheetType=500000; this.addSheetNumber(500000); }else if(ruler0.00297&&this.sheetType!=250000){ this.sheetType=250000; this.addSheetNumber(250000); }else if(ruler0){i1++} var i2=Math.floor((extent[2]+180)/d1); if((extent[2]-i2*d1-d1/2)>0){i2++} var j1=Math.floor((extent[1]+88)/d2); if((extent[1]-j1*d2-d2/2)>0){j1++} var j2=Math.floor((extent[3]+88)/d2); if((extent[3]-j2*d2-d2/2)>0){j2++} for (let index = i1; index < i2; index++) { this.outLabel(index*d1-180+d1/2,extent[3],String(index+1)) } for (let h = j1; h < j2; h++) { var text=h; if(h 赞 收藏 评论 分享 举报上一篇:GeoServer的WMS地图服务高并发测试,与虚拟机内存对并发响应时间的影响 下一篇:Openlayers地图背景透明度设置 |
CopyRight 2018-2019 实验室设备网 版权所有 |