UNPKG

gisviewer-vue3-arcgis

Version:

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

2 lines (1 loc) 5.28 kB
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const S=require("ol/extent"),I=require("ol/Feature"),b=require("ol/geom"),D=require("ol/layer/Vector"),_=require("ol/source/Vector"),L=require("ol/style/Circle"),f=require("ol/style/Fill"),C=require("ol/style/Icon"),c=require("ol/style/Stroke"),l=require("ol/style/Style"),z=require("ol/style/Text"),x=require("vue"),N=require("../../../stores/index.js"),E=17,M="/GisViewerAssets/Images/cross/gis_xhj_blue.png",q="/GisViewerAssets/Images/cross/gis_xhj_gray.png",d="#1677ff";class O{constructor(t){this.initialized=!1,this.roadsectShapeMap=new Map,this.highlightedSubareaId=null,this.lineStyleCache=new Map,this.nodeDotStyleCache=new Map,this.nodeIconStyle=new l({image:new C({src:M,scale:.5,anchor:[.5,1]}),zIndex:1}),this.grayLineStyle=new l({stroke:new c({color:"rgba(180, 180, 180, 0.8)",width:3}),zIndex:0}),this.grayNodeDotStyle=new l({image:new L({radius:5,fill:new f({color:"rgba(180, 180, 180, 0.8)"}),stroke:new c({color:"#ffffff",width:2})}),zIndex:1}),this.grayNodeIconStyle=new l({image:new C({src:q,scale:.5,anchor:[.5,1]}),zIndex:1}),this.nodeLabelStyleCache=new Map,this.map=t;const e=N.default.useAppDataStore;x.toRaw(e.olMapInitializer).subscribeClick((i,o,a)=>this.mapClick(i,a),{triggerOnBlankClick:!0}),this.source=new _,this.signalSystemLayer=new D({source:this.source}),this.signalSystemLayer.set("id","signal-system-no-shape-layer"),this.map.addLayer(this.signalSystemLayer),this.configureLayerStyle()}getLineStyle(t){let e=this.lineStyleCache.get(t);return e||(e=new l({stroke:new c({color:t,width:3}),zIndex:0}),this.lineStyleCache.set(t,e)),e}getNodeDotStyle(t){let e=this.nodeDotStyleCache.get(t);return e||(e=new l({image:new L({radius:5,fill:new f({color:t}),stroke:new c({color:"#ffffff",width:2})}),zIndex:1}),this.nodeDotStyleCache.set(t,e)),e}configureLayerStyle(){const t=this.map.getView().getResolutionForZoom(E);this.signalSystemLayer.setStyle((e,s)=>{if(e.get("type")!=="signal-system-no-shape-node")return;const i=this.highlightedSubareaId!==null&&e.get("subareaId")!==this.highlightedSubareaId,o=e.get("color")||d;return s<=t?[i?this.grayNodeIconStyle:this.nodeIconStyle,this.getNodeLabelStyle(e.get("nodeName"),i)]:i?this.grayNodeDotStyle:this.getNodeDotStyle(o)})}getNodeLabelStyle(t,e){const s=`${e}_${t}`,i=this.nodeLabelStyleCache.get(s);if(i)return i;const o=new l({text:new z({text:t||"",font:'12px "Microsoft YaHei"',textAlign:"center",textBaseline:"bottom",offsetY:-25,fill:new f({color:e?"#8c8c8c":"#1f2937"}),stroke:new c({color:"#ffffff",width:3})}),zIndex:2});return this.nodeLabelStyleCache.set(s,o),o}mapClick(t,e){if(t==="map-blank"){this.resetHighlight();return}if(t!=="signal-system-no-shape-road"&&t!=="signal-system-no-shape-node")return;const s=e==null?void 0:e.subareaId;s&&(this.highlightSubarea(s),this.focusSubarea(s))}highlightSubarea(t){this.highlightedSubareaId=t,this.source.getFeatures().forEach(e=>{e.get("type")==="signal-system-no-shape-road"&&e.setStyle(e.get("subareaId")===t?this.getLineStyle(e.get("color")||d):this.grayLineStyle)}),this.signalSystemLayer.changed()}resetHighlight(){this.highlightedSubareaId=null,this.source.getFeatures().forEach(t=>{t.get("type")==="signal-system-no-shape-road"&&t.setStyle(this.getLineStyle(t.get("color")||d))}),this.signalSystemLayer.changed()}focusSubarea(t){const e=S.createEmpty();this.source.getFeatures().forEach(s=>{if(s.get("subareaId")!==t)return;const i=s.getGeometry();i&&S.extend(e,i.getExtent())}),!S.isEmpty(e)&&this.map.getView().fit(e,{padding:[0,0,0,0],duration:350})}async initialize(){var a;const t=N.default.useAppDataStore,s=(a=x.toRaw(t.mapConfig).signalSystem)==null?void 0:a.roadsectLayer;if(!s){console.log("No roadsect layer URL found in mapConfig.roadsectIndex. Initialization aborted.");return}(await(await fetch(s)).json()).features.forEach(r=>{const y=r.properties.id,n=r.geometry.coordinates;this.roadsectShapeMap.set(y,n)})}async showSubSignalSystemNoShape(t){var o;this.initialized||(await this.initialize(),this.initialized=!0),this.source.clear(),this.highlightedSubareaId=null;const e=new Set,s=[],i=[];t.subAreas.forEach(a=>{const r=a.nodeVOList,y=a.color||d;for(let n=0;n<r.length-1;n+=1)for(let h=n+1;h<r.length;h+=1){const p=r[n].nodeId,m=r[h].nodeId;[`${p}_${m}`,`${m}_${p}`].forEach(g=>{const u=this.roadsectShapeMap.get(g);if(!u||u.length<2||e.has(g))return;e.add(g);const w=new I({geometry:new b.LineString(u),subareaId:a.subareaId,roadsectId:g,type:"signal-system-no-shape-road",color:a.color});w.setStyle(this.getLineStyle(y)),s.push(w)})}r.forEach(n=>{const h=new I({...n,geometry:new b.Point([n.longitude,n.latitude]),subareaId:a.subareaId,type:"signal-system-no-shape-node",color:a.color});i.push(h)})}),this.source.addFeatures(s),this.source.addFeatures(i),(o=t.options)!=null&&o.needZoom&&this.source.getFeatures().length>0&&this.map.getView().fit(this.source.getExtent(),{padding:[10,10,10,10]})}clearSignalSystemNoShape(){this.source.clear(),this.highlightedSubareaId=null,this.nodeLabelStyleCache.clear(),this.lineStyleCache.clear(),this.nodeDotStyleCache.clear(),this.signalSystemLayer.changed()}highlightSubSignalSystemNoShape(t){this.highlightSubarea(t),this.focusSubarea(t)}}exports.default=O;