请问大佬们,当不同的普通用户绑定了不同的uid,通过后台模拟器实现发送不同的websocket数据,管理员用户如何实现可以渲染多个车辆模型在cesium地图上面跑?目前我只有一个车辆模型在上面跑动,如果后台发送多个不同的websocket数据的时候,车辆模型渲染就会一闪的一闪的出现车辆模型,求大佬们指教一下,万分谢谢 // 接收websocket数据 const onMessage = async (event) => { const data = JSON.parse(event.data); if (data.data == undefined) { console.log('未响应'); } else { if (data.data.state !== undefined) { return; } else { // console.log('=====', data.data); processPositionParams(data.data); updateCarModelPosition(positionParams);// 实时更新车辆移动位置 if (!polylineInitialized) { initializePolyline(positionParams); // 初始化轨迹线 polylineInitialized = true;// 标记轨迹线已初始化 } else { updatePolylinePosition(positionParams); // 更新轨迹线位置 } } } }; // 车辆模型渲染 let carModelData = null; function updateCarModelPosition(positions) { if (positions.length === 0) { return; } const latestPosition = positions[positions.length - 1]; const cartesian3 = Cesium.Cartesian3.fromDegrees(latestPosition.longitude, latestPosition.latitude, 0.4); if (!carModelData) { createCarModel(cartesian3, latestPosition.Angle); } else { carModelData.position = cartesian3; const headingPitchRoll = new Cesium.HeadingPitchRoll( Cesium.Math.toRadians(latestPosition.Angle + 90), Cesium.Math.toRadians(0), Cesium.Math.toRadians(0) ); carModelData.orientation = Cesium.Transforms.headingPitchRollQuaternion(cartesian3, headingPitchRoll); } } function createCarModel(cartesian3, angle) { const headingPitchRoll = new Cesium.HeadingPitchRoll( Cesium.Math.toRadians(angle + 90), Cesium.Math.toRadians(0), Cesium.Math.toRadians(0) ); const scaleByDistance = new Cesium.NearFarScalar(200, 120, 1200, 0.6); const distanceDisplayCondition = new Cesium.DistanceDisplayCondition(0, 10000); carModelData = viewer.entities.add({ position: cartesian3, orientation: Cesium.Transforms.headingPitchRollQuaternion(cartesian3, headingPitchRoll), model: { uri: "http://127.0.0.1:5501/car/scene.gltf", scale: 75, scaleByDistance, distanceDisplayCondition, }, id: 'carModel' // 添加id属性 }); } 更新后的代码------------------------------------ // 从服务器获取用户角色名 const userRole = computed(() => { return window.localStorage.getItem('roles') }) ------------------------------------------------ const onMessage = async (event) => { const data = JSON.parse(event.data); if (data.data == undefined) { console.log('未响应'); } else { if (data.data.state !== undefined) { return; } else { // console.log('=====', data.data); processPositionParams(data.data); updateCarModelPosition(positionParams);// 实时更新车辆移动位置 if (!polylineInitialized) { initializePolyline(positionParams); // 初始化轨迹线 polylineInitialized = true;// 标记轨迹线已初始化 } else { updatePolylinePosition(positionParams); // 更新轨迹线位置 } } } }; // 车辆模型渲染 let carModels = {}; // 存储车辆模型的对象 function updateCarModelPosition(positions) { positions.forEach(position => { const uid = position.UID; // 获取车辆的唯一标识符 if (!carModels[uid]) { createCarModel(position); } else { updateCarModel(carModels[uid], position); } }); } function createCarModel(position) { const cartesian3 = Cesium.Cartesian3.fromDegrees(position.longitude, position.latitude, 0.4); const headingPitchRoll = new Cesium.HeadingPitchRoll( Cesium.Math.toRadians(position.Angle + 90), Cesium.Math.toRadians(0), Cesium.Math.toRadians(0) ); const scaleByDistance = new Cesium.NearFarScalar(200, 120, 1200, 0.6); const distanceDisplayCondition = new Cesium.DistanceDisplayCondition(0, 10000); const carModel = viewer.entities.add({ position: cartesian3, orientation: Cesium.Transforms.headingPitchRollQuaternion(cartesian3, headingPitchRoll), model: { uri: "http://127.0.0.1:5501/car/scene.gltf", scale: 75, scaleByDistance, distanceDisplayCondition, }, id: `carModel-${position.UID}` // 使用唯一标识符添加id属性 }); carModels[position.UID] = carModel; // 将车辆模型存储到对象中 } function updateCarModel(carModel, position) { const cartesian3 = Cesium.Cartesian3.fromDegrees(position.longitude, position.latitude, 0.4); carModel.position = cartesian3; const headingPitchRoll = new Cesium.HeadingPitchRoll( Cesium.Math.toRadians(position.Angle + 90), Cesium.Math.toRadians(0), Cesium.Math.toRadians(0) ); carModel.orientation = Cesium.Transforms.headingPitchRollQuaternion(cartesian3, headingPitchRoll); }