@heycar/heycars-map 2.7.2 → 2.8.1

package/dist/v2/utils/compatibleDrivingRoute.js

@@ -1,5 +1,24 @@
 import { apiGaodeDirectionDriving } from "../api/gaodeDirectionDriving.js";
 import { apiGoogleDirections } from "../api/googleDirections.js";
+import { amapTraffic2trafficStatus, stringifyPoint } from "./transform.js";
+const amapTmcs2trafficJams = (tmcs) => {
+  const trafficJams = {};
+  let prevStatus = "UNKNOWN";
+  for (const tmc of tmcs) {
+    const { path } = tmc;
+    if (!path)
+      continue;
+    for (const { lng, lat } of path) {
+      const status = amapTraffic2trafficStatus(tmc.status);
+      trafficJams[stringifyPoint([lng, lat])] = {
+        before: prevStatus,
+        after: status
+      };
+      prevStatus = status;
+    }
+  }
+  return trafficJams;
+};
 function amapJsApiDrivingRoute(from, to, amapDriving) {
   return new Promise((resolve, reject) => {
     amapDriving.search(
@@ -7,9 +26,11 @@ function amapJsApiDrivingRoute(from, to, amapDriving) {
       AMap.LngLat.from(to),
       { waypoints: [] },
       (status, result) => {
+        const trafficJams = {};
         switch (status) {
           case "complete": {
             let path = [];
+            let tmcs = [];
             const drivingResult = result;
             const routeSteps = [];
             const firstRoute = drivingResult.routes[0];
@@ -19,18 +40,21 @@ function amapJsApiDrivingRoute(from, to, amapDriving) {
               const basicStep = step;
               const stepPath = basicStep.path.map(({ lng, lat }) => [lng, lat]);
               path = path.concat(stepPath);
+              tmcs = tmcs.concat(basicStep.tmcs);
               routeSteps.push({
                 path: basicStep.path.map(({ lng, lat }) => [lng, lat]),
                 duration: basicStep.time,
                 distance: basicStep.distance
               });
             }
+            Object.assign(trafficJams, amapTmcs2trafficJams(tmcs));
             return resolve({
               path,
               distance: firstRoute.distance,
               duration: firstRoute.time,
               tolls: firstRoute.tolls,
-              steps: routeSteps
+              steps: routeSteps,
+              trafficJams
             });
           }
           case "no_data":
@@ -48,6 +72,7 @@ async function gaodeServiceApiDrivingRoute(from, to, proxyUrl) {
     origin: [from],
     destination: to
   });
+  const trafficJams = {};
   switch (status) {
     case "complete": {
       let path = [];
@@ -59,6 +84,7 @@ async function gaodeServiceApiDrivingRoute(from, to, proxyUrl) {
         const basicStep = step;
         const stepPath = basicStep.path.map(({ lng, lat }) => [lng, lat]);
         path = path.concat(stepPath);
+        Object.assign(trafficJams, amapTmcs2trafficJams(basicStep.tmcs));
         routeSteps.push({
           path: basicStep.path.map(({ lng, lat }) => [lng, lat]),
           duration: basicStep.time,
@@ -70,7 +96,8 @@ async function gaodeServiceApiDrivingRoute(from, to, proxyUrl) {
         distance: firstRoute.distance,
         duration: firstRoute.time,
         tolls: firstRoute.tolls,
-        steps: routeSteps
+        steps: routeSteps,
+        trafficJams
       };
     }
     case "no_data":

package/dist/v2/utils/log.js

@@ -1,6 +1,6 @@
 const availableLogKeys = /* @__PURE__ */ new Set();
 const pkgName = "@heycar/heycars-map";
-const pkgVersion = "2.7.2";
+const pkgVersion = "2.8.1";
 const isEnableLog = (name) => {
   const searchParam = new URLSearchParams(location.search);
   return searchParam.has(`log-${name}`);

package/dist/v2/utils/transform.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="google.maps" />
-import type { LngLatLiterial, Place, Point, TrackPoint, Zone } from "../types/interface";
+import type { LngLatLiterial, Place, Point, TrackPoint, TrafficStatus, Zone } from "../types/interface";
 import type { AlipayMyGetLocationSuccessResponse } from "../types/my";
 import type { WxGetLocationSuccessResponse } from "../types/wx";
 import { BRWOSER_PLATFORM } from "./platform";
@@ -9,6 +9,7 @@ export declare const lnglat2point: ({ lng, lat }: {
     lng: number;
     lat: number;
 }) => Point;
+export declare const stringifyPoint: (p: Point) => `${number},${number}`;
 export declare const googlePointsStringify: (points: Point[]) => string;
 export declare const gaodePointsStringify: (points: Point[]) => string;
 export interface AsteriskItem {
@@ -24,6 +25,7 @@ export declare const pipeAsync: <P extends any[]>(fn?: ((...args: P) => any) | u
 export declare const pipeDefer: <P extends any[], R>(fn: (...args: P) => R) => (...args: P) => Promise<R>;
 export declare const pipeOnlyLastEffect: <P extends any[], R>(fn: (...arg: P) => Promise<R>) => (...args: P) => Promise<R>;
 export declare const isPlaceEqual: (p1: Place, p2?: Place) => boolean;
+export declare const isPointExactEqual: (p1: Point, p2?: Point) => boolean;
 export declare const isPointEqual: (p1: Point, p2?: Point) => boolean;
 export declare const isGeoPositionEqual: (p1: GeolocationPosition, p2?: GeolocationPosition) => boolean;
 export declare const isZoneEqual: (z1: Zone, z2?: Zone) => boolean;
@@ -45,4 +47,5 @@ export declare const maybeFunctionToFunction: <T>(value: T) => MaybeFunctionToFu
 export declare const signal2promise: (signal?: AbortSignal) => Promise<any>;
 export declare const googleEncodedPolyline2googleLatLng: (value: string) => google.maps.LatLng[];
 export declare const gaodePolyline2amapLngLat: (value: string) => AMap.LngLat[];
+export declare const amapTraffic2trafficStatus: (value?: AMap.TMC["status"]) => TrafficStatus;
 export {};

package/dist/v2/utils/transform.js

@@ -42,8 +42,9 @@ const vec2lnglat = ([lng, lat]) => ({
   lat: Number(lat)
 });
 const lnglat2point = ({ lng, lat }) => [lng, lat];
+const stringifyPoint = (p) => `${p[0]},${p[1]}`;
 const googlePointsStringify = (points) => points.map(([lng, lat]) => `${lat},${lng}`).join("|");
-const gaodePointsStringify = (points) => points.map(([lng, lat]) => `${lng},${lat}`).join(";");
+const gaodePointsStringify = (points) => points.map(stringifyPoint).join(";");
 const decodeAsterisk = (encodedValue) => {
   const result = [];
   const tokens = encodedValue.split("*");
@@ -95,6 +96,9 @@ const pipeOnlyLastEffect = (fn) => {
 const isPlaceEqual = (p1, p2) => {
   return isAccuryEqual(p1.lng, p2 == null ? void 0 : p2.lng) && isAccuryEqual(p1.lat, p2 == null ? void 0 : p2.lat);
 };
+const isPointExactEqual = (p1, p2) => {
+  return p1[0] === (p2 == null ? void 0 : p2[0]) && p1[1] === (p2 == null ? void 0 : p2[1]);
+};
 const isPointEqual = (p1, p2) => {
   return isAccuryEqual(p1[0], p2 == null ? void 0 : p2[0]) && isAccuryEqual(p1[1], p2 == null ? void 0 : p2[1]);
 };
@@ -287,10 +291,26 @@ const gaodePolyline2amapLngLat = (value) => {
     return { lng, lat };
   });
 };
+const amapTraffic2trafficStatus = (value) => {
+  switch (value) {
+    case void 0:
+    case "未知":
+      return "UNKNOWN";
+    case "畅通":
+      return "NORMAL";
+    case "缓行":
+      return "SLOW";
+    case "拥堵":
+      return "TRAFFIC_JAM";
+    case "严重拥堵":
+      return "HEAVY_TRAFFIC_JAM";
+  }
+};
 export {
   alipayMyGetLocationError2GeolocationPositionErrorCode,
   alipayMyGetLocationSuccessResponse2GeolocationPosition,
   amapPlaceName2DisplayName,
+  amapTraffic2trafficStatus,
   businessCandidatesToAdsorptionPlace,
   combineHandler,
   decodeAsterisk,
@@ -306,6 +326,7 @@ export {
   isGeoPositionEqual,
   isPlaceEqual,
   isPointEqual,
+  isPointExactEqual,
   isZoneEqual,
   lnglat2point,
   maybeFunctionToFunction,
@@ -316,6 +337,7 @@ export {
   property2emitEventName,
   property2mapEventName,
   signal2promise,
+  stringifyPoint,
   trackPoints2amapGraspRoadPoints,
   vec2lnglat,
   wxGetLocationSuccessResponse2GeolocationPosition

package/dist/v3/api/gaodeDirectionDriving.js

@@ -1,6 +1,6 @@
 import { gaodePointsStringify, gaodePolyline2amapLngLat } from "../utils/transform.js";
 import { createTypeError, isProxyServiceError } from "../utils/typeChecking.js";
-const GAODE_POLYLINE_REGEX = /^(?:\d*\.\d+,\d*\.\d+)?(?:;\d*\.\d+,\d*\.\d+)*$/;
+const GAODE_POLYLINE_REGEX = /^(?:-?\d*\.\d+,-?\d*\.\d+)?(?:;-?\d*\.\d+,-?\d*\.\d+)*$/;
 var GaodeDirectionStatus = /* @__PURE__ */ ((GaodeDirectionStatus2) => {
   GaodeDirectionStatus2["SUCCESS"] = "1";
   GaodeDirectionStatus2["FAIL"] = "0";
@@ -35,10 +35,19 @@ function isGaodeDirectionBasicStep(value) {
 function isGaodeEmptyValue(value) {
   return Array.isArray(value) && value.length === 0;
 }
-function assertGaodoDirectionDrivingStep(value) {
-  if (isGaodeDirectionBasicStep(value))
+function isAmapTmcStatus(value) {
+  return value === "未知" || value === "畅通" || value === "缓行" || value === "拥堵" || value === "严重拥堵";
+}
+function assertGaodeDirectionDrivingTmc(value) {
+  if (typeof value === "object" && value !== null && "status" in value && isAmapTmcStatus(value.status) && "polyline" in value && isGaodeDirectionPolyline(value.polyline))
     return;
-  throw createTypeError("GaodeDirectionDrivingStep", value);
+  throw createTypeError("GaodeDirectionDrivingTmc", value);
+}
+function assertGaodoDirectionDrivingStep(value) {
+  if (!isGaodeDirectionBasicStep(value) || !("tmcs" in value) || !Array.isArray(value.tmcs)) {
+    throw createTypeError("GaodeDirectionDrivingStep", value);
+  }
+  value.tmcs.forEach(assertGaodeDirectionDrivingTmc);
 }
 function assertGaodeDirectionDrivingRoutePath(value) {
   if (!isGaodeMeasurableObject(value) || !("tolls" in value) || !isGaodeNumberableString(value.tolls) || !("steps" in value) || !Array.isArray(value.steps)) {
@@ -63,15 +72,21 @@ function assertGaodeDirectionDrivingResponse(value) {
     throw createTypeError("GaodeDirectionDrivingResponse", value, detail);
   }
 }
+function gaodeDirectionDrivingTmc2amapTmc(gaodeTmc) {
+  const { status, polyline } = gaodeTmc;
+  const path = gaodePolyline2amapLngLat(String(polyline));
+  return { status, path };
+}
 function gaodeDirectionDrivingRoute2amapDrivingRoute(gaodeRoute) {
   return gaodeRoute.paths.map((routePath) => {
     const { distance, duration, tolls, steps: godeDirectionSteps } = routePath;
     const steps = godeDirectionSteps.map((directionStep) => {
-      const { distance: distance2, duration: duration2, polyline } = directionStep;
+      const { distance: distance2, duration: duration2, polyline, tmcs } = directionStep;
       return {
         distance: Number(distance2),
         time: Number(duration2),
-        path: gaodePolyline2amapLngLat(String(polyline))
+        path: gaodePolyline2amapLngLat(String(polyline)),
+        tmcs: tmcs.map(gaodeDirectionDrivingTmc2amapTmc)
       };
     });
     return {

package/dist/v3/business-components/BusinessQuotingMap/BusinessQuotingMap.js

@@ -9,10 +9,10 @@ import { defineSetup, defineLagecySetup } from "../../types/helper.js";
 import { generateCreateElementV2PropsOn } from "../../utils/compare.js";
 import { place2point, pipeDefer } from "../../utils/transform.js";
 import { toCoordinatePlaceType } from "../../utils/typeChecking.js";
-import { DrivingLine } from "../DrivingLine/DrivingLine.js";
 import { DrivingRoute } from "../DrivingRoute/DrivingRoute.js";
 import { FitViewOnce, createFittableRegisterOverlay } from "../FitView/FitView.js";
 import { StartEndPoint } from "../StartEndPoint/StartEndPoint.js";
+import { TrafficDrivingLine } from "../TrafficDrivingLine/TrafficDrivingLine.js";
 const BUSINESS_QUOTING_FITVIEW_PANDING = [26, 26, 19, 26];
 const BusinessQuotingMapInner = defineSetup("BusinessQuotingMapInner", function(props, {
   emit,
@@ -83,9 +83,11 @@ const BusinessQuotingMapInner = defineSetup("BusinessQuotingMapInner", function(
           path,
           distance,
           duration,
-          tolls
-        }) => [createVNode(DrivingLine, {
-          "path": path
+          tolls,
+          trafficJams
+        }) => [createVNode(TrafficDrivingLine, {
+          "path": path,
+          "trafficJams": trafficJams
         }, null), createVNode(StartEndPoint, {
           "type": "end",
           "registerOverlay": fittableRegistryOverlay,

package/dist/v3/business-components/BusinessTaxiServiceMap/BusinessTaxiServiceSection.js

@@ -14,12 +14,13 @@ import { ConditionalFittablePassengerCircle } from "../PassengerCircle/Passenger
 import { PlaceCircle } from "../PlaceCircle/PlaceCircle.js";
 import { StartEndPoint } from "../StartEndPoint/StartEndPoint.js";
 import { TaxiCar } from "../TaxiCar/TaxiCar.js";
+import { TrafficDrivingLine } from "../TrafficDrivingLine/TrafficDrivingLine.js";
 import { WalkingLine } from "../WalkingLine/WalkingLine.js";
 import { WalkingRoute } from "../WalkingRoute/WalkingRoute.js";
 import { WaveCircle } from "../WaveCircle/WaveCircle.js";
 const IS_ENABLE_AUXILIARY_GRASP_ROAD = apiGetAuxiliaryGrapStatus();
 const PASSENGER_DISTANCE_MAX = 2e3;
-const PASSENGER_DISTANCE_MIN = 10;
+const PASSENGER_DISTANCE_MIN = 20;
 const AUTO_FIT_VIEW_INTERVAL = IS_ENABLE_AUXILIARY_GRASP_ROAD ? 24 * 3600 * 1e3 : 15e3;
 const carDurationWithinMinDistance = (distance) => Math.floor(distance / 5);
 const SectionDispatching = defineSetup("SectionDispatching", function(props) {
@@ -77,9 +78,11 @@ const SectionConfirmed = defineSetup("SectionConfirmed", function(props) {
       "to": to,
       "from": from,
       "render": ({
-        path
-      }) => createVNode(DrivingLine, {
-        "path": path
+        path,
+        trafficJams
+      }) => createVNode(TrafficDrivingLine, {
+        "path": path,
+        "trafficJams": trafficJams
       }, null)
     }, null), createVNode(ConditionalFittablePassengerCircle, {
       "position": passengerPosition,
@@ -162,11 +165,13 @@ const SectionDriverStartService = defineSetup("SectionDriverStartService", funct
         path,
         angle,
         distance,
-        duration
+        duration,
+        trafficJams
       }) => {
         var _a;
-        return [createVNode(DrivingLine, {
-          "path": path
+        return [createVNode(TrafficDrivingLine, {
+          "path": path,
+          "trafficJams": trafficJams
         }, null), createVNode(TaxiCar, {
           "position": (_a = path[0]) != null ? _a : carPosition,
           "angle": angle != null ? angle : carAngle,
@@ -233,9 +238,11 @@ const SectionBookDispatched = defineSetup("SectionBookDispatched", function(prop
       "to": to,
       "from": from,
       "render": ({
-        path
-      }) => createVNode(DrivingLine, {
-        "path": path
+        path,
+        trafficJams
+      }) => createVNode(TrafficDrivingLine, {
+        "path": path,
+        "trafficJams": trafficJams
       }, null)
     }, null), !!passengerPosition && passengerDistance && passengerDistance < PASSENGER_DISTANCE_MAX && passengerDistance > PASSENGER_DISTANCE_MIN && createVNode(WalkingRoute, {
       "from": passengerPosition,
@@ -370,11 +377,13 @@ const SectionInService = defineSetup("SectionInService", function(props) {
         path,
         angle,
         distance,
-        duration
+        duration,
+        trafficJams
       }) => {
         var _a;
-        return [createVNode(DrivingLine, {
-          "path": path
+        return [createVNode(TrafficDrivingLine, {
+          "path": path,
+          "trafficJams": trafficJams
         }, null), createVNode(TaxiCar, {
           "position": (_a = path[0]) != null ? _a : carPosition,
           "angle": angle != null ? angle : carAngle,
@@ -479,7 +488,7 @@ const SectionEndService = defineSetup("SectionEndService", function(props) {
         path
       }) => createVNode(DrivingLine, {
         "path": path,
-        "done": true
+        "status": "DONE"
       }, null)
     }, null), createVNode(StartEndPoint, {
       "type": "start",

package/dist/v3/business-components/DrivingLine/DrivingLine.d.ts

@@ -1,6 +1,9 @@
+import type { TrafficStatus } from "../../types/interface";
+type DrivingLineStatus = TrafficStatus | "DONE";
 export interface DrivingLineProps {
-    done?: boolean;
+    status?: DrivingLineStatus;
     path: [number, number][];
+    lineCap?: AMap.LineSharedOptions["lineCap"];
 }
 export declare const ADrivingLine: import("vue-demi").DefineComponent<import("vue-demi").ComponentObjectPropsOptions<DrivingLineProps>, 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<DrivingLineProps, Required<DrivingLineProps>>, never, import("vue-demi").PublicProps, DrivingLineProps, DrivingLineProps, import("vue-demi").SlotsType<{} & {
     default?: import("../../demi-polyfill").Slot | undefined;
@@ -11,3 +14,4 @@ export declare const GDrivingLine: import("vue-demi").DefineComponent<import("vu
 export declare const DrivingLine: import("vue-demi").DefineComponent<import("vue-demi").ComponentObjectPropsOptions<DrivingLineProps>, 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<DrivingLineProps, Required<DrivingLineProps>>, never, import("vue-demi").PublicProps, DrivingLineProps, DrivingLineProps, import("vue-demi").SlotsType<{} & {
     default?: import("../../demi-polyfill").Slot | undefined;
 }>>;
+export {};

package/dist/v3/business-components/DrivingLine/DrivingLine.js

@@ -7,24 +7,55 @@ import { createElement } from "../../demi-polyfill/demi-polyfill.js";
 import { useMapSupplier } from "../../hooks/useMapSupplier.js";
 import { defineSetup } from "../../types/helper.js";
 import { vec2lnglat } from "../../utils/transform.js";
+const trafficInnerColors = {
+  // UNKNOWN: "#487BF4",
+  UNKNOWN: "#00C875",
+  NORMAL: "#00C875",
+  SLOW: "#F9D100",
+  TRAFFIC_JAM: "#EB0E33",
+  HEAVY_TRAFFIC_JAM: "#99001A",
+  DONE: "#96B2CA"
+};
+const trafficOuterColors = {
+  // UNKNOWN: "#4175F1",
+  UNKNOWN: "#008559",
+  NORMAL: "#008559",
+  SLOW: "#B29400",
+  TRAFFIC_JAM: "#990D24",
+  HEAVY_TRAFFIC_JAM: "#4D000D",
+  DONE: "#7693AF"
+};
+const trafficBorderColors = {
+  // UNKNOWN: "#6C95F5",
+  UNKNOWN: "#00C875",
+  NORMAL: "#00C875",
+  SLOW: "#F9D100",
+  TRAFFIC_JAM: "#EB0E33",
+  HEAVY_TRAFFIC_JAM: "#99001A",
+  DONE: "#7693AF"
+};
 const ADrivingLine = defineSetup("ADrivingLine", function(props) {
   return () => {
+    const {
+      status = "UNKNOWN",
+      lineCap = "round"
+    } = props;
     const vw = window.innerWidth * 0.01;
     const strokeWidth = 1 * vw;
     const borderWidth = 0.13 * vw;
     const dirWidth = 0.24 * vw;
     const outlineWidth = 0.4 * vw;
     const dashLength = 0.3 * vw;
-    const strokeColorInner = props.done ? "#96B2CA" : "#487BF4";
-    const strokeColorOuter = props.done ? "#7693AF" : "#4175F1";
-    const strokeColorBorder = props.done ? "#7693AF" : "#6C95F5";
+    const strokeColorInner = trafficInnerColors[status];
+    const strokeColorOuter = trafficOuterColors[status];
+    const strokeColorBorder = trafficBorderColors[status];
     return createVNode("div", null, [createVNode(AmapPolyline, {
       "path": props.path,
       "strokeWeight": strokeWidth + 2 * borderWidth + 2 * outlineWidth,
       "strokeOpacity": 1,
       "strokeColor": strokeColorOuter,
       "lineJoin": "round",
-      "lineCap": "round",
+      "lineCap": lineCap,
       "zIndex": ZINDEX_LINE_LAYER
     }, null), createVNode(AmapPolyline, {
       "path": props.path,
@@ -32,7 +63,7 @@ const ADrivingLine = defineSetup("ADrivingLine", function(props) {
       "strokeOpacity": 1,
       "strokeColor": strokeColorBorder,
       "lineJoin": "round",
-      "lineCap": "round",
+      "lineCap": lineCap,
       "strokeStyle": "dashed",
       "strokeDasharray": [dashLength, dashLength * 0.5],
       "zIndex": ZINDEX_LINE_LAYER
@@ -42,7 +73,7 @@ const ADrivingLine = defineSetup("ADrivingLine", function(props) {
       "strokeOpacity": 1,
       "strokeColor": strokeColorInner,
       "lineJoin": "round",
-      "lineCap": "round",
+      "lineCap": lineCap,
       "zIndex": ZINDEX_LINE_LAYER
     }, null), createVNode(AmapPolyline, {
       "showDir": true,
@@ -51,7 +82,7 @@ const ADrivingLine = defineSetup("ADrivingLine", function(props) {
       "strokeOpacity": 1,
       "strokeColor": "transparent",
       "lineJoin": "round",
-      "lineCap": "round",
+      "lineCap": lineCap,
       "zIndex": ZINDEX_LINE_LAYER
     }, null)]);
   };
@@ -59,15 +90,18 @@ const ADrivingLine = defineSetup("ADrivingLine", function(props) {
 const GDrivingLine = defineSetup("GDrivingLine", function(props) {
   const pathRef = computed(() => props.path.map(vec2lnglat));
   return () => {
+    const {
+      status = "UNKNOWN"
+    } = props;
     const vw = window.innerWidth * 0.01;
     const repeat = 10 * vw;
     const strokeWidth = 1.25 * vw * 0.65;
     const borderWidth = 0.175 * vw * 0.65;
     const dirStrokeWeight = 0.375 * vw * 0.65;
     const outlineWidth = 0.45 * vw * 0.65;
-    const strokeColorInner = props.done ? "#96B2CA" : "#487BF4";
-    const strokeColorOuter = props.done ? "#7693AF" : "#4175F1";
-    const strokeColorBorder = props.done ? "#7693AF" : "#6C95F5";
+    const strokeColorInner = trafficInnerColors[status];
+    const strokeColorOuter = trafficOuterColors[status];
+    const strokeColorBorder = trafficBorderColors[status];
     return createVNode("div", null, [createVNode(GmapPolyline, {
       "path": pathRef.value,
       "strokeWeight": strokeWidth + 2 * borderWidth + 2 * outlineWidth,

package/dist/v3/business-components/DrivingRoute/DrivingRoute.d.ts

@@ -1,12 +1,13 @@
 import { type VNodeChild } from "../../demi-polyfill";
 import { type UseDrivingRouteProps } from "../../hooks/useDrivingRoute";
-import type { Point } from "../../types/interface";
+import type { Point, TrafficJams } from "../../types/interface";
 export type DrivingRouteRenderProps = {
     path: Point[];
     angle?: number;
     distance: number;
     duration: number;
     tolls?: number;
+    trafficJams?: TrafficJams;
 };
 export interface DrivingRouteProps extends UseDrivingRouteProps {
     render?: (props: DrivingRouteRenderProps) => VNodeChild;

package/dist/v3/business-components/DrivingRoute/DrivingRoute.js

@@ -14,7 +14,8 @@ const ADrivingRoute = defineSetup("ADrivingRoute", function(props, {
     path,
     distance,
     duration,
-    tolls
+    tolls,
+    trafficJams
   } = toRefs(useADrivingRoute(props).route);
   const {
     angleRef
@@ -29,7 +30,8 @@ const ADrivingRoute = defineSetup("ADrivingRoute", function(props, {
       angle: angleRef,
       distance,
       duration,
-      tolls
+      tolls,
+      trafficJams
     }))]);
   };
 });

package/dist/v3/business-components/TrafficDrivingLine/TrafficDrivingLine.d.ts

@@ -0,0 +1,8 @@
+import type { Point, TrafficJams } from "../../types/interface";
+export interface TrafficDrivingLineProps {
+    path: Point[];
+    trafficJams?: TrafficJams;
+}
+export declare const TrafficDrivingLine: import("vue").DefineComponent<import("vue").ComponentObjectPropsOptions<TrafficDrivingLineProps>, 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<TrafficDrivingLineProps, Required<TrafficDrivingLineProps>>, never, import("vue").PublicProps, TrafficDrivingLineProps, TrafficDrivingLineProps, import("vue").SlotsType<{} & {
+    default?: import("../../demi-polyfill").Slot | undefined;
+}>>;

package/dist/v3/business-components/TrafficDrivingLine/TrafficDrivingLine.js

@@ -0,0 +1,115 @@
+import { createVNode } from "vue";
+import { defineSetup } from "../../types/helper.js";
+import { stringifyPoint, isPointExactEqual } from "../../utils/transform.js";
+import { DrivingLine } from "../DrivingLine/DrivingLine.js";
+const toHalfPath = (path, isFromStart = true) => {
+  if (path.length < 2)
+    return path;
+  const [[x0, y0], [x1, y1]] = path;
+  const mid = [(x0 + x1) / 2, (y0 + y1) / 2];
+  return isFromStart ? [[x0, y0], mid] : [mid, [x1, y1]];
+};
+const isSlowOrJam = (status) => {
+  return status === "SLOW" || status === "TRAFFIC_JAM" || status === "HEAVY_TRAFFIC_JAM";
+};
+const justifyFirstPointStatus = (firstPointStatus, secondPointBeforeStatus) => {
+  return (firstPointStatus === void 0 || firstPointStatus === "UNKNOWN") && !!secondPointBeforeStatus && secondPointBeforeStatus !== "UNKNOWN" ? secondPointBeforeStatus : firstPointStatus != null ? firstPointStatus : "UNKNOWN";
+};
+const createMulitpleLineByTrafficJams = (path, trafficJams) => {
+  var _a, _b, _c, _d;
+  if (!trafficJams)
+    return [{
+      path,
+      status: "UNKNOWN"
+    }];
+  const firstPoint = path[0];
+  if (!firstPoint)
+    return [];
+  const multipleLines = [];
+  let line = {
+    path: [firstPoint],
+    status: justifyFirstPointStatus((_a = trafficJams[stringifyPoint(firstPoint)]) == null ? void 0 : _a.after, (_b = trafficJams[stringifyPoint(path[1])]) == null ? void 0 : _b.before)
+  };
+  for (let idx = 1; idx < path.length; idx++) {
+    const point = path[idx];
+    const traffic = (_d = (_c = trafficJams[stringifyPoint(point)]) == null ? void 0 : _c.after) != null ? _d : "UNKNOWN";
+    if (!isPointExactEqual(point, path[idx - 1]))
+      line.path.push(point);
+    if (traffic === line.status)
+      continue;
+    multipleLines.push(line);
+    line = {
+      path: [point],
+      status: traffic
+    };
+  }
+  multipleLines.push(line);
+  return multipleLines;
+};
+const beautifyMultipleLines = (lines) => {
+  const max = lines.length - 1;
+  if (max === 0)
+    return [{
+      ...lines[0],
+      lineCap: "round"
+    }];
+  const totalPath = lines.flatMap((line) => line.path);
+  const totalLine = {
+    path: totalPath,
+    status: "NORMAL",
+    lineCap: "round"
+  };
+  const roundCoveredLines = [];
+  const buttCoveredLines = [];
+  for (const line of lines) {
+    const {
+      path,
+      status
+    } = line;
+    if (!isSlowOrJam(status))
+      continue;
+    buttCoveredLines.push({
+      status,
+      path,
+      lineCap: "butt"
+    });
+  }
+  const first = lines[0];
+  const last = lines[lines.length - 1];
+  const ignoredLine = {
+    status: first.status,
+    path: first.path.slice(0, 2),
+    lineCap: "butt"
+  };
+  if (isSlowOrJam(first.status))
+    roundCoveredLines.push({
+      status: first.status,
+      path: toHalfPath(first.path.slice(0, 2)),
+      lineCap: "round"
+    });
+  if (isSlowOrJam(last.status))
+    roundCoveredLines.push({
+      status: last.status,
+      path: toHalfPath(last.path.slice(-2), false),
+      lineCap: "round"
+    });
+  return [ignoredLine, totalLine, ...roundCoveredLines, ...buttCoveredLines];
+};
+const TrafficDrivingLine = defineSetup("TrafficDrivingLine", function(props) {
+  return () => {
+    const {
+      path,
+      trafficJams
+    } = props;
+    const multipleLines = createMulitpleLineByTrafficJams(path, trafficJams);
+    const beautifiedLines = beautifyMultipleLines(multipleLines);
+    return createVNode("div", null, [beautifiedLines.map((line) => createVNode(DrivingLine, {
+      "path": line.path,
+      "status": line.status,
+      "lineCap": line.lineCap
+    }, null))]);
+  };
+});
+export {
+  TrafficDrivingLine
+};

package/dist/v3/business-components/TrafficDrivingLine/index.d.ts

@@ -0,0 +1 @@
+export * from "./TrafficDrivingLine";

package/dist/v3/business-components/TrafficDrivingLine/index.js

@@ -0,0 +1,4 @@
+import { TrafficDrivingLine } from "./TrafficDrivingLine.js";
+export {
+  TrafficDrivingLine
+};