bug修复

src/components/Map.vue

@@ -3,7 +3,7 @@
         <!-- 地图容器 -->
         <div id="container" style="width:200px;height:100px;"></div>
         <!-- 输入框用于模拟实时接收经纬度数据 -->
-        <!-- <button @click="updateMarkerPosition">更新位置</button> -->
+        <!-- <button @click="updateMarkerPosition(currentPosition)">更新位置</button> -->
     </div>
 </template>
 
@@ -20,6 +20,10 @@ export default {
         };
     },
     mounted() {
+        let currentPosition = this.$store.state.currentPosition || {};
+        if (currentPosition.latitude != null && currentPosition.longitude != null) {
+            this.currentPosition = currentPosition;
+        }
         this.initMap();
     },
     computed: {
@@ -48,10 +52,14 @@ export default {
                 mapTypeControl: false, // 禁用地图类型控件
                 // 可以根据需求添加其他控件
                 zoomControl: false, // 显示缩放控件
-                mapTypeId: qq.maps.MapTypeId.ROADMAP // 设置地图类型为普通街景图
+                mapTypeId: qq.maps.MapTypeId.ROADMAP, // 设置地图类型为普通街景图
+                disableDefaultUI: true, // 禁用默认的用户界面控件（如缩放控件）
+                draggable: false, // 禁止地图拖动
+                scrollwheel: false, // 禁止鼠标滚轮缩放地图
+                disableDoubleClickZoom: true // 禁用双击放大功能
             });
             const icon = new qq.maps.MarkerImage(
-                'https://wrj-songlanyn.oss-cn-beijing.aliyuncs.com/2025/07/21/20667ea4e2b14e149d758350d819995b.png',  // 图标图片路径（放在 public/ 目录下）
+                'https://wrj-songlanyn.oss-cn-beijing.aliyuncs.com/2025/07/24/c6b1d229d1cb48678d77d8e771402f2c.png',  // 图标图片路径（放在 public/ 目录下）
                 // new qq.maps.Size(40, 40),   // 图标大小
                 // new qq.maps.Point(0, 0)   // 锚点位置（图标中心点对准坐标点）
             );
@@ -74,8 +82,9 @@ export default {
                     // 创建带有旋转角度的图标
                     // 将特殊偏航角转换为标准方位角
                     const standardBearing = (360 + this.$store.state.attitudeHead * 1) % 360;
-                    // this.marker.setIcon(this.createIcon(standardBearing));
+                    this.createIcon(standardBearing)
                 }
+                // this.createIcon(90);
                 // 更新图标及其方向
                 // 移动地图视图到新位置
                 this.map.panTo(newPos);
@@ -86,29 +95,16 @@ export default {
                 // alert('请输入有效的经纬度，格式为"纬度,经度"');
             }
         },
-        // 创建带有旋转角度的图标
+        // 修改图标方向
         createIcon(direction = 0) {
-            // 创建带有旋转角度的图标
-            const originalUrl = 'https://wrj-songlanyn.oss-cn-beijing.aliyuncs.com/2025/07/21/c2417a25a6844f12ae6f632956e9cf6a.png'; // 自定义图标路径
-            // 创建图标对象
-            const icon = new qq.maps.MarkerImage(
-                originalUrl,
-                // size,
-                // origin,
-                // anchor
-            );
-            
-            console.log("direction", direction);
-            // 设置旋转角度
-            const transformStyle = `rotate(${direction}deg)`;
-            const div = document.createElement('div');
-            div.style.transform = transformStyle;
-            div.style.webkitTransform = transformStyle;
-            // 应用旋转样式
-            // const div = document.createElement('div');
-            // div.style.transform = transformStyle;
-            // div.style.webkitTransform = transformStyle;
-            return icon;
+            // 使用 CSS 选择器查找所有具有指定类的元素
+            let elements = document.querySelectorAll('.csssprite');
+
+            // 遍历并添加旋转样式
+            elements.forEach(function (el) {
+                el.style.transform = `rotate(${direction}deg)`;
+                el.style.transition = 'transform 0.3s ease'; // 可选
+            });
         },
     }
 };