gisviewer-vue3-arcgis/lib/src/gis-map-ol/utils/signal-control/signal-system-controller.js

在应用中引入私服的包， 项目根目录下 新建文件 .npmrc 在 .npmrc 中对包源进行配置：

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("ol/Feature"),c=require("ol/geom"),S=require("ol/layer/Vector"),y=require("ol/source/Vector"),l=require("ol/style"),b=require("vue"),p=require("../../../stores/index.js"),m=require("../style/line-style.js"),C=require("../style/point-style.js"),d=13,f=17;class w{constructor(e){this.subSystemDataMap=new Map,this.zoomChangeListener=null,this.grayLineStyle=new l.Style({stroke:new l.Stroke({color:"rgba(200, 200, 200, 0.8)",width:2})}),this.grayPointStyle=new l.Style({image:new l.Circle({radius:4,fill:new l.Fill({color:"rgba(200, 200, 200, 0.8)"}),stroke:new l.Stroke({color:"rgba(150, 150, 150, 0.8)",width:1.5})})}),this.highlightState=null;const i=p.default.useAppDataStore;b.toRaw(i.olMapInitializer).subscribeClick((s,r,n,o)=>{this.mapClick(s,n)},{triggerOnBlankClick:!0}),this.map=e,this.source=new y,this.signalSystemLayer=new S({source:this.source}),this.signalSystemLayer.set("id","signal-system-layer"),this.map.addLayer(this.signalSystemLayer),this.setupZoomListener()}mapClick(e,i){if(e==="map-blank"){this.resetHighlight();return}if(e!=="sub-district-road"&&e!=="sub-district-node")return;const{areaCode:t,subCode:s}=i;this.focusSubSystem(t,s),this.highlight({areaCode:t,subAreaCode:s,nonHighlightMode:"gray"})}setupZoomListener(){let e=null;this.zoomChangeListener=()=>{const i=this.map.getView().getZoom()??0;if(e===null){e=i;return}(this.hasCrossedThreshold(e,i,d+1)||this.hasCrossedThreshold(e,i,f))&&this.reRenderAllSubSystems(),e=i},this.map.getView().on("change:resolution",this.zoomChangeListener)}hasCrossedThreshold(e,i,t){const s=Math.floor(e),r=Math.floor(i);return s<t&&r>=t||s>=t&&r<t}reRenderAllSubSystems(){this.source.getFeatures().filter(i=>i.get("subCode")!==void 0).forEach(i=>{this.source.removeFeature(i)}),this.subSystemDataMap.forEach(({subSystem:i,areaCode:t})=>{this.renderSubSystem(i,t)})}calculateCentroid(e){if(e.length===0)return[0,0];const i=e.reduce((s,r)=>s+r.x,0),t=e.reduce((s,r)=>s+r.y,0);return[i/e.length,t/e.length]}findSubSystem(e,i){if(!i)return null;for(const{subSystem:t,areaCode:s}of this.subSystemDataMap.values())if(t.subAreaCode===i&&(!e||(s||"")===e))return t;return null}focusSubSystem(e,i){const t=this.findSubSystem(e,i);if(!t)return;const s=this.getSubSystemCrossExtent(t);if(s){this.map.getView().fit(s,{padding:[80,80,80,80],maxZoom:17,duration:350});return}const r=this.getSubSystemCenter(t);r&&this.map.getView().animate({center:r,zoom:17,duration:350})}getSubSystemCrossExtent(e){if(!e.children||e.children.length===0)return null;let i=1/0,t=1/0,s=-1/0,r=-1/0;return e.children.forEach(n=>{const o=Number(n.x||n.lon),a=Number(n.y||n.lat);Number.isNaN(o)||Number.isNaN(a)||(i=Math.min(i,o),t=Math.min(t,a),s=Math.max(s,o),r=Math.max(r,a))}),i===1/0||t===1/0||s===-1/0||r===-1/0?null:[i,t,s,r]}getSubSystemCenter(e){if(e.children&&e.children.length>0){const i=e.children.map(t=>{const s=Number(t.x||t.lon),r=Number(t.y||t.lat);return{x:s,y:r}}).filter(t=>!Number.isNaN(t.x)&&!Number.isNaN(t.y));if(i.length>0)return this.calculateCentroid(i)}if(e.subShape){let i;typeof e.subShape=="string"?i=JSON.parse(e.subShape):i=e.subShape;let t=1/0,s=1/0,r=-1/0,n=-1/0;if(i.forEach(o=>{o.forEach(a=>{const[h,g]=a;typeof h!="number"||typeof g!="number"||(t=Math.min(t,h),s=Math.min(s,g),r=Math.max(r,h),n=Math.max(n,g))})}),t!==1/0&&s!==1/0&&r!==-1/0&&n!==-1/0)return[(t+r)/2,(s+n)/2]}return null}showSignalSystem(e){e.areaList.forEach(t=>{this.showSystem(t)});const i=this.source.getExtent();return i&&i[0]!==1/0?new Promise(t=>{this.map.getView().fit(i,{padding:[50,50,50,50],callback:()=>{t({status:0,message:"success"})}})}):{status:1,message:"No features to display"}}removeSignalSystem(e){if(!e){this.source.clear(),this.subSystemDataMap.clear(),this.zoomChangeListener&&(this.map.getView().un("change:resolution",this.zoomChangeListener),this.zoomChangeListener=null);return}this.source.getFeatures().filter(t=>t.get("areaCode")===e).forEach(t=>{this.source.removeFeature(t)}),this.subSystemDataMap.forEach(({subSystem:t,areaCode:s})=>{s===s&&this.subSystemDataMap.delete(s+"-"+t.subAreaCode)})}showSystem(e){if(e.shape){let i;typeof e.shape=="string"?i=JSON.parse(e.shape):i=e.shape;const t=m.getLineStyle(e.lineSymbol,e),s=new u({geometry:new c.LineString(i),areaCode:e.areaCode,type:"signal-system-boundary"});s.setStyle(t),s.set("_originalStyle",t),this.source.addFeature(s)}e.children&&e.children.forEach(i=>{this.showSubSystem(i,e.areaCode)})}async showSubSignalSystem(e){e.areaList.forEach(t=>{this.showSubSystem(t)});const i=this.source.getExtent();return i&&i[0]!==1/0?new Promise(t=>{this.map.getView().fit(i,{padding:[50,50,50,50],callback:()=>{t({status:0,message:"success"})}})}):{status:1,message:"No features to display"}}removeSubSignalSystem(e){if(!e){this.source.clear();return}this.source.getFeatures().filter(t=>t.get("subCode")===e).forEach(t=>{this.source.removeFeature(t)})}highlight(e){if(e.areaCode)this.highlightState={areaCode:e.areaCode,subAreaCode:e.subAreaCode,nonHighlightMode:e.nonHighlightMode||"hide",needZoom:e.needZoom||!1};else return{status:-1,message:"No areaCode provided"};return this.reRenderAllSubSystems(),this.highlightState.needZoom&&this.focusSubSystem(e.areaCode,e.subAreaCode),{status:0,message:"ok"}}resetHighlight(){this.highlightState=null,this.source.getFeatures().forEach(e=>{const i=e.get("_originalStyle");e.setStyle(i)}),this.reRenderAllSubSystems()}showSubSystem(e,i){const t=i+"-"+e.subAreaCode;this.subSystemDataMap.set(t,{subSystem:e,areaCode:i}),this.renderSubSystem(e,i)}renderSubSystem(e,i){const t=Math.floor(this.map.getView().getZoom()??0);let s=!1;if(this.highlightState){const r=this.highlightState.areaCode===i,n=!this.highlightState.subAreaCode||e.subAreaCode===this.highlightState.subAreaCode;if(!(r&&n)){if(this.highlightState.nonHighlightMode==="hide")return;s=!0}}s&&t<=d||(t<=d?this.renderCentroidIcon(e,i):this.renderSubSystemDetail(e,i,s))}renderCentroidIcon(e,i){if(!e.children||e.children.length===0)return;e.children.forEach(n=>{n.x=Number(n.x||n.lon),n.y=Number(n.y||n.lat)});const t=this.calculateCentroid(e.children),s=new l.Style({image:new l.Icon({src:"/GisViewerAssets/Images/gis/ic_zixitong.png",scale:.5,anchor:[.5,1]})}),r=new u({subCode:e.subAreaCode,areaCode:i||"",isCentroid:!0,geometry:new c.Point(t),type:"signal-subsystem-centroid"});r.setStyle(s),r.set("_originalStyle",s),this.source.addFeature(r)}renderSubSystemDetail(e,i,t=!1){if(e.subShape){let s;typeof e.subShape=="string"?s=JSON.parse(e.subShape):s=e.subShape;const r=t?this.grayLineStyle:m.getLineStyle(e.roadSymbol),n=s.map(o=>{const a=new u({geometry:new c.LineString(o),subCode:e.subAreaCode,areaCode:i||"",type:"sub-district-road",selected:!t});return a.setStyle(r),a.set("_originalStyle",r),a});this.source.addFeatures(n)}if(e.children){const s=Math.floor(this.map.getView().getZoom()??0),r=e.children.map(n=>{const o=n.symbol||e.nodeSymbol,a=t?this.grayPointStyle:this.getNodeStyleByZoom(o,n,s),h=new u({...n,subCode:e.subAreaCode,areaCode:i||"",geometry:new c.Point([n.x,n.y]),type:"sub-district-node",selected:!t});return h.setStyle(a),h.set("_originalStyle",a),h});this.source.addFeatures(r)}}getNodeStyleByZoom(e,i,t){return t>=f?C.getPointStyle(e,i):new l.Style({image:new l.Circle({radius:4,fill:new l.Fill({color:"#2563eb"}),stroke:new l.Stroke({color:"#ffffff",width:1.5})})})}}exports.default=w;