174 lines
4.8 KiB
Markdown
174 lines
4.8 KiB
Markdown
# 🎯 QB303设备坐标undefined问题修复指南
|
||
|
||
## 🔍 问题根因分析
|
||
|
||
从您的完整调试日志中发现了关键问题:
|
||
|
||
```
|
||
aixiaorui.ts:1946 QB303设备 dy04 位置已更新到: [undefined, undefined, 0]
|
||
```
|
||
|
||
**根本原因:** 数据结构不匹配导致坐标访问错误。
|
||
|
||
## 📊 数据结构分析
|
||
|
||
### **localStorage中的数据结构(正确):**
|
||
```json
|
||
{
|
||
"equipmentId": "dy04",
|
||
"latitude": 28.20648476190476,
|
||
"longitude": 112.8945530952381,
|
||
"altitude": 200,
|
||
"battleUnitCode": "dy04"
|
||
}
|
||
```
|
||
|
||
### **传入加载QB303设备方法的数据结构:**
|
||
```javascript
|
||
{
|
||
info: { /* 实际设备数据 */ },
|
||
deviceImage: BillboardEntity
|
||
}
|
||
```
|
||
|
||
### **问题:**
|
||
代码中使用 `data.longitude` 访问坐标,但实际应该使用 `data.info.longitude`。
|
||
|
||
## ✅ 修复内容
|
||
|
||
### **1. 兼容不同数据结构**
|
||
```javascript
|
||
// 修复前:直接访问可能导致undefined
|
||
position: [data.longitude, data.latitude, data.altitude || 0]
|
||
|
||
// 修复后:兼容两种数据结构
|
||
const deviceInfo = data.info || data;
|
||
position: [deviceInfo.longitude, deviceInfo.latitude, deviceInfo.altitude || 0]
|
||
```
|
||
|
||
### **2. 添加详细调试日志**
|
||
```javascript
|
||
console.log('设备信息:', deviceInfo);
|
||
console.log('设备坐标:', `[${deviceInfo.longitude}, ${deviceInfo.latitude}, ${deviceInfo.altitude || 0}]`);
|
||
```
|
||
|
||
### **3. 修复所有相关属性**
|
||
- ✅ **位置坐标**: `deviceInfo.longitude`, `deviceInfo.latitude`, `deviceInfo.altitude`
|
||
- ✅ **设备方向**: `deviceInfo.yaw`
|
||
- ✅ **设备标识**: `deviceInfo.battleUnitCode`, `deviceInfo.equipmentId`
|
||
- ✅ **标签文本**: 使用正确的设备信息
|
||
- ✅ **点击事件**: 传递正确的设备数据
|
||
|
||
## 🚀 测试方法
|
||
|
||
### **方法1:测试坐标修复**
|
||
```javascript
|
||
testCoordinateFix()
|
||
```
|
||
**功能:**
|
||
- 检查当前QB303设备数据
|
||
- 强制刷新QB303设备显示
|
||
- 自动飞行到设备位置
|
||
- 验证坐标修复效果
|
||
|
||
### **方法2:重新完整调试**
|
||
```javascript
|
||
fullQB303Debug()
|
||
```
|
||
现在应该看到正确的坐标输出而不是undefined。
|
||
|
||
## 🎯 预期修复结果
|
||
|
||
### **修复前的错误输出:**
|
||
```
|
||
❌ QB303设备 dy04 位置已更新到: [undefined, undefined, 0]
|
||
❌ 找到的QB303图形: 0 个
|
||
```
|
||
|
||
### **修复后的正确输出:**
|
||
```
|
||
✅ 设备信息: {equipmentId: 'dy04', latitude: 28.20648476190476, longitude: 112.8945530952381, ...}
|
||
✅ 设备坐标: [112.8945530952381, 28.20648476190476, 200]
|
||
✅ QB303设备 dy04 已添加到地图
|
||
✅ 设备位置: [112.8945530952381, 28.20648476190476, 200]
|
||
✅ 找到的QB303图形: 1 个
|
||
```
|
||
|
||
## 📍 地理位置信息
|
||
|
||
**QB303设备dy04的位置:**
|
||
- **经度**: 112.8945530952381°E
|
||
- **纬度**: 28.20648476190476°N
|
||
- **高度**: 200米
|
||
- **地理位置**: 湖南省境内
|
||
- **距离您当前相机位置**: 约1000公里(需要飞行查看)
|
||
|
||
## 🔍 验证步骤
|
||
|
||
### **步骤1:执行坐标修复测试**
|
||
```javascript
|
||
testCoordinateFix()
|
||
```
|
||
|
||
### **步骤2:观察日志输出**
|
||
应该看到正确的坐标值而不是undefined。
|
||
|
||
### **步骤3:检查地图显示**
|
||
- 相机会自动飞行到湖南省QB303设备位置
|
||
- 应该能看到QB303设备图标和标签
|
||
|
||
### **步骤4:验证交互功能**
|
||
- 点击QB303设备图标
|
||
- 应该显示设备详细信息
|
||
|
||
## 🚨 如果仍有问题
|
||
|
||
### **检查数据结构**
|
||
```javascript
|
||
// 检查传入加载方法的数据结构
|
||
console.log('QB303设备原始数据:', window.m3Data.qb303DeviceData);
|
||
Object.entries(window.m3Data.qb303DeviceData).forEach(([key, value]) => {
|
||
console.log(`设备 ${key}:`, value);
|
||
if (value.info) {
|
||
console.log(` - 设备信息:`, value.info);
|
||
console.log(` - 坐标: [${value.info.longitude}, ${value.info.latitude}]`);
|
||
}
|
||
});
|
||
```
|
||
|
||
### **手动验证坐标**
|
||
```javascript
|
||
// 直接使用localStorage数据创建测试设备
|
||
const localData = JSON.parse(localStorage.getItem("index-otherEquipmentList"));
|
||
const dy04Device = localData.find(d => d.equipmentId === 'dy04');
|
||
console.log('localStorage中dy04设备:', dy04Device);
|
||
console.log('坐标:', [dy04Device.longitude, dy04Device.latitude, dy04Device.altitude]);
|
||
```
|
||
|
||
## 📋 快速命令参考
|
||
|
||
```javascript
|
||
// === 坐标修复测试 ===
|
||
testCoordinateFix() // 测试坐标修复效果
|
||
|
||
// === 基础调试 ===
|
||
debugQB303Rendering() // 检查渲染状态
|
||
fullQB303Debug() // 完整调试流程
|
||
|
||
// === 地图操作 ===
|
||
// 飞行到QB303设备位置
|
||
window.m3Data.map.flyTo({
|
||
destination: Cesium.Cartesian3.fromDegrees(112.8945530952381, 28.20648476190476, 1000)
|
||
});
|
||
```
|
||
|
||
## 🎉 修复总结
|
||
|
||
通过修复数据结构访问问题:
|
||
1. ✅ **解决了坐标undefined问题**
|
||
2. ✅ **确保设备能正确定位**
|
||
3. ✅ **修复了所有相关属性访问**
|
||
4. ✅ **添加了详细的调试信息**
|
||
|
||
现在QB303设备应该能够正确显示在湖南省的指定位置了!请执行 `testCoordinateFix()` 验证修复效果。🚁🗺️✨
|