@heycar/heycars-map 0.5.4 → 0.5.6

package/dist/Demo/DemoBusinessTaxiService.d.ts

@@ -2052,5 +2052,8 @@ export declare const DemoBusinessTaxiService: import("vue").DefineComponent<Read
     status: DriverStatus;
     contentHeight: number;
 }, {}, {
-    getDriverPosition(): Promise<Point>;
+    getDriverPosition(): Promise<{
+        position: Point;
+        angle: number;
+    }>;
 }, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<Readonly<{}>>>, {}>;

package/dist/business-components/BusinessTaxiServiceMap/BusinessTaxiServiceMap.d.ts

@@ -18,6 +18,9 @@ export type BusinessTaxiServiceMapProps = Omit<HeycarMapProps, "center" | "zoom"
         distance: number;
         duration: number;
     }) => string;
-    getDriverPosition: () => Promise<Point>;
+    getDriverPosition: () => Promise<{
+        position: Point;
+        angle?: number;
+    }>;
 };
 export declare const BusinessTaxiServiceMap: import("vue-demi").DefineComponent<import("vue/types/v3-component-props").ComponentObjectPropsOptions<BusinessTaxiServiceMapProps>, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").EmitByProps<BusinessTaxiServiceMapProps, Required<BusinessTaxiServiceMapProps>>, "resize" | "dragEnd" | "zoomEnd", BusinessTaxiServiceMapProps, {} | {}>;

package/dist/business-components/BusinessTaxiServiceMap/BusinessTaxiServiceSection.d.ts

@@ -15,6 +15,7 @@ export declare const SectionConfirmed: import("vue").DefineComponent<import("vue
 type SectionDriverStartServiceProps = Required<MROP> & {
     passengerPosition?: Point;
     carPosition?: Point;
+    carAngle?: number;
     from: Place;
     renderTitle: (props: Pick<DrivingRouteRenderProps, "duration" | "distance">) => string;
 };
@@ -28,6 +29,7 @@ export declare const SectionBookDispatched: import("vue").DefineComponent<import
 type SectionDriverArrivedProps = Required<MROP> & {
     from: Place;
     carPosition?: Point;
+    carAngle?: number;
     passengerPosition?: Point;
     title: string;
 };
@@ -35,6 +37,7 @@ export declare const SectionDriverArrived: import("vue").DefineComponent<import(
 type SectionInServiceProps = Required<MROP> & {
     to: Place;
     carPosition?: Point;
+    carAngle?: number;
     renderTitle: (props: Pick<DrivingRouteRenderProps, "duration" | "distance">) => string;
 };
 export declare const SectionInService: import("vue").DefineComponent<import("vue/types/v3-component-props").ComponentObjectPropsOptions<SectionInServiceProps>, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").EmitByProps<SectionInServiceProps, Required<SectionInServiceProps>>, never, SectionInServiceProps, {} | {}>;

package/dist/hooks/useDrivingTrackCorrection.d.ts

@@ -0,0 +1,10 @@
+import type { Point } from "../types/interface";
+interface UseDrivingTrackCorrectionProps {
+    track: Point[];
+    path: Point[];
+    onDeviation: (point: Point) => any;
+}
+export declare const useDrivingTrackCorrection: (props: UseDrivingTrackCorrectionProps) => {
+    path: import("vue").Ref<[number, number][]>;
+};
+export {};

package/dist/hooks/useMapGeometry.d.ts

@@ -1,10 +1,13 @@
 import type { Point } from "../types/interface";
 export declare const useAmapGeometry: () => {
     apiMapDistance: (from: Point, to: Point) => number | undefined;
+    apiMapDistanceToLine: (from: Point, line: Point[]) => number | undefined;
 };
 export declare const useGmapGeometry: () => {
     apiMapDistance: (from: Point, to: Point) => number | undefined;
+    apiMapDistanceToLine: (from: Point, line: Point[]) => 0 | undefined;
 };
 export declare const useMapGeometry: () => {
     apiMapDistance: (from: Point, to: Point) => number | undefined;
+    apiMapDistanceToLine: (from: Point, line: Point[]) => number | undefined;
 };

package/dist/index.cjs

@@ -2425,7 +2425,8 @@ const amapComputeHeading = (from, to, map) => {
   const { x: xFrom, y: yFrom } = map.lngLatToContainer(from);
   const { x: xTo, y: yTo } = map.lngLatToContainer(to);
   const theta = Math.atan2(yFrom - yTo, xTo - xFrom);
-  return (Math.PI / 2 - theta) / Math.PI * 180;
+  const signedAngle = (Math.PI / 2 - theta) / Math.PI * 180;
+  return signedAngle < 0 ? 360 + signedAngle : signedAngle;
 };
 const useAmapAngle = (props) => {
   return Vue.computed(() => {
@@ -2548,11 +2549,20 @@ const useAmapFitView = (props) => {
     },
     setFitView
   };
-  const handleMoveEndOrZomEnd = () => {
+  const handleDraggingOrZoomChange = () => {
+    if (!autoFitTimeout || !timer)
+      return;
+    clearTimeout(timer);
+    timer = void 0;
+  };
+  const handleMoveEndOrZomEnd = (eventName) => {
+    spaceLog("useAmapFitViewHandleMoveEndOrZomEnd", "eventName = ", eventName);
     if (!autoFitTimeout)
       return;
-    if (timer)
+    if (timer) {
       clearTimeout(timer);
+      timer = void 0;
+    }
     timer = setTimeout(() => {
       timer = void 0;
       setFitView();
@@ -2562,7 +2572,13 @@ const useAmapFitView = (props) => {
     mapRef,
     {},
     handleMoveEndOrZomEnd,
-    ["onDragEnd"]
+    ["onDragEnd", "onZoomEnd"]
+  );
+  watchPostEffectForAMapEvent(
+    mapRef,
+    {},
+    handleDraggingOrZoomChange,
+    ["onDragging", "onZoomchange"]
   );
   return { registerFitVeiw, setFitView };
 };
@@ -2607,6 +2623,12 @@ const useGmapFitView = (props) => {
     },
     setFitView
   };
+  const handleDrag = () => {
+    if (!autoFitTimeout || !timer)
+      return;
+    clearTimeout(timer);
+    timer = void 0;
+  };
   const handleMoveEnd = () => {
     const eventSource = getMapEvnetSource();
     if (!autoFitTimeout || eventSource !== "user")
@@ -2625,6 +2647,9 @@ const useGmapFitView = (props) => {
   watchPostEffectForGMapEvent(mapRef, {}, handleZoomChange, [
     "onZoom_changed"
   ]);
+  watchPostEffectForGMapEvent(mapRef, {}, handleDrag, [
+    "onDrag"
+  ]);
   return { registerFitVeiw, setFitView };
 };
 const useMapFitView = (props) => {
@@ -2955,6 +2980,16 @@ const isPlace = (place) => {
   return place.lng !== void 0 && place.lat !== void 0;
 };
 const sleep = (milliSeconds) => new Promise((resolve) => setTimeout(resolve, milliSeconds));
+const assertPoint = (point) => {
+  if (Array.isArray(point) && point.length === 2 && typeof point[0] === "number" && typeof point[1] === "number")
+    return;
+  throw new Error(`Assertion Error: expect type [number, number], actual is ${point}`);
+};
+const assertAngle = (angle) => {
+  if (typeof angle === "number" || typeof angle === "undefined")
+    return;
+  throw new Error(`Assertion Error: expect type number | undefined, actual is ${angle}`);
+};
 class SingleGeoWatch {
   constructor(option) {
     __publicField(this, "id", 0);
@@ -3858,7 +3893,8 @@ const DEFAULT_PLACE_NAME = "当前位置";
 const DEFAULT_ZOOM = 8;
 const READY_ZOOM = 17;
 const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlaceMap2(props, {
-  emit
+  emit,
+  slots
 }) {
   var _a, _b;
   const {
@@ -4041,7 +4077,9 @@ const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlac
         "center": centerPoint.value,
         "zoom": zoomRef.value,
         "touchZoomCenter": true,
-        "mapRef": setMap
+        "mapRef": setMap,
+        "fallback": slots.fallback,
+        "loading": slots.loading
       }
     }, [!geoLoading.value && !geoError.value && Vue.h(PassengerCircle, {
       "attrs": {
@@ -4074,7 +4112,12 @@ const useAmapGeometry = () => {
       return void 0;
     return AMap.GeometryUtil.distance(from, to);
   };
-  return { apiMapDistance };
+  const apiMapDistanceToLine = (from, line) => {
+    if (payload.status !== Status.SUCCESS)
+      return void 0;
+    return AMap.GeometryUtil.distanceToLine(from, line);
+  };
+  return { apiMapDistance, apiMapDistanceToLine };
 };
 const useGmapGeometry = () => {
   const payload = useMapSupplier();
@@ -4083,7 +4126,12 @@ const useGmapGeometry = () => {
       return void 0;
     return google.maps.geometry.spherical.computeDistanceBetween(vec2lnglat(from), vec2lnglat(to));
   };
-  return { apiMapDistance };
+  const apiMapDistanceToLine = (from, line) => {
+    if (payload.status !== Status.SUCCESS)
+      return void 0;
+    return 0;
+  };
+  return { apiMapDistance, apiMapDistanceToLine };
 };
 const useMapGeometry = () => {
   const { supplier } = useMapSupplier();
@@ -4535,6 +4583,7 @@ const SectionDriverStartService = defineSetup(function SectionDriverStartService
     const {
       from: fromPlace,
       carPosition,
+      carAngle,
       passengerPosition,
       renderTitle,
       registerOverlay
@@ -4566,31 +4615,37 @@ const SectionDriverStartService = defineSetup(function SectionDriverStartService
         "to": from,
         "render": ({
           path,
+          angle,
           distance,
           duration
-        }) => [Vue.h(DrivingLine, {
-          "attrs": {
-            "path": path
-          }
-        }), Vue.h(TaxiCar, {
-          "attrs": {
-            "position": carPosition,
-            "title": renderTitle({
-              distance,
-              duration
-            }),
-            "registerOverlay": registerOverlay
-          }
-        }), Vue.h(KeyedFitView, {
-          "attrs": {
-            "registerOverlay": registerOverlay,
-            "fitViewKey": JSON.stringify(carPosition)
-          }
-        })]
+        }) => {
+          spaceLog("angleDifference", "carPosition, routeAngle, driverAngle = ", carPosition, angle, carAngle);
+          return [Vue.h(DrivingLine, {
+            "attrs": {
+              "path": path
+            }
+          }), Vue.h(TaxiCar, {
+            "attrs": {
+              "position": carPosition,
+              "angle": angle,
+              "title": renderTitle({
+                distance,
+                duration
+              }),
+              "registerOverlay": registerOverlay
+            }
+          }), Vue.h(KeyedFitView, {
+            "attrs": {
+              "registerOverlay": registerOverlay,
+              "fitViewKey": JSON.stringify(carPosition)
+            }
+          })];
+        }
       }
     }) : [Vue.h(TaxiCar, {
       "attrs": {
         "position": carPosition,
+        "angle": carAngle,
         "title": renderTitle({
           distance: carDistance,
           duration: carDurationWithinMinDistance(carDistance)
@@ -4704,6 +4759,7 @@ const SectionDriverArrived = defineSetup(function SectionDriverArrived2(props) {
     const {
       from: fromPlace,
       carPosition,
+      carAngle,
       passengerPosition,
       title,
       registerOverlay
@@ -4731,6 +4787,7 @@ const SectionDriverArrived = defineSetup(function SectionDriverArrived2(props) {
     }), !!carPosition && [Vue.h(TaxiCar, {
       "attrs": {
         "position": carPosition,
+        "angle": carAngle,
         "title": title,
         "registerOverlay": registerOverlay
       }
@@ -4763,6 +4820,7 @@ const SectionInService = defineSetup(function SectionInService2(props) {
     const {
       to: toPlace,
       carPosition,
+      carAngle,
       renderTitle,
       registerOverlay
     } = props;
@@ -4777,31 +4835,37 @@ const SectionInService = defineSetup(function SectionInService2(props) {
         "to": to,
         "render": ({
           path,
+          angle,
           distance,
           duration
-        }) => [Vue.h(DrivingLine, {
-          "attrs": {
-            "path": path
-          }
-        }), Vue.h(TaxiCar, {
-          "attrs": {
-            "position": carPosition,
-            "title": renderTitle({
-              distance,
-              duration
-            }),
-            "registerOverlay": registerOverlay
-          }
-        }), Vue.h(KeyedFitView, {
-          "attrs": {
-            "registerOverlay": registerOverlay,
-            "fitViewKey": JSON.stringify(carPosition)
-          }
-        })]
+        }) => {
+          spaceLog("angleDifference", "carPosition, routeAngle, driverAngle = ", carPosition, angle, carAngle);
+          return [Vue.h(DrivingLine, {
+            "attrs": {
+              "path": path
+            }
+          }), Vue.h(TaxiCar, {
+            "attrs": {
+              "position": carPosition,
+              "angle": angle,
+              "title": renderTitle({
+                distance,
+                duration
+              }),
+              "registerOverlay": registerOverlay
+            }
+          }), Vue.h(KeyedFitView, {
+            "attrs": {
+              "registerOverlay": registerOverlay,
+              "fitViewKey": JSON.stringify(carPosition)
+            }
+          })];
+        }
       }
     }) : [Vue.h(TaxiCar, {
       "attrs": {
         "position": carPosition,
+        "angle": carAngle,
         "title": renderTitle({
           distance: carDistance,
           duration: carDurationWithinMinDistance(carDistance)
@@ -4980,12 +5044,26 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
     geoError
   } = useGeoLocation();
   const carPositionRef = Vue.ref();
+  const carAngleRef = Vue.ref();
+  const {
+    toGcj02
+  } = useMapGCJ02();
   Vue.watch(() => props.driverStatus, (status, _, onCleanup) => {
     if (!STATUS_NEED_CAR_POSITION.includes(status))
       return;
-    const timer = setInterval(() => {
-      getDriverPosition().then((pos) => carPositionRef.value = pos);
-    }, interval);
+    const update = () => {
+      getDriverPosition().then(async ({
+        position,
+        angle
+      }) => {
+        assertPoint(position);
+        assertAngle(angle);
+        carPositionRef.value = position ? await toGcj02(position) : void 0;
+        carAngleRef.value = angle;
+      });
+    };
+    const timer = setInterval(update, interval);
+    update();
     onCleanup(() => clearInterval(timer));
   }, {
     immediate: true
@@ -5000,6 +5078,7 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
       driverArrivedTitle
     } = props;
     const carPosition = carPositionRef.value;
+    const carAngle = carAngleRef.value;
     const touchEnable = !["canceled", "canceling", "completed", "endService", "waitpay", "waitRechargePay", "refund", "rechargePayed", "payed"].includes(driverStatus);
     const passengerPosition = geoError.value ? void 0 : geoPosition.value;
     return Vue.h(HeycarMap, {
@@ -5035,6 +5114,7 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
       "attrs": {
         "from": from,
         "carPosition": carPosition,
+        "carAngle": carAngle,
         "passengerPosition": passengerPosition,
         "renderTitle": renderStartSerivceTitle,
         "registerOverlay": registerOverlay
@@ -5050,6 +5130,7 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
       "attrs": {
         "to": to,
         "carPosition": carPosition,
+        "carAngle": carAngle,
         "renderTitle": renderInServiceTitle,
         "registerOverlay": registerOverlay
       }
@@ -5057,6 +5138,7 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
       "attrs": {
         "from": from,
         "carPosition": carPosition,
+        "carAngle": carAngle,
         "passengerPosition": passengerPosition,
         "title": driverArrivedTitle,
         "registerOverlay": registerOverlay

package/dist/index.js

@@ -2423,7 +2423,8 @@ const amapComputeHeading = (from, to, map) => {
   const { x: xFrom, y: yFrom } = map.lngLatToContainer(from);
   const { x: xTo, y: yTo } = map.lngLatToContainer(to);
   const theta = Math.atan2(yFrom - yTo, xTo - xFrom);
-  return (Math.PI / 2 - theta) / Math.PI * 180;
+  const signedAngle = (Math.PI / 2 - theta) / Math.PI * 180;
+  return signedAngle < 0 ? 360 + signedAngle : signedAngle;
 };
 const useAmapAngle = (props) => {
   return computed(() => {
@@ -2546,11 +2547,20 @@ const useAmapFitView = (props) => {
     },
     setFitView
   };
-  const handleMoveEndOrZomEnd = () => {
+  const handleDraggingOrZoomChange = () => {
+    if (!autoFitTimeout || !timer)
+      return;
+    clearTimeout(timer);
+    timer = void 0;
+  };
+  const handleMoveEndOrZomEnd = (eventName) => {
+    spaceLog("useAmapFitViewHandleMoveEndOrZomEnd", "eventName = ", eventName);
     if (!autoFitTimeout)
       return;
-    if (timer)
+    if (timer) {
       clearTimeout(timer);
+      timer = void 0;
+    }
     timer = setTimeout(() => {
       timer = void 0;
       setFitView();
@@ -2560,7 +2570,13 @@ const useAmapFitView = (props) => {
     mapRef,
     {},
     handleMoveEndOrZomEnd,
-    ["onDragEnd"]
+    ["onDragEnd", "onZoomEnd"]
+  );
+  watchPostEffectForAMapEvent(
+    mapRef,
+    {},
+    handleDraggingOrZoomChange,
+    ["onDragging", "onZoomchange"]
   );
   return { registerFitVeiw, setFitView };
 };
@@ -2605,6 +2621,12 @@ const useGmapFitView = (props) => {
     },
     setFitView
   };
+  const handleDrag = () => {
+    if (!autoFitTimeout || !timer)
+      return;
+    clearTimeout(timer);
+    timer = void 0;
+  };
   const handleMoveEnd = () => {
     const eventSource = getMapEvnetSource();
     if (!autoFitTimeout || eventSource !== "user")
@@ -2623,6 +2645,9 @@ const useGmapFitView = (props) => {
   watchPostEffectForGMapEvent(mapRef, {}, handleZoomChange, [
     "onZoom_changed"
   ]);
+  watchPostEffectForGMapEvent(mapRef, {}, handleDrag, [
+    "onDrag"
+  ]);
   return { registerFitVeiw, setFitView };
 };
 const useMapFitView = (props) => {
@@ -2953,6 +2978,16 @@ const isPlace = (place) => {
   return place.lng !== void 0 && place.lat !== void 0;
 };
 const sleep = (milliSeconds) => new Promise((resolve) => setTimeout(resolve, milliSeconds));
+const assertPoint = (point) => {
+  if (Array.isArray(point) && point.length === 2 && typeof point[0] === "number" && typeof point[1] === "number")
+    return;
+  throw new Error(`Assertion Error: expect type [number, number], actual is ${point}`);
+};
+const assertAngle = (angle) => {
+  if (typeof angle === "number" || typeof angle === "undefined")
+    return;
+  throw new Error(`Assertion Error: expect type number | undefined, actual is ${angle}`);
+};
 class SingleGeoWatch {
   constructor(option) {
     __publicField(this, "id", 0);
@@ -3856,7 +3891,8 @@ const DEFAULT_PLACE_NAME = "当前位置";
 const DEFAULT_ZOOM = 8;
 const READY_ZOOM = 17;
 const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlaceMap2(props, {
-  emit
+  emit,
+  slots
 }) {
   var _a, _b;
   const {
@@ -4039,7 +4075,9 @@ const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlac
         "center": centerPoint.value,
         "zoom": zoomRef.value,
         "touchZoomCenter": true,
-        "mapRef": setMap
+        "mapRef": setMap,
+        "fallback": slots.fallback,
+        "loading": slots.loading
       }
     }, [!geoLoading.value && !geoError.value && h(PassengerCircle, {
       "attrs": {
@@ -4072,7 +4110,12 @@ const useAmapGeometry = () => {
       return void 0;
     return AMap.GeometryUtil.distance(from, to);
   };
-  return { apiMapDistance };
+  const apiMapDistanceToLine = (from, line) => {
+    if (payload.status !== Status.SUCCESS)
+      return void 0;
+    return AMap.GeometryUtil.distanceToLine(from, line);
+  };
+  return { apiMapDistance, apiMapDistanceToLine };
 };
 const useGmapGeometry = () => {
   const payload = useMapSupplier();
@@ -4081,7 +4124,12 @@ const useGmapGeometry = () => {
       return void 0;
     return google.maps.geometry.spherical.computeDistanceBetween(vec2lnglat(from), vec2lnglat(to));
   };
-  return { apiMapDistance };
+  const apiMapDistanceToLine = (from, line) => {
+    if (payload.status !== Status.SUCCESS)
+      return void 0;
+    return 0;
+  };
+  return { apiMapDistance, apiMapDistanceToLine };
 };
 const useMapGeometry = () => {
   const { supplier } = useMapSupplier();
@@ -4533,6 +4581,7 @@ const SectionDriverStartService = defineSetup(function SectionDriverStartService
     const {
       from: fromPlace,
       carPosition,
+      carAngle,
       passengerPosition,
       renderTitle,
       registerOverlay
@@ -4564,31 +4613,37 @@ const SectionDriverStartService = defineSetup(function SectionDriverStartService
         "to": from,
         "render": ({
           path,
+          angle,
           distance,
           duration
-        }) => [h(DrivingLine, {
-          "attrs": {
-            "path": path
-          }
-        }), h(TaxiCar, {
-          "attrs": {
-            "position": carPosition,
-            "title": renderTitle({
-              distance,
-              duration
-            }),
-            "registerOverlay": registerOverlay
-          }
-        }), h(KeyedFitView, {
-          "attrs": {
-            "registerOverlay": registerOverlay,
-            "fitViewKey": JSON.stringify(carPosition)
-          }
-        })]
+        }) => {
+          spaceLog("angleDifference", "carPosition, routeAngle, driverAngle = ", carPosition, angle, carAngle);
+          return [h(DrivingLine, {
+            "attrs": {
+              "path": path
+            }
+          }), h(TaxiCar, {
+            "attrs": {
+              "position": carPosition,
+              "angle": angle,
+              "title": renderTitle({
+                distance,
+                duration
+              }),
+              "registerOverlay": registerOverlay
+            }
+          }), h(KeyedFitView, {
+            "attrs": {
+              "registerOverlay": registerOverlay,
+              "fitViewKey": JSON.stringify(carPosition)
+            }
+          })];
+        }
       }
     }) : [h(TaxiCar, {
       "attrs": {
         "position": carPosition,
+        "angle": carAngle,
         "title": renderTitle({
           distance: carDistance,
           duration: carDurationWithinMinDistance(carDistance)
@@ -4702,6 +4757,7 @@ const SectionDriverArrived = defineSetup(function SectionDriverArrived2(props) {
     const {
       from: fromPlace,
       carPosition,
+      carAngle,
       passengerPosition,
       title,
       registerOverlay
@@ -4729,6 +4785,7 @@ const SectionDriverArrived = defineSetup(function SectionDriverArrived2(props) {
     }), !!carPosition && [h(TaxiCar, {
       "attrs": {
         "position": carPosition,
+        "angle": carAngle,
         "title": title,
         "registerOverlay": registerOverlay
       }
@@ -4761,6 +4818,7 @@ const SectionInService = defineSetup(function SectionInService2(props) {
     const {
       to: toPlace,
       carPosition,
+      carAngle,
       renderTitle,
       registerOverlay
     } = props;
@@ -4775,31 +4833,37 @@ const SectionInService = defineSetup(function SectionInService2(props) {
         "to": to,
         "render": ({
           path,
+          angle,
           distance,
           duration
-        }) => [h(DrivingLine, {
-          "attrs": {
-            "path": path
-          }
-        }), h(TaxiCar, {
-          "attrs": {
-            "position": carPosition,
-            "title": renderTitle({
-              distance,
-              duration
-            }),
-            "registerOverlay": registerOverlay
-          }
-        }), h(KeyedFitView, {
-          "attrs": {
-            "registerOverlay": registerOverlay,
-            "fitViewKey": JSON.stringify(carPosition)
-          }
-        })]
+        }) => {
+          spaceLog("angleDifference", "carPosition, routeAngle, driverAngle = ", carPosition, angle, carAngle);
+          return [h(DrivingLine, {
+            "attrs": {
+              "path": path
+            }
+          }), h(TaxiCar, {
+            "attrs": {
+              "position": carPosition,
+              "angle": angle,
+              "title": renderTitle({
+                distance,
+                duration
+              }),
+              "registerOverlay": registerOverlay
+            }
+          }), h(KeyedFitView, {
+            "attrs": {
+              "registerOverlay": registerOverlay,
+              "fitViewKey": JSON.stringify(carPosition)
+            }
+          })];
+        }
       }
     }) : [h(TaxiCar, {
       "attrs": {
         "position": carPosition,
+        "angle": carAngle,
         "title": renderTitle({
           distance: carDistance,
           duration: carDurationWithinMinDistance(carDistance)
@@ -4978,12 +5042,26 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
     geoError
   } = useGeoLocation();
   const carPositionRef = ref();
+  const carAngleRef = ref();
+  const {
+    toGcj02
+  } = useMapGCJ02();
   watch(() => props.driverStatus, (status, _, onCleanup) => {
     if (!STATUS_NEED_CAR_POSITION.includes(status))
       return;
-    const timer = setInterval(() => {
-      getDriverPosition().then((pos) => carPositionRef.value = pos);
-    }, interval);
+    const update = () => {
+      getDriverPosition().then(async ({
+        position,
+        angle
+      }) => {
+        assertPoint(position);
+        assertAngle(angle);
+        carPositionRef.value = position ? await toGcj02(position) : void 0;
+        carAngleRef.value = angle;
+      });
+    };
+    const timer = setInterval(update, interval);
+    update();
     onCleanup(() => clearInterval(timer));
   }, {
     immediate: true
@@ -4998,6 +5076,7 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
       driverArrivedTitle
     } = props;
     const carPosition = carPositionRef.value;
+    const carAngle = carAngleRef.value;
     const touchEnable = !["canceled", "canceling", "completed", "endService", "waitpay", "waitRechargePay", "refund", "rechargePayed", "payed"].includes(driverStatus);
     const passengerPosition = geoError.value ? void 0 : geoPosition.value;
     return h(HeycarMap, {
@@ -5033,6 +5112,7 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
       "attrs": {
         "from": from,
         "carPosition": carPosition,
+        "carAngle": carAngle,
         "passengerPosition": passengerPosition,
         "renderTitle": renderStartSerivceTitle,
         "registerOverlay": registerOverlay
@@ -5048,6 +5128,7 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
       "attrs": {
         "to": to,
         "carPosition": carPosition,
+        "carAngle": carAngle,
         "renderTitle": renderInServiceTitle,
         "registerOverlay": registerOverlay
       }
@@ -5055,6 +5136,7 @@ const BusinessTaxiServiceMap = defineLagecySetup(function BusinessTaxiServiceMap
       "attrs": {
         "from": from,
         "carPosition": carPosition,
+        "carAngle": carAngle,
         "passengerPosition": passengerPosition,
         "title": driverArrivedTitle,
         "registerOverlay": registerOverlay

package/dist/utils/helper.d.ts

@@ -1,3 +1,5 @@
 import type { Place } from "../types/interface";
 export declare const isPlace: (place: Partial<Place>) => place is Place;
 export declare const sleep: (milliSeconds: number) => Promise<unknown>;
+export declare const assertPoint: (point: unknown) => void;
+export declare const assertAngle: (angle: unknown) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@heycar/heycars-map",
-  "version": "0.5.4",
+  "version": "0.5.6",
   "type": "module",
   "scripts": {
     "dev": "vite -c vite.config.dev.ts",

package/todo.md

@@ -2,10 +2,8 @@ https://dawchihliou.github.io/articles/building-custom-google-maps-marker-react-
 
 2. Google 地址名称太长
 3. 高德地图加载期间出现大量的请求
-4. 做完其他事情进入首页，变成了获取定位失败，但其实 gps 是 ok 的，因为刷新页面是有点位的
-5. map 的两个 slot loading 和 error slot 没有生效
-6. 企业微信如果关闭定位，会不停的跳 geoError 事件
-7. 司机已接单页面，title 倒计时, 1s 更新一次 title，引起 walking 接口 1s 触发
+4. map 的两个 slot loading 和 error slot 没有生效
+5. 企业微信如果关闭定位，会不停的跳 geoError 事件
 
 缩放问题
 
@@ -94,3 +92,8 @@ https://dawchihliou.github.io/articles/building-custom-google-maps-marker-react-
 
 - 5375
 - 4946
+
+  0.5.5
+
+- 4977
+- 5381