gisviewer-vue3-arcgis
Version:
在应用中引入私服的包， 项目根目录下 新建文件 .npmrc 在 .npmrc 中对包源进行配置：
2 lines (1 loc) • 8.83 kB
JavaScript
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("@arcgis/core/Graphic"),u=require("@arcgis/core/layers/GraphicsLayer"),g=require("vue"),y=require("../../../stores/index.js");class d{constructor(t){this.hasGpu=!1,this.appDataStore=y.default.useAppDataStore,this.logTable=[["uuid","ptcId","plateno","timestamp","localTimestamp","timestamp_str","speed","laneNo","objHeight","objLength","latitude","longitude","ptcType","vehicleType","vehicleColor","plateColor","sbdm","heading","fixAngle","roadLayer","status","step","receiveTimestamp"]],this.needInterpolate=!0,this.isPaused=!1,this.showVehiclePlate=!1,this.showGroundVehicle=!0,this.showElevatedVehicle=!0,this.simulateVehicleColor=!0,this.historyPositionMap=new Map,this.sourceVehicleColorMap=new Map,this.simulatedVehicleColorMap=new Map,this.vehicleObjectMap=new Map,this.view=t,this.mapConfig=g.toRaw(this.appDataStore.mapConfig),this.vehicleLayer=new u({id:"vehicleLayer"}),this.view.map.add(this.vehicleLayer);const e=localStorage.getItem("gpu");this.hasGpu=e!=="Unknown",this.hasGpu&&(this.rafSignal=requestAnimationFrame(()=>this.render()))}getLog(){return this.logTable}async init(){}addVehicles(t){return new Promise(e=>{if(this.isPaused){e();return}const i=t.map(s=>{const r=this.getRenderVehicleTrack(s),{vehicleId:a,heading:l,localTimestamp:n}=r,c=Number(s.x),h=Number(s.y),o=new m({geometry:{type:"point",x:c,y:h},attributes:{...r,type:"trackVehicle"},symbol:this.hasGpu?this.createCIMSymbol(r):this.createMarkerSymbol()});return this.hasGpu&&(o.visible=!1,this.historyPositionMap.set(a,[{pos:[c,h,0],heading:l,time:n}]),this.vehicleObjectMap.set(a,{graphic:o,data:r,waitForDelete:!1,isMoving:!1})),o});this.vehicleLayer.addMany(i),e()})}updateVehicles(t){return new Promise(e=>{if(this.isPaused){e();return}const i=[];t.forEach(s=>{const r=this.getRenderVehicleTrack(s),{vehicleId:a,heading:l,localTimestamp:n}=r,c=Number(s.x),h=Number(s.y);if(this.hasGpu){const o=this.vehicleObjectMap.get(a);o?(o.data=r,o.graphic.attributes={...r,type:"trackVehicle"},this.historyPositionMap.get(a).push({pos:[c,h,0],heading:l,time:n})):i.push(s)}else{const o=this.vehicleLayer.graphics.find(p=>p.getAttribute("vehicleId")==r.vehicleId);o?o.geometry={type:"point",x:c,y:h}:i.push(s)}}),this.addVehicles(i),e()})}deleteVehicles(t){this.isPaused||(this.hasGpu?t.forEach(e=>{const i=this.vehicleObjectMap.get(e);i&&(i.waitForDelete=!0)}):t.forEach(e=>{const i=this.vehicleLayer.graphics.find(s=>s.getAttribute("vehicleId")==e);i&&this.vehicleLayer.remove(i)}))}clearVehicles(){this.vehicleLayer.removeAll(),this.vehicleObjectMap.clear(),this.historyPositionMap.clear(),this.sourceVehicleColorMap.clear(),this.simulatedVehicleColorMap.clear()}toggleGroundVehicle(t){this.showGroundVehicle=t}toggleElevatedVehicle(t){this.showElevatedVehicle=t}toggleTrafficInfo(t){t.name==="vehiclePlate"&&(this.showVehiclePlate=t.visible)}togglePause(t){this.isPaused=t,this.isPaused&&this.rafSignal?cancelAnimationFrame(this.rafSignal):this.rafSignal=requestAnimationFrame(()=>this.render())}updatePanelContent(t){console.log(t)}setInterpolate(t){this.needInterpolate=t}render(){this.isPaused||this.vehicleObjectMap.forEach((t,e)=>{this.updatePosition(e)}),this.rafSignal=requestAnimationFrame(()=>this.render())}updatePosition(t){const e=this.historyPositionMap.get(t),i=this.vehicleObjectMap.get(t);if(!e||!i||!i.isMoving&&e.length<=2)return;i.isMoving=!0,(i.graphic.getAttribute("roadLayer")||"1")==="1"?i.graphic.visible=this.showGroundVehicle:i.graphic.visible=this.showElevatedVehicle,i.segmentStartTime||(i.segmentStartTime=Date.now(),i.segmentTotalTime=e[1].time-e[0].time);const r=Date.now()-i.segmentStartTime,a=Math.min(1,r/i.segmentTotalTime);if(a===1)if(e.shift(),e.length===1){i.waitForDelete?(this.vehicleLayer.remove(i.graphic),this.vehicleObjectMap.delete(t),this.historyPositionMap.delete(t)):(i.segmentStartTime=void 0,i.segmentTotalTime=void 0,i.graphic.visible=!1,i.isMoving=!1);return}else{i.segmentStartTime=Date.now();const l=r-i.segmentTotalTime;i.segmentTotalTime=e[1].time-e[0].time-l,Math.abs(e[1].heading-e[0].heading)>180&&(e[1].heading>e[0].heading?e[0].heading+=360:e[1].heading+=360),i.graphic.geometry={type:"point",x:e[0].pos[0],y:e[0].pos[1]}}else{const l=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*a,n=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*a,c=e[0].heading+(e[1].heading-e[0].heading)*a;i.graphic.geometry={type:"point",x:l,y:n},i.data.heading=c,i.graphic.symbol=this.hasGpu?this.createCIMSymbol(i.data):this.createMarkerSymbol()}}createCIMSymbol(t){const e=this.getPlateFontColor(t.plateColor);return{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:"$feature.showName",returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",enable:this.showVehiclePlate,size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-8,ymin:-8,xmax:8,ymax:8},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:4,horizontalAlignment:"Center",offsetX:0,offsetY:8,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:e.backgroundColor}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:e.fillColor}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},this.createVehicleMarkerLayer(t)]}}}}getRenderVehicleTrack(t){if(this.sourceVehicleColorMap.set(t.vehicleId,t.vehicleColor),!this.simulateVehicleColor||!this.vehicleObjectMap.has(t.vehicleId))return t;this.simulatedVehicleColorMap.has(t.vehicleId)||this.simulatedVehicleColorMap.set(t.vehicleId,this.getRandomSimulatedVehicleColor());const i=this.simulatedVehicleColorMap.get(t.vehicleId);return i===void 0?t:{...t,vehicleColor:i}}createVehicleMarkerLayer(t){if(this.view.scale>=1e3){const i=this.getVehiclePointColor(t.vehicleColor);return{type:"CIMVectorMarker",enable:!0,size:18,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-12,ymin:-12,xmax:12,ymax:12},markerGraphics:[{type:"CIMMarkerGraphic",geometry:{rings:[this.createCircleRing(10)]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[i[0],i[1],i[2],48]}]}},{type:"CIMMarkerGraphic",geometry:{rings:[this.createCircleRing(7)]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[i[0],i[1],i[2],112]}]}},{type:"CIMMarkerGraphic",geometry:{rings:[this.createCircleRing(4)]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:i},{type:"CIMSolidStroke",enable:!0,width:.8,color:[255,255,255,220]}]}}],scaleSymbolsProportionally:!0,respectFrame:!0}}const e=this.getCarPic(t.vehicleColor);return{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:e.size,rotation:(t.heading+90)%360,rotateClockwise:!0,textureFilter:"Picture",url:`${this.mapConfig.assetsRoot}Images/${e.pic}`}}createMarkerSymbol(){return{type:"simple-marker",color:"green",size:5,outline:{color:"white",width:1}}}getCarPic(t){let e="grey";switch(typeof t=="string"&&(t=t.toLowerCase()),t){case"a":case 1:e="white";break;case"b":case 2:e="grey";break;case"c":case 3:e="yellow";break;case"d":case 4:e="pink";break;case"e":case 5:e="red";break;case"f":case 10:e="purple";break;case"g":case 6:e="green";break;case"h":case 7:e="blue";break;case"i":case 8:e="brown";break;case"j":case 9:e="black";break}return{pic:"/car/"+e+".png",size:20}}getVehiclePointColor(t){switch(typeof t=="string"&&(t=t.toLowerCase()),t){case"a":case 1:return[255,255,255,255];case"b":case 2:return[169,169,169,255];case"c":case 3:return[255,215,0,255];case"d":case 4:return[255,105,180,255];case"e":case 5:return[255,69,58,255];case"f":case 10:return[138,43,226,255];case"g":case 6:return[34,197,94,255];case"h":case 7:return[59,130,246,255];case"i":case 8:return[150,111,51,255];case"j":case 9:return[31,41,55,255];default:return[169,169,169,255]}}createCircleRing(t,e=24){const i=[];for(let s=0;s<=e;s++){const r=Math.PI*2*s/e;i.push([Number((Math.cos(r)*t).toFixed(2)),Number((Math.sin(r)*t).toFixed(2))])}return i}getRandomSimulatedVehicleColor(){const t=Math.random();return t<.06?6:t<.46?7:3}getPlateFontColor(t){let e=[255,255,255,255],i=[169,169,169,255];switch(t){case 0:e=[0,0,0,255],i=[255,255,255,255];break;case 1:e=[0,0,0,255],i=[244,164,96,255];break;case 2:e=[255,255,255,255],i=[65,105,225,255];break;case 3:e=[255,255,255,255],i=[0,0,0,255];break;case 15:e=[244,164,96,255],i=[0,250,154,255];break;case 16:e=[0,0,0,255],i=[0,250,154,255];break}return{fillColor:e,backgroundColor:i}}}exports.default=d;