gisviewer-vue3-arcgis
Version:
在应用中引入私服的包, 项目根目录下 新建文件 .npmrc 在 .npmrc 中对包源进行配置:
2 lines (1 loc) • 5.45 kB
JavaScript
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("ol/Feature"),S=require("ol/geom"),w=require("ol/layer/Vector"),p=require("ol/source/Vector"),a=require("ol/style"),v=require("ol/style/Style"),k=require("vue"),T=require("../../stores/index.js");class E{constructor(e){this.esServer="",this.currentParams=null,this.cameraLoaded=!1,this.kkLoaded=!1,this.resolutionChangeKey=null,this.moveEndKey=null,this.lastZoomLevel=null,this.viewChangeDebounceTimer=null,this.map=e,this.mapView=this.map.getView();const i=T.default.useAppDataStore,s=k.toRaw(i.mapConfig);this.esServer=(s==null?void 0:s.esServer)||"",this.cameraLayer=new w({source:new p,visible:!1}),this.map.addLayer(this.cameraLayer),this.kkLayer=new w({source:new p,visible:!1}),this.map.addLayer(this.kkLayer)}async setEdpassLayerVisibility(e){return this.currentParams=e,e.deviceType==="camera"?this.cameraLayer.setVisible(e.visible):e.deviceType==="kk"&&this.kkLayer.setVisible(e.visible),await this.updateDevice(),this.ensureMapListeners(),{status:0,message:"Success"}}async updateDevice(){var i,s,r,c,d,h,t,o;const e=this.mapView.calculateExtent(this.map.getSize());if(this.cameraLayer.getVisible()){const n=await this.getFeatureInExtent({deviceType:"camera",visible:!0,ddCode:((i=this.currentParams)==null?void 0:i.ddCode)||"",zdCode:((s=this.currentParams)==null?void 0:s.zdCode)||"",deviceState:"abnormal"},e);n.push(...await this.getFeatureInExtent({deviceType:"camera",visible:!0,ddCode:((r=this.currentParams)==null?void 0:r.ddCode)||"",zdCode:((c=this.currentParams)==null?void 0:c.zdCode)||"",deviceState:"normal"},e)),this.cameraLoaded=!0,this.cameraLayer.getSource().clear(),this.cameraLayer.getSource().addFeatures(n)}if(this.kkLayer.getVisible()){const n=await this.getFeatureInExtent({deviceType:"kk",visible:!0,ddCode:((d=this.currentParams)==null?void 0:d.ddCode)||"",zdCode:((h=this.currentParams)==null?void 0:h.zdCode)||"",deviceState:"abnormal"},e);n.push(...await this.getFeatureInExtent({deviceType:"kk",visible:!0,ddCode:((t=this.currentParams)==null?void 0:t.ddCode)||"",zdCode:((o=this.currentParams)==null?void 0:o.zdCode)||"",deviceState:"normal"},e)),this.kkLoaded=!0,this.kkLayer.getSource().clear(),this.kkLayer.getSource().addFeatures(n)}}async getFeatureInExtent(e,i){try{const r=await(await fetch(`${this.esServer}/queryGeoAggregation`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({deviceType:e.deviceType,devStateSet:[e.deviceState==="normal"?"1":"2"],topLeftLat:i[3],topLeftLon:i[0],bottomRightLat:i[1],bottomRightLon:i[2],zdCode:e.zdCode||"",ddCode:e.ddCode||"",mapLevel:this.mapView.getZoom()})})).json(),c=(r==null?void 0:r.data)||[];return this.makeDeviceFeatures(c,e.deviceType,e.deviceState||"normal")}catch(s){return console.error("queryGeoAggregation 请求异常:",s),[]}}makeDeviceFeatures(e,i,s){console.time("render batch"),i==="camera"?this.cameraLayer.getSource():this.kkLayer.getSource();const r=e.map(t=>t.count),c=Math.min(...r),d=Math.max(...r),h=e.map(t=>{var y;const o=new b({geometry:new S.Point([Number(t.lon),Number(t.lat)])});o.set("id",((y=t.devInfo)==null?void 0:y.deviceId)||t.key),o.set("type",i),o.set("count",t.count),t.devInfo&&Object.keys(t.devInfo).forEach(u=>{o.set(u,t.devInfo[u])});const n=s==="normal"?"#1CDE96":"#969696";if(t.count>1){const u=t.count.toString(),m=.3,g=1;let l;if(d===c)l=(m+g)/2;else{const f=(t.count-c)/(d-c);l=m+f*(g-m)}const C=-(16*l+10),L=[new v({image:new a.Circle({radius:16,fill:new a.Fill({color:n}),stroke:new a.Stroke({color:"white",width:2}),scale:l})}),new v({text:new a.Text({text:u,font:"bold 12px Microsoft YaHei",fill:new a.Fill({color:"white"}),backgroundFill:new a.Fill({color:n}),backgroundStroke:new a.Stroke({color:"white",width:1}),padding:[2,4,2,4],offsetY:C})})];o.setStyle(L)}else o.setStyle(new v({image:new a.Circle({radius:4,fill:new a.Fill({color:n}),stroke:new a.Stroke({color:"white",width:1})})}));return o.setProperties(t),o});return console.timeEnd("render batch"),h}hasAnyVisible(){return this.cameraLayer.getVisible()||this.kkLayer.getVisible()}ensureMapListeners(){if(!this.hasAnyVisible()){this.removeMapListeners();return}this.resolutionChangeKey||(this.resolutionChangeKey=this.mapView.on("change:resolution",()=>{this.scheduleViewChange(()=>this.onResolutionChange())})),this.moveEndKey||(this.moveEndKey=this.map.on("moveend",()=>{this.scheduleViewChange(()=>this.onMoveEnd())}))}removeMapListeners(){this.viewChangeDebounceTimer&&(clearTimeout(this.viewChangeDebounceTimer),this.viewChangeDebounceTimer=null),this.resolutionChangeKey&&(this.mapView.un("change:resolution",this.onResolutionChange.bind(this)),this.resolutionChangeKey=null),this.moveEndKey&&(this.map.un("moveend",this.onMoveEnd.bind(this)),this.moveEndKey=null)}scheduleViewChange(e){this.viewChangeDebounceTimer&&clearTimeout(this.viewChangeDebounceTimer),this.viewChangeDebounceTimer=setTimeout(()=>{this.viewChangeDebounceTimer=null,e()},300)}async onResolutionChange(){const e=Math.floor(this.mapView.getZoom()||0);e!==this.lastZoomLevel&&(console.log(`Zoom level changed to ${e}, updating devices...`),this.lastZoomLevel=e,await this.updateDevice())}async onMoveEnd(){console.log("Map move ended, updating devices..."),await this.updateDevice()}destroy(){this.removeMapListeners(),this.map.removeLayer(this.cameraLayer),this.map.removeLayer(this.kkLayer)}}exports.default=E;