gisviewer-vue3-arcgis/lib/src/gis-map/utils/traffic-flow.js

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

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("@arcgis/core/Graphic"),u=require("@arcgis/core/geometry"),y=require("@arcgis/core/layers/GraphicsLayer"),p=require("../../stores/index.js"),m=require("./common-utils.js");class g{constructor(i){this.maxMissCount=2,this.objectMissCount=new Map,this.showVehiclePlate=!0,this.showGroundVehicle=!0,this.showElevatedVehicle=!0,this.showLog=!1,this.focusVehNo="",this.view=i;const t=p.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(t.mapConfig)),this.objectsLayer=new y,this.view.map.add(this.objectsLayer)}connectTrafficFlow(i,t){var e;this.showVehiclePlate=(t==null?void 0:t.showVehiclePlate)!==!1,this.showLog=(t==null?void 0:t.showTraceLog)===!0,(e=this.webSocket)==null||e.close(),this.webSocket=new WebSocket(i),this.webSocket.onopen=()=>{console.log("websocket连接成功"),this.objectMissCount.clear()},this.webSocket.onclose=()=>{console.log("websocket连接关闭")},this.webSocket.onmessage=o=>{this.handleTrafficFlowData(o.data)}}disconnectTrafficFlow(){var i;(i=this.webSocket)==null||i.close(),this.objectsLayer.removeAll(),this.objectMissCount.clear()}toggleTrafficInfo(i){switch(i.name.toLowerCase()){case"vehiclePlate".toLowerCase():this.showVehiclePlate=i.visible;break}}toggleTrafficObject(i){switch(i.name.toLowerCase()){case"groundVehicle".toLowerCase():this.showGroundVehicle=i.visible;break;case"elevatedVehicle".toLowerCase():this.showElevatedVehicle=i.visible;break}}handleTrafficFlowData(i){const t=m.default.unzip(i);if(!t)return;const e=[],o=[],n=[],c=JSON.parse(t);this.showLog&&console.log(c);const s=c.data||c.rtPositionList;if(!s||s.length===0)return;const b=new Date(c.jgsj).getTime();for(const a of s){const r=this.buildVehicleTrackData(a,b);r&&(this.objectMissCount.has(r.ptcId)?e.push(r):o.push(r),this.objectMissCount.set(r.ptcId,0))}for(const a of this.objectMissCount){const r=a[0];let l=a[1];s.findIndex(d=>d.vehno===r)<0&&(l++,this.objectMissCount.set(r,l),l===this.maxMissCount&&n.push(r))}for(const a of n)this.objectMissCount.delete(a);this.addTrafficObjects(o),this.updateTrafficObjects(e),this.deleteTrafficObjects(n)}addTrafficObjects(i){const t=i.map(e=>new f({geometry:new u.Point({longitude:e.x,latitude:e.y}),symbol:this.createCIMSymbol(e),attributes:e,visible:this.getVehicleVisibility(e)}));this.objectsLayer.addMany(t)}getVehicleVisibility(i){return i.roadLayer==="1"?this.showGroundVehicle:i.roadLayer==="2"||i.roadLayer==="3"?this.showElevatedVehicle:!0}updateTrafficObjects(i){i.forEach(t=>{const e=this.objectsLayer.graphics.find(o=>o.getAttribute("ptcId")===t.ptcId);e&&(e.geometry=new u.Point({longitude:t.x,latitude:t.y}),e.symbol=this.createCIMSymbol(t),e.visible=this.getVehicleVisibility(t))})}createCIMSymbol(i){const t=this.getPlateFontColor(i.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:t.backgroundColor}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:t.fillColor}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:15,rotation:i.heading,rotateClockwise:!0,textureFilter:"Picture",url:`${this.mapConfig.assetsRoot}Images/car/${this.getCarPic(i.vehicleColor).pic}`}]}}}}deleteTrafficObjects(i){i.forEach(t=>{const e=this.objectsLayer.graphics.find(o=>o.getAttribute("ptcId")===t);e&&this.objectsLayer.remove(e)})}buildVehicleTrackData(i,t){const{hpys:e,csys:o,lng:n,angle:c,hphm:s,lat:b,cx:a,roadLayer:r}=i,l=i.vehno||i.vehNo;if(!l)return;let h;if(s&&s!=="0"&&s!==0?h=s.includes("-")?s.split("-")[1]:s:h=l.includes("-")?l.split("-")[1]:l,!["1","2","3","4","5","6",1,2,3,4,5,6].includes(a)){console.log("车辆类型错误",a);return}return{vehicleId:l,ptcId:l,timestamp:t,localTimestamp:t,x:n,y:b,ptcType:Number(a),heading:c,vehicleColor:o||"z",plateColor:s?e:"99",showName:h,vehicleType:99,roadLayer:r||"1"}}getCarPic(i){let t=0;if(this.view.type==="3d"?t=this.view.zoom:t=this.view.zoom,t<=17)return{pic:"point.png",color:[128,128,128,255]};{let e="grey",o=[128,128,128,255];switch(i.toLowerCase()){case"a":e="white",o=[200,200,200,255];break;case"b":e="grey",o=[128,128,128,255];break;case"c":e="yellow",o=[255,215,0,255];break;case"d":e="pink",o=[255,182,193,255];break;case"e":e="red",o=[255,0,0,255];break;case"f":e="purple",o=[128,0,128,255];break;case"g":e="green",o=[124,252,0,255];break;case"h":e="blue",o=[0,191,255,255];break;case"i":e="brown",o=[244,164,96,255];break;case"j":e="black",o=[0,0,0,255];break}return{pic:e+".png",color:o}}}getPlateFontColor(i){let t=[255,255,255,255],e=[169,169,169,255];switch(i){case 0:t=[0,0,0,255],e=[255,255,255,255];break;case 1:t=[0,0,0,255],e=[244,164,96,255];break;case 2:t=[255,255,255,255],e=[65,105,225,255];break;case 3:t=[255,255,255,255],e=[0,0,0,255];break;case 15:t=[244,164,96,255],e=[0,250,154,255];break;case 16:t=[0,0,0,255],e=[0,250,154,255];break}return{fillColor:t,backgroundColor:e}}}exports.default=g;