人员轨迹增加轨迹回放

huaxin-web/src/components/bigWindow/Null.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-03-22 10:31:50
+ * @LastEditTime: 2025-03-07 11:26:33
+ * @LastEditors: 纪泽龙 jizelong@qq.com
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/components/bigWindow/Nulll.vue
+-->
+<template>
+  <div></div>
+</template>
+
+<script>
+export default {
+  data() {
+    return { com: null };
+  },
+};
+</script>
+
+<style></style>

huaxin-web/src/utils/mapClass/map.js

 /*
  * @Author: your name
  * @Date: 2022-01-11 13:45:12
- * @LastEditTime: 2023-07-19 18:02:31
+ * @LastEditTime: 2026-04-16 15:38:02
  * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /test/hello-world/src/utils/mapClass.js
@@ -815,4 +815,65 @@ export class EditorMap {
     this.allDevice["14"] = [];
     this.infowindowClose();
   }
+  hfMarker = null;
+  hfLine = null;
+  hfLine2 = null;
+  huifang(path) {
+    AMap.plugin("AMap.MoveAnimation", () => {
+      var marker,
+        lineArr = path;
+
+      // 绘制轨迹
+      var polyline = new AMap.Polyline({
+        map: this.map,
+        path: lineArr,
+        showDir: true,
+        strokeColor: "#28F", //线颜色
+        // strokeOpacity: 1,     //线透明度
+        strokeWeight: 6, //线宽
+        // strokeStyle: "solid"  //线样式
+      });
+
+      var passedPolyline = new AMap.Polyline({
+        map: this.map,
+        strokeColor: "#AF5", //线颜色
+        strokeWeight: 6, //线宽
+      });
+
+      marker = new AMap.Marker({
+        map: this.map,
+        position: lineArr[0],
+        icon: "https://a.amap.com/jsapi_demos/static/demo-center-v2/car.png",
+        offset: new AMap.Pixel(-13, -26),
+      });
+      
+      marker.on("moving", (e) => {
+        passedPolyline.setPath(e.passedPath);
+        this.map.setCenter(e.target.getPosition(), false);
+      });
+
+      this.map.setFitView();
+
+      marker.moveAlong(lineArr, {
+        // 每一段的时长
+        duration: 500, //可根据实际采集时间间隔设置
+        // JSAPI2.0 是否延道路自动设置角度在 moveAlong 里设置
+        autoRotation: true,
+      });
+
+      this.hfMarker = marker;
+      this.hfLine = polyline;
+      this.hfLine2 = passedPolyline;
+    });
+  }
+  clearhf() {
+    if (this.hfMarker || this.hfLine || this.hfLine2) {
+      this.map.remove(this.hfMarker);
+      this.map.remove(this.hfLine);
+      this.map.remove(this.hfLine2);
+      this.hfMarker = null;
+      this.hfLine = null;
+      this.hfLine2 = null;
+    }
+  }
 }