gisviewer-vue3-arcgis 1.0.101 → 1.0.103

package/lib/src/gis-map/utils/holo-flow/trace-holo-flow.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("@arcgis/core/views/3d/externalRenderers"),m=require("../../stores/index.js"),T=require("./trace-external-renderer.js"),b=require("./trace-layer-renderer.js");function R(i){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const t in i)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(i,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>i[t]})}}return e.default=i,Object.freeze(e)}const V=R(g);class y{constructor(e){this.lastDataTime=0,this.view=e;const t=m.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(t.mapConfig)),e.type==="3d"?(this.traceRenderer=new T.default(e),V.add(e,this.traceRenderer)):this.traceRenderer=new b.default(e)}handleVehicleTraceData(e){const t=new Date().getTime();if(t-this.lastDataTime<100)return;this.lastDataTime=t;const{newVehList:a,updateVehList:l,deleteVehList:o,jgsj:d}=e,h=e.crossId||"",u=[],c=[];if(a&&a.length>0){for(const n of a){n.localTimestamp||(n.localTimestamp=d||t);const r=this.buildVehicleTrackData(n,h);r&&u.push(r)}this.traceRenderer.addVehicles(u)}if(l&&l.length>0){for(const n of l){const r=this.buildVehicleTrackData(n,h);r&&c.push(r)}this.traceRenderer.updateVehicles(c)}if(o&&o.length>0){const n=o.map(r=>h+"-"+(r.ptcId||r.vehno||r.vehNo));this.traceRenderer.deleteVehicles(n)}}toggleTrafficInfo(e){this.traceRenderer.toggleTrafficInfo(e)}clearTrace(){this.traceRenderer.clearVehicles()}updatePanelContent(e){this.traceRenderer.updatePanelContent(e)}toggleGroundVehicle(e){this.traceRenderer.toggleGroundVehicle(e)}toggleElevatedVehicle(e){this.traceRenderer.toggleElevatedVehicle(e)}buildVehicleTrackData(e,t){const s=e.longitude,a=e.latitude,l=e.ptcId,o=Number(e.ptcType),d=e.heading,h=Number(e.vehicleType),u=Number(e.vehicleColor),c=e.plateNo||e.plateno,n=Number(e.plateColor),r=e.timestamp,p=e.localTimestamp,f=String(e.roadLayer)||"1";if(!(o<0||o>8))return{ptcId:l,crossId:t,x:s,y:a,ptcType:o,vehicleType:h,heading:o===2?-d:d,vehicleColor:u,showName:c&&c!==""&&c!=="0"&&c!=="000000"?c:"",plateNo:c,plateColor:n,timestamp:r,localTimestamp:p,roadLayer:f}}}exports.default=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("@arcgis/core/views/3d/externalRenderers"),m=require("../../stores/index.js"),T=require("./trace-renderer-external.js"),b=require("./trace-renderer-layer.js");function R(o){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const r in o)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(o,r);Object.defineProperty(e,r,n.get?n:{enumerable:!0,get:()=>o[r]})}}return e.default=o,Object.freeze(e)}const V=R(g);class y{constructor(e){this.lastDataTime=0,this.view=e;const r=m.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(r.mapConfig)),e.type==="3d"?(this.traceRenderer=new T.default(e),V.add(e,this.traceRenderer)):this.traceRenderer=new b.default(e)}handleVehicleTraceData(e){const r=new Date().getTime(),{newVehList:n,updateVehList:a,deleteVehList:i,jgsj:s}=e,l=e.crossId||"",d=[],h=[];if(n&&n.length>0){for(const t of n){t.localTimestamp||(t.localTimestamp=s||r);const c=this.buildVehicleTrackData(t,l);c&&d.push(c)}this.traceRenderer.addVehicles(d)}if(a&&a.length>0){for(const t of a){const c=this.buildVehicleTrackData(t,l);c&&h.push(c)}this.traceRenderer.updateVehicles(h)}if(i&&i.length>0){const t=i.map(c=>l+"-"+(c.ptcId||c.vehno||c.vehNo));this.traceRenderer.deleteVehicles(t)}}toggleTrafficInfo(e){this.traceRenderer.toggleTrafficInfo(e)}clearTrace(){this.traceRenderer.clearVehicles()}updatePanelContent(e){this.traceRenderer.updatePanelContent(e)}toggleGroundVehicle(e){this.traceRenderer.toggleGroundVehicle(e)}toggleElevatedVehicle(e){this.traceRenderer.toggleElevatedVehicle(e)}setInterpolate(e){this.traceRenderer.setInterpolate(e)}buildVehicleTrackData(e,r){const n=e.longitude,a=e.latitude,i=e.ptcId,s=Number(e.ptcType),l=e.heading,d=Number(e.vehicleType),h=Number(e.vehicleColor),t=e.plateNo||e.plateno,c=Number(e.plateColor),u=e.timestamp,p=e.localTimestamp,f=String(e.roadLayer)||"1";if(!(s<0||s>8))return{ptcId:i,crossId:r,vehicleId:r+"-"+i,x:n,y:a,ptcType:s,vehicleType:d,heading:s===2?-l:l,vehicleColor:h,showName:t&&t!==""&&t!=="0"&&t!=="000000"?t:"",plateNo:t,plateColor:c,timestamp:u,localTimestamp:p,roadLayer:f}}}exports.default=y;

package/lib/src/gis-map/utils/holo-flow/{trace-external-renderer.d.ts → trace-renderer-external.d.ts}

@@ -1,5 +1,5 @@
 import { EVehiclePlateState, IToggleTrafficInfoParams, ITraceRendererInterface, IVehicleTrack } from '../../../types';
-export default class TraceExternalRenderer implements ITraceRendererInterface {
+export default class TraceRendererExternal implements ITraceRendererInterface {
     private renderer;
     private scene;
     private camera;
@@ -24,22 +24,30 @@ export default class TraceExternalRenderer implements ITraceRendererInterface {
     private currentSpriteContent;
     private historyPositionMap;
     private vehicleObjectMap;
+    private needInterpolate;
+    private mesh;
+    private sprite;
     constructor(view: __esri.SceneView);
+    setInterpolate(needInterpolate: boolean): void;
+    private context;
     setup(context: any): Promise<void>;
+    private geometryTest;
     render(context: any): Promise<void>;
     /**
      * 新增车辆
      * */
-    addVehicles(objects: IVehicleTrack[]): void;
+    addVehicles(objects: IVehicleTrack[]): Promise<void>;
     /**
      * 更新车辆
      * */
-    updateVehicles(objects: IVehicleTrack[]): void;
+    updateVehicles(objects: IVehicleTrack[]): Promise<void>;
+    private toRenderCoordinates;
     /**
      * 删除车辆
      * */
     deleteVehicles(idList: string[]): void;
-    toggleTrafficInfo(params: IToggleTrafficInfoParams): void;
+    private deleteVehicle;
+    toggleTrafficInfo(params: IToggleTrafficInfoParams): Promise<void>;
     /**
      * 清除全部车辆
      * */
@@ -49,7 +57,7 @@ export default class TraceExternalRenderer implements ITraceRendererInterface {
      * @param contentType
      * @returns
      */
-    updatePanelContent(contentType: EVehiclePlateState): void;
+    updatePanelContent(contentType: EVehiclePlateState): Promise<void>;
     toggleGroundVehicle(visible: boolean): void;
     toggleElevatedVehicle(visible: boolean): void;
     /**

package/lib/src/gis-map/utils/holo-flow/trace-renderer-external.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const S=require("@arcgis/core/geometry/SpatialReference"),P=require("@arcgis/core/views/3d/externalRenderers"),T=require("three"),g=require("three/examples/jsm/loaders/GLTFLoader.js"),p=require("../../../types/index.js"),C=require("../../stores/index.js");function y(f){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(f){for(const e in f)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(f,e);Object.defineProperty(i,e,t.get?t:{enumerable:!0,get:()=>f[e]})}}return i.default=f,Object.freeze(i)}const b=y(P),o=y(T);class V{constructor(i){this.defaultMaterial=new o.MeshBasicMaterial({color:6908265}),this.materialMap=new Map([[1,new o.MeshBasicMaterial({color:16777215})],[2,new o.MeshBasicMaterial({color:7833753})],[3,new o.MeshBasicMaterial({color:16766720})],[4,new o.MeshBasicMaterial({color:16758465})],[5,new o.MeshBasicMaterial({color:14423100})],[6,new o.MeshBasicMaterial({color:3329330})],[7,new o.MeshBasicMaterial({color:2003183})],[8,new o.MeshBasicMaterial({color:16032864})],[9,new o.MeshBasicMaterial({color:2105376})],[10,new o.MeshBasicMaterial({color:9662683})],[99,new o.MeshBasicMaterial({color:6908265})]]),this.carModelReady=!1,this.vanModelReady=!1,this.truckModelReady=!1,this.busModelReady=!1,this.bicycleModelReady=!1,this.currentSpriteContent=p.EVehiclePlateState.None,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.needInterpolate=!0;const e=C.default.useAppDataStore;this.assetsRoot=JSON.parse(JSON.stringify(e.mapConfig)).assetsRoot,this.view=i;const t=new g.GLTFLoader;t.load(`${this.assetsRoot}/3DModels/car.glb`,s=>{this.carModel=s.scene,this.carModel.rotation.x=o.MathUtils.degToRad(90),this.carModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/van.glb`,s=>{this.vanModel=s.scene,this.vanModel.rotation.x=o.MathUtils.degToRad(90),this.vanModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/truck.glb`,s=>{this.truckModel=s.scene,this.truckModel.scale.set(1.2,1,1.5),this.truckModel.rotation.x=o.MathUtils.degToRad(90),this.truckModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/bus.glb`,s=>{this.busModel=s.scene,this.busModel.rotation.x=o.MathUtils.degToRad(90),this.busModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/bicycle.glb`,s=>{this.bicycleModel=s.scene,this.bicycleModel.rotation.x=o.MathUtils.degToRad(90),this.bicycleModel.rotation.y=o.MathUtils.degToRad(180),this.bicycleModelReady=!0}),document.addEventListener("visibilitychange",()=>{this.clearVehicles(),this.needInterpolate=!document.hidden},!1)}setInterpolate(i){this.clearVehicles(),this.needInterpolate=i}async setup(i){this.context=i,this.renderer=new o.WebGLRenderer({context:i.gl,premultipliedAlpha:!0,logarithmicDepthBuffer:!0,antialias:!0,powerPreference:"high-performance"}),this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setViewport(0,0,this.view.width,this.view.height),this.renderer.autoClearDepth=!1,this.renderer.autoClearStencil=!1,this.renderer.autoClearColor=!1;const e=this.renderer.setRenderTarget.bind(this.renderer);this.renderer.setRenderTarget=t=>{e(t),t==null&&i.bindRenderTarget()},this.scene=new o.Scene,this.camera=new o.PerspectiveCamera,this.ambient=new o.AmbientLight(16777215,.5),this.scene.add(this.ambient),this.sun=new o.DirectionalLight(16777215,.5),this.scene.add(this.sun),i.resetWebGLState()}geometryTest(){new g.GLTFLoader().load(`${this.assetsRoot}/3DModels/car.glb`,e=>{this.mesh=e.scene,this.mesh.rotation.x=o.MathUtils.degToRad(90);const t=[121.46892831020403,31.239681632841354,0],s=this.toRenderCoordinates(t);this.mesh.position.set(s[0],s[1],s[2]),this.scene.add(this.mesh),new o.TextureLoader().load(`${this.assetsRoot}/Images/PlateBG/grey.png`,r=>{const n=new o.SpriteMaterial({map:r,transparent:!1}),a=new o.Sprite(n);a.scale.set(5,2.5,1),a.position.set(0,5,-4),this.mesh.add(a),console.log(this.mesh.visible,a.visible)})})}async render(i){var s;const e=i.camera;if(this.camera.position.set(e.eye[0],e.eye[1],e.eye[2]),this.camera.up.set(e.up[0],e.up[1],e.up[2]),this.camera.lookAt(new o.Vector3(e.center[0],e.center[1],e.center[2])),this.camera.projectionMatrix.fromArray(e.projectionMatrix),this.needInterpolate)for(const l of this.vehicleObjectMap.keys()){const r=(s=this.vehicleObjectMap.get(l))==null?void 0:s.model;if(!r)continue;const n=this.computeVehiclePosition(l);if(n){const a=this.toRenderCoordinates(n);r.position.set(a[0],a[1],a[2]),r.rotation.y=o.MathUtils.degToRad(-n[3])}}const t=i.sunLight;this.sun.position.set(t.direction[0],t.direction[1],t.direction[2]),this.sun.intensity=t.diffuse.intensity,this.sun.color=new o.Color(t.diffuse.color[0],t.diffuse.color[1],t.diffuse.color[2]),this.ambient.intensity=t.ambient.intensity,this.ambient.color=new o.Color(t.ambient.color[0],t.ambient.color[1],t.ambient.color[2]),this.renderer.resetState(),i.bindRenderTarget(),this.renderer.render(this.scene,this.camera),b.requestRender(this.view),i.resetWebGLState()}async addVehicles(i){if(!(!this.carModelReady||!this.vanModelReady||!this.truckModelReady||!this.busModelReady||!this.bicycleModelReady))for(const e of i){const{vehicleId:t,localTimestamp:s}=e,l=Number(e.x),r=Number(e.y),n=Number(e.heading);this.historyPositionMap.set(t,[{pos:[l,r,0],heading:n,time:s}]);const a=this.getVehicleModel(e);a.name=t,a.visible=!this.needInterpolate;try{const c=await this.createPlateSprite(e);c&&(a.add(c),c.position.set(0,5,-4)),this.scene.add(a),this.vehicleObjectMap.set(t,{model:a,data:e,waitForDelete:!1,isMoving:!1})}catch(c){console.log("createPlateSprite error:",c)}}}async updateVehicles(i){if(!this.carModelReady||!this.vanModelReady||!this.truckModelReady||!this.busModelReady||!this.bicycleModelReady)return;const e=[];for(const t of i){const{vehicleId:s,localTimestamp:l}=t,r=Number(t.x),n=Number(t.y);let a=Number(t.heading);const c=this.vehicleObjectMap.get(s);if(!c)e.push(t);else{if(c.data.vehicleColor!==t.vehicleColor||c.data.vehicleType!==t.vehicleType){this.scene.remove(c.model),this.disposeModel(c.model),c.model=this.getVehicleModel(t);const h=await this.createPlateSprite(t);h&&(c.model.add(h),h.position.set(0,5,-4)),this.scene.add(c.model)}if(c.data.showName!==t.showName||c.data.plateColor!==t.plateColor){const h=c.model.getObjectByName("VehiclePlate");h&&(c.model.remove(h),this.disposeModel(h));const d=await this.createPlateSprite(t);d&&(c.model.add(d),d.position.set(0,5,-4))}if(c.data=t,this.needInterpolate){const h=this.historyPositionMap.get(s),d=h[h.length-1];Math.abs(a-d.heading)>=180&&(a>d.heading?d.heading+=360:a+=360),h.push({pos:[r,n,0],heading:a,time:l})}else{this.historyPositionMap.set(s,[{pos:[r,n,0],heading:a,time:l}]);const h=this.toRenderCoordinates([r,n,0]);c.model.position.set(h[0],h[1],h[2]),c.model.rotation.y=o.MathUtils.degToRad(-a)}}}this.addVehicles(e),this.needInterpolate||this.render(this.context)}toRenderCoordinates(i){const e=[0,0,0];return b.toRenderCoordinates(this.view,i,0,S.WGS84,e,0,1),e}deleteVehicles(i){i.forEach(e=>{const t=this.vehicleObjectMap.get(e);t&&(this.needInterpolate?t.isMoving?t.waitForDelete=!0:this.deleteVehicle(t):this.deleteVehicle(t))})}deleteVehicle(i){this.scene.remove(i.model),this.disposeModel(i.model);const e=i.data.vehicleId;this.vehicleObjectMap.delete(e),this.historyPositionMap.delete(e)}async toggleTrafficInfo(i){i.name==="vehiclePlate"&&(i.visible===!0&&this.currentSpriteContent===p.EVehiclePlateState.None?await this.updatePanelContent(p.EVehiclePlateState.Id):await this.updatePanelContent(i.visible?this.currentSpriteContent:p.EVehiclePlateState.None))}clearVehicles(){for(const i of this.vehicleObjectMap.keys()){const e=this.vehicleObjectMap.get(i);e&&(this.disposeModel(e.model),this.scene.remove(e.model))}this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}async updatePanelContent(i){if(i!==this.currentSpriteContent){this.currentSpriteContent=i;for(const e of this.vehicleObjectMap.keys()){const t=this.vehicleObjectMap.get(e);if(t){const s=t.model.getObjectByName("VehiclePlate");if(s&&(t.model.remove(s),this.disposeModel(s)),i!==p.EVehiclePlateState.None){const l=await this.createPlateSprite(t.data);l&&(t.model.add(l),l.position.set(0,5,-4))}}}}}toggleGroundVehicle(i){}toggleElevatedVehicle(i){}disposeModel(i){i.traverse(e=>{e instanceof o.Mesh&&(e.geometry.dispose(),e.material.dispose())})}computeVehiclePosition(i){const e=this.historyPositionMap.get(i),t=this.vehicleObjectMap.get(i);if(!t||!e||!t.isMoving&&e.length<=2)return;const s=Date.now();t.model.visible=!0,t.isMoving=!0,t.segmentStartTime||(t.segmentStartTime=s,t.segmentTotalTime=e[1].time-e[0].time);const l=s-t.segmentStartTime,r=Math.min(l/t.segmentTotalTime,1);if(r===1)if(e.shift(),e.length===1){t.waitForDelete===!0?this.deleteVehicle(t):(t.segmentStartTime=void 0,t.segmentTotalTime=void 0,t.model.visible=!1,t.isMoving=!1,console.log("pause vehicle",i));return}else return t.segmentStartTime=Date.now(),t.segmentTotalTime=e[1].time-e[0].time,(e[1].heading>=270&&e[0].heading<=90||e[1].heading<=90&&e[0].heading>=270)&&(e[1].heading>e[0].heading?e[0].heading+=360:e[1].heading+=360),e[0].pos.concat(e[0].heading);else{const n=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*r,a=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*r,c=e[0].heading+(e[1].heading-e[0].heading)*r;return[n,a,0,c]}}getVehicleModel(i){let e;if(i.ptcType===2)e=this.bicycleModel.clone();else{switch(i.vehicleType){case 10:e=this.carModel.clone();break;case 20:e=this.vanModel.clone();break;case 25:e=this.truckModel.clone();break;case 50:e=this.busModel.clone();break;default:e=this.carModel.clone();break}const t=this.materialMap.get(i.vehicleColor)||this.defaultMaterial;let s=!1;e.traverse(l=>{!s&&l instanceof o.Mesh&&(l.material=t,s=!0)})}return e}createCanvas(i,e,t){const s=document.createElement("canvas"),l=i.width,r=i.height;s.width=l,s.height=r;const n=s.getContext("2d");if(!n){console.log("canvas创建失败");return}return n.fillStyle="rgba(0,0,0,0.0)",n.fillRect(0,0,l,r),n.drawImage(i,0,0,l,r),n.beginPath(),n.translate(l/2,r/2),n.fillStyle=t,n.font="bold 32px 宋体",n.textBaseline="middle",n.textAlign="center",n.fillText(e,0,0),s}createPlateSprite(i){return new Promise((e,t)=>{var c,h;const s=!i.plateNo||i.plateNo==="0"||i.plateNo==="000000";if(this.currentSpriteContent===p.EVehiclePlateState.None||this.currentSpriteContent===p.EVehiclePlateState.PlateNumber&&s){e(void 0);return}const l=new Image;let r="",n="",a="";if(this.currentSpriteContent===p.EVehiclePlateState.PlateNumber||this.currentSpriteContent===p.EVehiclePlateState.Mix)if(s)r="grey",n=i.ptcId,a="#ffffff";else switch(n=((c=i.showName)==null?void 0:c.substring(0,2))+"•"+((h=i.showName)==null?void 0:h.substring(2)),i.plateColor){case 1:r="blue",a="#ffffff";break;case 2:r="yellow",a="#000000";break;case 3:r="white",a="#000000";break;case 4:r="black";break;case 5:r="neo_yellow",a="#000000";break;case 6:r="neo_green",a="#000000";break;default:r="grey",n=i.plateNo,a="#ffffff";break}else this.currentSpriteContent===p.EVehiclePlateState.Id&&(r="grey",n=i.ptcId,a="#ffffff");l.src=`${this.assetsRoot}/Images/PlateBG/${r}.png`,l.onload=()=>{const d=this.createCanvas(l,n,a);if(!d)t("canvas创建失败");else{const u=new o.CanvasTexture(d),v=new o.SpriteMaterial({map:u,transparent:!1}),M=new o.Sprite(v),m=.05,w=d.width*m,R=d.height*m;M.scale.set(w,R,1),M.name="VehiclePlate",e(M)}l.onerror=u=>{console.log(`号牌背景加载失败: ${l.src}`,u),t(u)}}})}}exports.default=V;

package/lib/src/gis-map/utils/holo-flow/{trace-layer-renderer.d.ts → trace-renderer-layer.d.ts}

@@ -1,9 +1,10 @@
 import { EVehiclePlateState, ITraceRendererInterface, IVehicleTrack } from '../../../types';
-export default class TraceLayerRenderer implements ITraceRendererInterface {
+export default class TraceRendererLayer implements ITraceRendererInterface {
     private view;
     private readonly vehicleLayer;
     private mapConfig;
     constructor(view: __esri.MapView);
+    private needInterpolate;
     private showVehiclePlate;
     private showGroundVehicle;
     private showElevatedVehicle;
@@ -13,7 +14,6 @@ export default class TraceLayerRenderer implements ITraceRendererInterface {
     updateVehicles(objects: IVehicleTrack[]): void;
     deleteVehicles(idList: string[]): void;
     clearVehicles(): void;
-    updatePanelContent(contentType: EVehiclePlateState): void;
     /**
      * 设置地面车辆显示隐藏
      * @param visible
@@ -28,6 +28,8 @@ export default class TraceLayerRenderer implements ITraceRendererInterface {
         name: string;
         visible: boolean;
     }): void;
+    updatePanelContent(contentType: EVehiclePlateState): void;
+    setInterpolate(needInterpolate: boolean): void;
     private render;
     private updatePosition;
     /**

package/lib/src/gis-map/utils/holo-flow/trace-renderer-layer.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@arcgis/core/Graphic"),h=require("@arcgis/core/layers/GraphicsLayer"),p=require("../../stores/index.js");class m{constructor(i){this.needInterpolate=!0,this.showVehiclePlate=!1,this.showGroundVehicle=!0,this.showElevatedVehicle=!0,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.view=i;const e=p.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(e.mapConfig)),this.vehicleLayer=new h({id:"vehicleLayer"}),this.view.map.add(this.vehicleLayer),requestAnimationFrame(()=>this.render())}addVehicles(i){const e=i.map(t=>{const{vehicleId:o,heading:n,localTimestamp:s}=t,r=Number(t.x),l=Number(t.y);this.historyPositionMap.set(o,[{pos:[r,l,0],heading:n,time:s}]);const a=new c({geometry:{type:"point",x:r,y:l},attributes:{...t},symbol:this.createCIMSymbol(t)});return a.visible=!1,this.vehicleObjectMap.set(o,{graphic:a,data:t,waitForDelete:!1,isMoving:!1}),a});this.vehicleLayer.addMany(e)}updateVehicles(i){const e=[];i.forEach(t=>{const{vehicleId:o,heading:n,localTimestamp:s}=t,r=Number(t.x),l=Number(t.y),a=this.vehicleObjectMap.get(o);a?(a.data=t,this.historyPositionMap.get(o).push({pos:[r,l,0],heading:n,time:s})):e.push(t)}),this.addVehicles(e)}deleteVehicles(i){i.forEach(e=>{const t=this.vehicleObjectMap.get(e);t&&(t.waitForDelete=!0)})}clearVehicles(){this.vehicleLayer.removeAll(),this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}toggleGroundVehicle(i){this.showGroundVehicle=i}toggleElevatedVehicle(i){this.showElevatedVehicle=i}toggleTrafficInfo(i){i.name==="vehiclePlate"&&(this.showVehiclePlate=i.visible)}updatePanelContent(i){console.log(i)}setInterpolate(i){this.needInterpolate=i}render(){this.vehicleObjectMap.forEach((i,e)=>{this.updatePosition(e)}),requestAnimationFrame(()=>this.render())}updatePosition(i){const e=this.historyPositionMap.get(i),t=this.vehicleObjectMap.get(i);if(!e||!t||!t.isMoving&&e.length<=2)return;t.isMoving=!0,(t.graphic.getAttribute("roadLayer")||"1")==="1"?t.graphic.visible=this.showGroundVehicle:t.graphic.visible=this.showElevatedVehicle,t.segmentStartTime||(t.segmentStartTime=Date.now(),t.segmentTotalTime=e[1].time-e[0].time);const n=Date.now()-t.segmentStartTime,s=Math.min(1,n/t.segmentTotalTime);if(s===1)if(e.shift(),e.length===1){t.waitForDelete?(this.vehicleLayer.remove(t.graphic),this.vehicleObjectMap.delete(i),this.historyPositionMap.delete(i)):(t.segmentStartTime=void 0,t.segmentTotalTime=void 0,t.graphic.visible=!1,t.isMoving=!1);return}else t.segmentStartTime=Date.now(),t.segmentTotalTime=e[1].time-e[0].time,(e[1].heading>=270&&e[0].heading<=90||e[1].heading<=90&&e[0].heading>=270)&&(e[1].heading>e[0].heading?e[0].heading+=360:e[1].heading+=360),t.graphic.geometry={type:"point",x:e[0].pos[0],y:e[0].pos[1]};else{const r=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*s,l=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*s,a=e[0].heading+(e[1].heading-e[0].heading)*s;t.graphic.geometry={type:"point",x:r,y:l},t.data.heading=a,t.graphic.symbol=this.createCIMSymbol(t.data)}}createCIMSymbol(i){const e=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:e.backgroundColor}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:e.fillColor}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:30,rotation:i.heading,rotateClockwise:!0,textureFilter:"Picture",url:`${this.mapConfig.assetsRoot}Images/car/${this.getCarPic(i.vehicleColor)}`}]}}}}getCarPic(i){if(this.view.zoom<=15)return"point.png";let e="grey";switch(typeof i=="string"&&(i=i.toLowerCase()),i){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 e+".png"}getPlateFontColor(i){let e=[255,255,255,255],t=[169,169,169,255];switch(i){case 0:e=[0,0,0,255],t=[255,255,255,255];break;case 1:e=[0,0,0,255],t=[244,164,96,255];break;case 2:e=[255,255,255,255],t=[65,105,225,255];break;case 3:e=[255,255,255,255],t=[0,0,0,255];break;case 15:e=[244,164,96,255],t=[0,250,154,255];break;case 16:e=[0,0,0,255],t=[0,250,154,255];break}return{fillColor:e,backgroundColor:t}}}exports.default=m;

package/lib/src/types/index.d.ts

@@ -22,6 +22,7 @@ export interface IVehicleTrack {
     localTimestamp: number;
     crossId?: string;
     ptcId: string;
+    vehicleId: string;
     x: number;
     y: number;
     ptcType: number;
@@ -147,6 +148,7 @@ export interface ITraceRendererInterface {
     toggleGroundVehicle(visible: boolean): void;
     toggleElevatedVehicle(visible: boolean): void;
     toggleTrafficInfo(params: IToggleTrafficInfoParams): void;
+    setInterpolate(enable: boolean): void;
 }
 export declare enum EVehiclePlateState {
     None = 0,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gisviewer-vue3-arcgis",
-  "version": "1.0.101",
+  "version": "1.0.103",
   "main": "lib/index.js",
   "module": "es/index.mjs",
   "files": [

package/es/src/gis-map/utils/holo-flow/trace-external-renderer.mjs

@@ -1,322 +0,0 @@
-import b from "@arcgis/core/geometry/SpatialReference";
-import * as u from "@arcgis/core/views/3d/externalRenderers";
-import * as o from "three";
-import { GLTFLoader as v } from "three/examples/jsm/loaders/GLTFLoader.js";
-import { EVehiclePlateState as M } from "../../../types/index.mjs";
-import w from "../../stores/index.mjs";
-class k {
-  constructor(i) {
-    this.defaultMaterial = new o.MeshBasicMaterial({
-      color: 6908265
-    }), this.materialMap = /* @__PURE__ */ new Map([
-      [1, new o.MeshBasicMaterial({ color: 16777215 })],
-      [2, new o.MeshBasicMaterial({ color: 7833753 })],
-      [3, new o.MeshBasicMaterial({ color: 16766720 })],
-      [4, new o.MeshBasicMaterial({ color: 16758465 })],
-      [5, new o.MeshBasicMaterial({ color: 14423100 })],
-      [6, new o.MeshBasicMaterial({ color: 3329330 })],
-      [7, new o.MeshBasicMaterial({ color: 2003183 })],
-      [8, new o.MeshBasicMaterial({ color: 16032864 })],
-      [9, new o.MeshBasicMaterial({ color: 2105376 })],
-      [10, new o.MeshBasicMaterial({ color: 9662683 })],
-      [99, new o.MeshBasicMaterial({ color: 6908265 })]
-    ]), this.carModelReady = !1, this.vanModelReady = !1, this.truckModelReady = !1, this.busModelReady = !1, this.bicycleModelReady = !1, this.currentSpriteContent = M.None, this.historyPositionMap = /* @__PURE__ */ new Map(), this.vehicleObjectMap = /* @__PURE__ */ new Map();
-    const e = w.useAppDataStore;
-    this.assetsRoot = JSON.parse(
-      JSON.stringify(e.mapConfig)
-    ).assetsRoot, this.view = i;
-    const t = new v();
-    t.load(`${this.assetsRoot}/3DModels/car.glb`, (s) => {
-      this.carModel = s.scene, this.carModel.rotation.x = o.MathUtils.degToRad(90), this.carModelReady = !0;
-    }), t.load(`${this.assetsRoot}/3DModels/van.glb`, (s) => {
-      this.vanModel = s.scene, this.vanModel.rotation.x = o.MathUtils.degToRad(90), this.vanModelReady = !0;
-    }), t.load(`${this.assetsRoot}/3DModels/truck.glb`, (s) => {
-      this.truckModel = s.scene, this.truckModel.scale.set(1.2, 1, 1.5), this.truckModel.rotation.x = o.MathUtils.degToRad(90), this.truckModelReady = !0;
-    }), t.load(`${this.assetsRoot}/3DModels/bus.glb`, (s) => {
-      this.busModel = s.scene, this.busModel.rotation.x = o.MathUtils.degToRad(90), this.busModelReady = !0;
-    }), t.load(`${this.assetsRoot}/3DModels/bicycle.glb`, (s) => {
-      this.bicycleModel = s.scene, this.bicycleModel.rotation.x = o.MathUtils.degToRad(90), this.bicycleModel.rotation.y = o.MathUtils.degToRad(180), this.bicycleModelReady = !0;
-    });
-  }
-  async setup(i) {
-    this.renderer = new o.WebGLRenderer({
-      context: i.gl,
-      premultipliedAlpha: !1,
-      antialias: !0
-    }), this.renderer.setPixelRatio(window.devicePixelRatio), this.renderer.setViewport(0, 0, this.view.width, this.view.height), this.renderer.autoClearDepth = !1, this.renderer.autoClearStencil = !1, this.renderer.autoClearColor = !1;
-    const e = this.renderer.setRenderTarget.bind(
-      this.renderer
-    );
-    this.renderer.setRenderTarget = (t) => {
-      e(t), t == null && i.bindRenderTarget();
-    }, this.scene = new o.Scene(), this.camera = new o.PerspectiveCamera(), this.ambient = new o.AmbientLight(16777215, 0.5), this.scene.add(this.ambient), this.sun = new o.DirectionalLight(16777215, 0.5), this.scene.add(this.sun), i.resetWebGLState();
-  }
-  async render(i) {
-    var s;
-    const e = i.camera;
-    this.camera.position.set(e.eye[0], e.eye[1], e.eye[2]), this.camera.up.set(e.up[0], e.up[1], e.up[2]), this.camera.lookAt(
-      new o.Vector3(e.center[0], e.center[1], e.center[2])
-    ), this.camera.projectionMatrix.fromArray(e.projectionMatrix);
-    for (const r of this.vehicleObjectMap.keys()) {
-      const l = (s = this.vehicleObjectMap.get(r)) == null ? void 0 : s.model;
-      if (!l)
-        continue;
-      const a = this.computeVehiclePosition(r);
-      if (a) {
-        const c = [0, 0, 0];
-        u.toRenderCoordinates(
-          this.view,
-          a,
-          0,
-          b.WGS84,
-          c,
-          0,
-          1
-        ), l.position.set(c[0], c[1], c[2]), l.rotation.y = o.MathUtils.degToRad(-a[3]);
-      }
-    }
-    const t = i.sunLight;
-    this.sun.position.set(t.direction[0], t.direction[1], t.direction[2]), this.sun.intensity = t.diffuse.intensity, this.sun.color = new o.Color(
-      t.diffuse.color[0],
-      t.diffuse.color[1],
-      t.diffuse.color[2]
-    ), this.ambient.intensity = t.ambient.intensity, this.ambient.color = new o.Color(
-      t.ambient.color[0],
-      t.ambient.color[1],
-      t.ambient.color[2]
-    ), this.renderer.resetState(), i.bindRenderTarget(), this.renderer.render(this.scene, this.camera), u.requestRender(this.view), i.resetWebGLState();
-  }
-  /**
-   * 新增车辆
-   * */
-  addVehicles(i) {
-    !this.carModelReady || !this.vanModelReady || !this.truckModelReady || !this.busModelReady || !this.bicycleModelReady || i.forEach((e) => {
-      const { crossId: t, ptcId: s, localTimestamp: r } = e, l = Number(e.x), a = Number(e.y), c = Number(e.heading), h = `${t}-${s}`;
-      this.historyPositionMap.set(h, [
-        { pos: [l, a, 0], heading: c, time: r }
-      ]);
-      const n = this.getVehicleModel(e);
-      n.name = h, n.visible = !1, this.createPlateSprite(e, (d) => {
-        n.add(d), d.position.set(0, 5, -4);
-      }), this.scene.add(n), this.vehicleObjectMap.set(h, {
-        model: n,
-        data: e
-      });
-    });
-  }
-  /**
-   * 更新车辆
-   * */
-  updateVehicles(i) {
-    !this.carModelReady || !this.vanModelReady || !this.truckModelReady || !this.busModelReady || !this.bicycleModelReady || i.forEach((e) => {
-      const { crossId: t, ptcId: s, localTimestamp: r } = e, l = Number(e.x), a = Number(e.y);
-      let c = Number(e.heading);
-      const h = `${t}-${s}`, n = this.vehicleObjectMap.get(h);
-      if (n) {
-        if ((n.data.vehicleColor !== e.vehicleColor || n.data.vehicleType !== e.vehicleType) && (this.scene.remove(n.model), this.disposeModel(n.model), n.model = this.getVehicleModel(e), this.scene.add(n.model)), n.data.showName !== e.showName || n.data.plateColor !== e.plateColor) {
-          const m = n.model.getObjectByName("VehiclePlate");
-          m && (n.model.remove(m), this.disposeModel(m)), this.createPlateSprite(e, (g) => {
-            n.model.add(g), g.position.set(0, 5, -4);
-          });
-        }
-        n.data = e;
-        const d = this.historyPositionMap.get(
-          h
-        ), p = d[d.length - 1];
-        Math.abs(c - p.heading) >= 180 && (c > p.heading ? p.heading += 360 : c += 360), d.push({
-          pos: [l, a, 0],
-          heading: c,
-          time: r
-        });
-      } else {
-        this.historyPositionMap.set(h, [
-          { pos: [l, a, 0], heading: c, time: r }
-        ]);
-        const d = this.getVehicleModel(e);
-        d.name = h, d.visible = !1, this.createPlateSprite(e, (p) => {
-          d.add(p), p.position.set(0, 5, -4);
-        }), this.scene.add(d), this.vehicleObjectMap.set(h, {
-          model: d,
-          data: e
-        });
-      }
-    });
-  }
-  /**
-   * 删除车辆
-   * */
-  deleteVehicles(i) {
-    i.forEach((e) => {
-      const t = this.vehicleObjectMap.get(e);
-      t && (this.disposeModel(t.model), this.scene.remove(t.model), this.vehicleObjectMap.delete(e), this.historyPositionMap.delete(e));
-    });
-  }
-  toggleTrafficInfo(i) {
-  }
-  /**
-   * 清除全部车辆
-   * */
-  clearVehicles() {
-    for (const i of this.vehicleObjectMap.keys()) {
-      const e = this.vehicleObjectMap.get(i);
-      e && (this.disposeModel(e.model), this.scene.remove(e.model));
-    }
-    this.vehicleObjectMap.clear(), this.historyPositionMap.clear();
-  }
-  /**
-   * 设置号牌显示状态
-   * @param contentType
-   * @returns
-   */
-  updatePanelContent(i) {
-    if (i !== this.currentSpriteContent) {
-      this.currentSpriteContent = i;
-      for (const e of this.vehicleObjectMap.keys()) {
-        const t = this.vehicleObjectMap.get(e);
-        if (t) {
-          const s = t.model.getObjectByName("VehiclePlate");
-          s && (t.model.remove(s), this.disposeModel(s)), i !== M.None && this.createPlateSprite(t.data, (r) => {
-            t.model.add(r), r.position.set(0, 5, -4);
-          });
-        }
-      }
-    }
-  }
-  toggleGroundVehicle(i) {
-  }
-  toggleElevatedVehicle(i) {
-  }
-  /**
-   * 释放模型资源
-   * */
-  disposeModel(i) {
-    i.traverse((e) => {
-      e instanceof o.Mesh && (e.geometry.dispose(), e.material.dispose());
-    });
-  }
-  /**
-   * 计算车辆位置
-   * */
-  computeVehiclePosition(i) {
-    const e = this.historyPositionMap.get(i), t = this.vehicleObjectMap.get(i);
-    if (!t || !e)
-      return [0, 0, 0, 0];
-    if (e.length === 0)
-      return [0, 0, 0, 0];
-    if (e.length <= 2)
-      return [...e[0].pos, e[0].heading];
-    const s = Date.now();
-    t.model.visible = !0, t.segmentStartTime || (t.segmentStartTime = s, t.segmentTotalTime = e[1].time - e[0].time);
-    const r = s - t.segmentStartTime, l = Math.min(
-      r / t.segmentTotalTime,
-      1
-    );
-    if (l === 1)
-      if (e.shift(), e.length === 1) {
-        t.segmentStartTime = void 0;
-        return;
-      } else
-        return t.segmentStartTime = s, t.segmentTotalTime = e[1].time - e[0].time, Math.abs(
-          e[1].heading - e[0].heading
-        ) >= 180 && (e[1].heading > e[0].heading ? e[0].heading += 360 : e[1].heading += 360), [...e[0].pos, e[0].heading];
-    else {
-      const a = e[0].pos[0] + (e[1].pos[0] - e[0].pos[0]) * l, c = e[0].pos[1] + (e[1].pos[1] - e[0].pos[1]) * l, h = e[0].heading + (e[1].heading - e[0].heading) * l;
-      return [a, c, 0, h];
-    }
-  }
-  /**
-   * 根据车辆类型、车身颜色获取模型
-   * */
-  getVehicleModel(i) {
-    let e;
-    if (i.ptcType === 2)
-      e = this.bicycleModel.clone();
-    else {
-      switch (i.vehicleType) {
-        case 10:
-          e = this.carModel.clone();
-          break;
-        case 20:
-          e = this.vanModel.clone();
-          break;
-        case 25:
-          e = this.truckModel.clone();
-          break;
-        case 50:
-          e = this.busModel.clone();
-          break;
-        default:
-          e = this.carModel.clone();
-          break;
-      }
-      const t = this.materialMap.get(i.vehicleColor) || this.defaultMaterial;
-      let s = !1;
-      e.traverse((r) => {
-        !s && r instanceof o.Mesh && (r.material = t, s = !0);
-      });
-    }
-    return e;
-  }
-  /**
-   * 创建号牌canvas
-   * */
-  createCanvas(i, e, t) {
-    const s = document.createElement("canvas"), r = i.width, l = i.height;
-    s.width = r, s.height = l;
-    const a = s.getContext("2d");
-    if (!a) {
-      console.log("canvas创建失败");
-      return;
-    }
-    return a.fillStyle = "rgba(0,0,0,0.0)", a.fillRect(0, 0, r, l), a.drawImage(i, 0, 0, r, l), a.beginPath(), a.translate(r / 2, l / 2), a.fillStyle = t, a.font = "bold 32px 宋体", a.textBaseline = "middle", a.textAlign = "center", a.fillText(e, 0, 0), s;
-  }
-  createPlateSprite(i, e) {
-    var c, h;
-    const t = !i.plateNo || i.plateNo === "0" || i.plateNo === "000000";
-    if (this.currentSpriteContent === M.None || this.currentSpriteContent === M.PlateNumber && t)
-      return;
-    const s = new Image();
-    let r = "", l = "", a = "";
-    if (this.currentSpriteContent === M.PlateNumber || this.currentSpriteContent === M.Mix)
-      if (t)
-        r = "grey", l = i.ptcId, a = "#ffffff";
-      else
-        switch (l = ((c = i.showName) == null ? void 0 : c.substring(0, 2)) + "•" + ((h = i.showName) == null ? void 0 : h.substring(2)), i.plateColor) {
-          case 1:
-            r = "blue", a = "#ffffff";
-            break;
-          case 2:
-            r = "yellow", a = "#000000";
-            break;
-          case 3:
-            r = "white", a = "#000000";
-            break;
-          case 4:
-            r = "black";
-            break;
-          case 5:
-            r = "neo_yellow", a = "#000000";
-            break;
-          case 6:
-            r = "neo_green", a = "#000000";
-            break;
-          default:
-            r = "grey", l = i.plateNo, a = "#ffffff";
-            break;
-        }
-    else
-      this.currentSpriteContent === M.Id && (r = "grey", l = i.ptcId, a = "#ffffff");
-    s.src = `${this.assetsRoot}/Images/PlateBG/${r}.png`, s.onload = () => {
-      const n = this.createCanvas(s, l, a);
-      if (!n)
-        return;
-      const d = new o.CanvasTexture(n), p = new o.SpriteMaterial({
-        map: d
-      }), f = new o.Sprite(p), m = 0.05, g = n.width * m, y = n.height * m;
-      f.scale.set(g, y, 1), f.name = "VehiclePlate", e(f);
-    };
-  }
-}
-export {
-  k as default
-};

package/lib/src/gis-map/utils/holo-flow/trace-external-renderer.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const w=require("@arcgis/core/geometry/SpatialReference"),R=require("@arcgis/core/views/3d/externalRenderers"),S=require("three"),P=require("three/examples/jsm/loaders/GLTFLoader.js"),p=require("../../../types/index.js"),T=require("../../stores/index.js");function b(u){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const e in u)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(u,e);Object.defineProperty(i,e,t.get?t:{enumerable:!0,get:()=>u[e]})}}return i.default=u,Object.freeze(i)}const y=b(R),o=b(S);class C{constructor(i){this.defaultMaterial=new o.MeshBasicMaterial({color:6908265}),this.materialMap=new Map([[1,new o.MeshBasicMaterial({color:16777215})],[2,new o.MeshBasicMaterial({color:7833753})],[3,new o.MeshBasicMaterial({color:16766720})],[4,new o.MeshBasicMaterial({color:16758465})],[5,new o.MeshBasicMaterial({color:14423100})],[6,new o.MeshBasicMaterial({color:3329330})],[7,new o.MeshBasicMaterial({color:2003183})],[8,new o.MeshBasicMaterial({color:16032864})],[9,new o.MeshBasicMaterial({color:2105376})],[10,new o.MeshBasicMaterial({color:9662683})],[99,new o.MeshBasicMaterial({color:6908265})]]),this.carModelReady=!1,this.vanModelReady=!1,this.truckModelReady=!1,this.busModelReady=!1,this.bicycleModelReady=!1,this.currentSpriteContent=p.EVehiclePlateState.None,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map;const e=T.default.useAppDataStore;this.assetsRoot=JSON.parse(JSON.stringify(e.mapConfig)).assetsRoot,this.view=i;const t=new P.GLTFLoader;t.load(`${this.assetsRoot}/3DModels/car.glb`,s=>{this.carModel=s.scene,this.carModel.rotation.x=o.MathUtils.degToRad(90),this.carModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/van.glb`,s=>{this.vanModel=s.scene,this.vanModel.rotation.x=o.MathUtils.degToRad(90),this.vanModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/truck.glb`,s=>{this.truckModel=s.scene,this.truckModel.scale.set(1.2,1,1.5),this.truckModel.rotation.x=o.MathUtils.degToRad(90),this.truckModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/bus.glb`,s=>{this.busModel=s.scene,this.busModel.rotation.x=o.MathUtils.degToRad(90),this.busModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/bicycle.glb`,s=>{this.bicycleModel=s.scene,this.bicycleModel.rotation.x=o.MathUtils.degToRad(90),this.bicycleModel.rotation.y=o.MathUtils.degToRad(180),this.bicycleModelReady=!0})}async setup(i){this.renderer=new o.WebGLRenderer({context:i.gl,premultipliedAlpha:!1,antialias:!0}),this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setViewport(0,0,this.view.width,this.view.height),this.renderer.autoClearDepth=!1,this.renderer.autoClearStencil=!1,this.renderer.autoClearColor=!1;const e=this.renderer.setRenderTarget.bind(this.renderer);this.renderer.setRenderTarget=t=>{e(t),t==null&&i.bindRenderTarget()},this.scene=new o.Scene,this.camera=new o.PerspectiveCamera,this.ambient=new o.AmbientLight(16777215,.5),this.scene.add(this.ambient),this.sun=new o.DirectionalLight(16777215,.5),this.scene.add(this.sun),i.resetWebGLState()}async render(i){var s;const e=i.camera;this.camera.position.set(e.eye[0],e.eye[1],e.eye[2]),this.camera.up.set(e.up[0],e.up[1],e.up[2]),this.camera.lookAt(new o.Vector3(e.center[0],e.center[1],e.center[2])),this.camera.projectionMatrix.fromArray(e.projectionMatrix);for(const r of this.vehicleObjectMap.keys()){const l=(s=this.vehicleObjectMap.get(r))==null?void 0:s.model;if(!l)continue;const a=this.computeVehiclePosition(r);if(a){const c=[0,0,0];y.toRenderCoordinates(this.view,a,0,w.WGS84,c,0,1),l.position.set(c[0],c[1],c[2]),l.rotation.y=o.MathUtils.degToRad(-a[3])}}const t=i.sunLight;this.sun.position.set(t.direction[0],t.direction[1],t.direction[2]),this.sun.intensity=t.diffuse.intensity,this.sun.color=new o.Color(t.diffuse.color[0],t.diffuse.color[1],t.diffuse.color[2]),this.ambient.intensity=t.ambient.intensity,this.ambient.color=new o.Color(t.ambient.color[0],t.ambient.color[1],t.ambient.color[2]),this.renderer.resetState(),i.bindRenderTarget(),this.renderer.render(this.scene,this.camera),y.requestRender(this.view),i.resetWebGLState()}addVehicles(i){!this.carModelReady||!this.vanModelReady||!this.truckModelReady||!this.busModelReady||!this.bicycleModelReady||i.forEach(e=>{const{crossId:t,ptcId:s,localTimestamp:r}=e,l=Number(e.x),a=Number(e.y),c=Number(e.heading),h=`${t}-${s}`;this.historyPositionMap.set(h,[{pos:[l,a,0],heading:c,time:r}]);const n=this.getVehicleModel(e);n.name=h,n.visible=!1,this.createPlateSprite(e,d=>{n.add(d),d.position.set(0,5,-4)}),this.scene.add(n),this.vehicleObjectMap.set(h,{model:n,data:e})})}updateVehicles(i){!this.carModelReady||!this.vanModelReady||!this.truckModelReady||!this.busModelReady||!this.bicycleModelReady||i.forEach(e=>{const{crossId:t,ptcId:s,localTimestamp:r}=e,l=Number(e.x),a=Number(e.y);let c=Number(e.heading);const h=`${t}-${s}`,n=this.vehicleObjectMap.get(h);if(n){if((n.data.vehicleColor!==e.vehicleColor||n.data.vehicleType!==e.vehicleType)&&(this.scene.remove(n.model),this.disposeModel(n.model),n.model=this.getVehicleModel(e),this.scene.add(n.model)),n.data.showName!==e.showName||n.data.plateColor!==e.plateColor){const f=n.model.getObjectByName("VehiclePlate");f&&(n.model.remove(f),this.disposeModel(f)),this.createPlateSprite(e,g=>{n.model.add(g),g.position.set(0,5,-4)})}n.data=e;const d=this.historyPositionMap.get(h),M=d[d.length-1];Math.abs(c-M.heading)>=180&&(c>M.heading?M.heading+=360:c+=360),d.push({pos:[l,a,0],heading:c,time:r})}else{this.historyPositionMap.set(h,[{pos:[l,a,0],heading:c,time:r}]);const d=this.getVehicleModel(e);d.name=h,d.visible=!1,this.createPlateSprite(e,M=>{d.add(M),M.position.set(0,5,-4)}),this.scene.add(d),this.vehicleObjectMap.set(h,{model:d,data:e})}})}deleteVehicles(i){i.forEach(e=>{const t=this.vehicleObjectMap.get(e);t&&(this.disposeModel(t.model),this.scene.remove(t.model),this.vehicleObjectMap.delete(e),this.historyPositionMap.delete(e))})}toggleTrafficInfo(i){}clearVehicles(){for(const i of this.vehicleObjectMap.keys()){const e=this.vehicleObjectMap.get(i);e&&(this.disposeModel(e.model),this.scene.remove(e.model))}this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}updatePanelContent(i){if(i!==this.currentSpriteContent){this.currentSpriteContent=i;for(const e of this.vehicleObjectMap.keys()){const t=this.vehicleObjectMap.get(e);if(t){const s=t.model.getObjectByName("VehiclePlate");s&&(t.model.remove(s),this.disposeModel(s)),i!==p.EVehiclePlateState.None&&this.createPlateSprite(t.data,r=>{t.model.add(r),r.position.set(0,5,-4)})}}}}toggleGroundVehicle(i){}toggleElevatedVehicle(i){}disposeModel(i){i.traverse(e=>{e instanceof o.Mesh&&(e.geometry.dispose(),e.material.dispose())})}computeVehiclePosition(i){const e=this.historyPositionMap.get(i),t=this.vehicleObjectMap.get(i);if(!t||!e)return[0,0,0,0];if(e.length===0)return[0,0,0,0];if(e.length<=2)return[...e[0].pos,e[0].heading];const s=Date.now();t.model.visible=!0,t.segmentStartTime||(t.segmentStartTime=s,t.segmentTotalTime=e[1].time-e[0].time);const r=s-t.segmentStartTime,l=Math.min(r/t.segmentTotalTime,1);if(l===1)if(e.shift(),e.length===1){t.segmentStartTime=void 0;return}else return t.segmentStartTime=s,t.segmentTotalTime=e[1].time-e[0].time,Math.abs(e[1].heading-e[0].heading)>=180&&(e[1].heading>e[0].heading?e[0].heading+=360:e[1].heading+=360),[...e[0].pos,e[0].heading];else{const a=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*l,c=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*l,h=e[0].heading+(e[1].heading-e[0].heading)*l;return[a,c,0,h]}}getVehicleModel(i){let e;if(i.ptcType===2)e=this.bicycleModel.clone();else{switch(i.vehicleType){case 10:e=this.carModel.clone();break;case 20:e=this.vanModel.clone();break;case 25:e=this.truckModel.clone();break;case 50:e=this.busModel.clone();break;default:e=this.carModel.clone();break}const t=this.materialMap.get(i.vehicleColor)||this.defaultMaterial;let s=!1;e.traverse(r=>{!s&&r instanceof o.Mesh&&(r.material=t,s=!0)})}return e}createCanvas(i,e,t){const s=document.createElement("canvas"),r=i.width,l=i.height;s.width=r,s.height=l;const a=s.getContext("2d");if(!a){console.log("canvas创建失败");return}return a.fillStyle="rgba(0,0,0,0.0)",a.fillRect(0,0,r,l),a.drawImage(i,0,0,r,l),a.beginPath(),a.translate(r/2,l/2),a.fillStyle=t,a.font="bold 32px 宋体",a.textBaseline="middle",a.textAlign="center",a.fillText(e,0,0),s}createPlateSprite(i,e){var c,h;const t=!i.plateNo||i.plateNo==="0"||i.plateNo==="000000";if(this.currentSpriteContent===p.EVehiclePlateState.None||this.currentSpriteContent===p.EVehiclePlateState.PlateNumber&&t)return;const s=new Image;let r="",l="",a="";if(this.currentSpriteContent===p.EVehiclePlateState.PlateNumber||this.currentSpriteContent===p.EVehiclePlateState.Mix)if(t)r="grey",l=i.ptcId,a="#ffffff";else switch(l=((c=i.showName)==null?void 0:c.substring(0,2))+"•"+((h=i.showName)==null?void 0:h.substring(2)),i.plateColor){case 1:r="blue",a="#ffffff";break;case 2:r="yellow",a="#000000";break;case 3:r="white",a="#000000";break;case 4:r="black";break;case 5:r="neo_yellow",a="#000000";break;case 6:r="neo_green",a="#000000";break;default:r="grey",l=i.plateNo,a="#ffffff";break}else this.currentSpriteContent===p.EVehiclePlateState.Id&&(r="grey",l=i.ptcId,a="#ffffff");s.src=`${this.assetsRoot}/Images/PlateBG/${r}.png`,s.onload=()=>{const n=this.createCanvas(s,l,a);if(!n)return;const d=new o.CanvasTexture(n),M=new o.SpriteMaterial({map:d}),m=new o.Sprite(M),f=.05,g=n.width*f,v=n.height*f;m.scale.set(g,v,1),m.name="VehiclePlate",e(m)}}}exports.default=C;

package/lib/src/gis-map/utils/holo-flow/trace-layer-renderer.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("@arcgis/core/Graphic"),p=require("@arcgis/core/layers/GraphicsLayer"),m=require("../../stores/index.js");class g{constructor(i){this.showVehiclePlate=!1,this.showGroundVehicle=!0,this.showElevatedVehicle=!0,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.view=i;const e=m.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(e.mapConfig)),this.vehicleLayer=new p({id:"vehicleLayer"}),this.view.map.add(this.vehicleLayer),requestAnimationFrame(()=>this.render())}addVehicles(i){const e=i.map(t=>{const{crossId:l,ptcId:n}=t,s=Number(t.x),a=Number(t.y),r=Number(t.heading),o=`${l}-${n}`;this.historyPositionMap.set(o,[{pos:[s,a,0],heading:r,time:Date.now()}]);const c=new h({geometry:{type:"point",x:s,y:a},attributes:{...t},symbol:this.createCIMSymbol(t)});return c.visible=!1,this.vehicleObjectMap.set(o,{graphic:c,data:t,waitForDelete:!1}),c});this.vehicleLayer.addMany(e)}updateVehicles(i){const e=[];i.forEach(t=>{const{crossId:l,ptcId:n}=t,s=Number(t.x),a=Number(t.y),r=`${l}-${n}`,o=this.vehicleObjectMap.get(r);o?(o.data=t,this.historyPositionMap.get(r).push({pos:[s,a,0],heading:t.heading,time:Date.now()})):e.push(t)}),this.addVehicles(e)}deleteVehicles(i){i.forEach(e=>{const t=this.vehicleObjectMap.get(e);t&&(t.waitForDelete=!0)})}clearVehicles(){this.vehicleLayer.removeAll(),this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}updatePanelContent(i){console.log(i)}toggleGroundVehicle(i){this.showGroundVehicle=i}toggleElevatedVehicle(i){this.showElevatedVehicle=i}toggleTrafficInfo(i){i.name==="vehiclePlate"&&(this.showVehiclePlate=i.visible)}render(){this.vehicleObjectMap.forEach((i,e)=>{this.updatePosition(e)}),requestAnimationFrame(()=>this.render())}updatePosition(i){const e=this.historyPositionMap.get(i),t=this.vehicleObjectMap.get(i);if(!e||!t||e.length<=1)return;(t.graphic.getAttribute("roadLayer")||"1")==="1"?t.graphic.visible=this.showGroundVehicle:t.graphic.visible=this.showElevatedVehicle,t.segmentStartTime||(t.segmentStartTime=Date.now(),t.segmentTotalTime=e[1].time-e[0].time);const n=Date.now()-t.segmentStartTime,s=Math.min(1,n/t.segmentTotalTime);if(s===1)if(e.shift(),e.length===1){t.waitForDelete?(this.vehicleLayer.remove(t.graphic),this.vehicleObjectMap.delete(i),this.historyPositionMap.delete(i)):(t.segmentStartTime=void 0,t.segmentTotalTime=void 0);return}else t.segmentStartTime=Date.now(),t.segmentTotalTime=e[1].time-e[0].time,(e[1].heading>=270&&e[0].heading<=90||e[1].heading<=90&&e[0].heading>=270)&&(e[1].heading>e[0].heading?e[0].heading+=360:e[1].heading+=360),t.graphic.geometry={type:"point",x:e[0].pos[0],y:e[0].pos[1]};else{const a=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*s,r=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*s,o=e[0].heading+(e[1].heading-e[0].heading)*s;t.graphic.geometry={type:"point",x:a,y:r},t.data.heading=o,t.graphic.symbol=this.createCIMSymbol(t.data)}}createCIMSymbol(i){const e=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:e.backgroundColor}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:e.fillColor}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:30,rotation:i.heading,rotateClockwise:!0,textureFilter:"Picture",url:`${this.mapConfig.assetsRoot}Images/car/${this.getCarPic(i.vehicleColor)}`}]}}}}getCarPic(i){if(this.view.zoom<=15)return"point.png";let e="grey";switch(typeof i=="string"&&(i=i.toLowerCase()),i){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 e+".png"}getPlateFontColor(i){let e=[255,255,255,255],t=[169,169,169,255];switch(i){case 0:e=[0,0,0,255],t=[255,255,255,255];break;case 1:e=[0,0,0,255],t=[244,164,96,255];break;case 2:e=[255,255,255,255],t=[65,105,225,255];break;case 3:e=[255,255,255,255],t=[0,0,0,255];break;case 15:e=[244,164,96,255],t=[0,250,154,255];break;case 16:e=[0,0,0,255],t=[0,250,154,255];break}return{fillColor:e,backgroundColor:t}}}exports.default=g;