fix: 修改分享页地图拖拽后线路不显示完

zjk

2026-06-26 8ec9fd34cb3e5cf486c91ee442fe1a77c84bb98b

fix: 修改分享页地图拖拽后线路不显示完

 src/robotaxi/pages/share-trip/hooks/use-map-viewport.ts

@@ -46,6 +46,8 @@
const ACTIVE_TRIP_VIEWPORT_SYNC_INTERVAL_MS = 600;
const ACTIVE_TRIP_VIEWPORT_SYNC_ANIMATION_MS = 300;
const ACTIVE_TRIP_VIEWPORT_SAFE_X_MARGIN_RATIO = 0.08;
const USER_GESTURE_HOLD_MS = 8000;
const USER_GESTURE_CAUSED_BY = new Set(["gesture", "drag", "scale"]);

const buildSiteViewportPoint = (site: any) => {
    if (!site?.latitude || !site?.longitude) {
@@ -155,6 +157,17 @@
            : mapBottomPadding;
        return computeAdaptiveBottomPadding(points, basePadding);
    }, [mapBottomPadding]);

    /**
     * 用户手势拖拽/缩放地图后，暂停一段时间的自动视口同步，避免地图被立刻抢回。
     */
    const handleRegionChange = useCallback((event: any) => {
        const causedBy = String(event?.causedBy || event?.detail?.causedBy || "").toLowerCase();
        if (!USER_GESTURE_CAUSED_BY.has(causedBy)) {
            return;
        }
        holdDynamicScale(USER_GESTURE_HOLD_MS);
    }, [holdDynamicScale]);

    const updateMapViewportPadding = useCallback(() => {
        Taro.nextTick(() => {
@@ -379,6 +392,25 @@
        });
    }, [computeBottomPadding, holdDynamicScale, mapBottomPadding]);

    /**
     * 接驾中/行程中复位地图时，优先把整条线路完整放回屏幕，而不是只把中心点拉回车辆位置。
     */
    const resetActiveTripViewportToRoute = useCallback(() => {
        const { pickupSite, dropoffSite } = resolveViewportSites();
        const { points } = buildViewportPayload("route", pickupSite, dropoffSite);
        if (points.length === 0) {
            return;
        }
        lastActiveTripViewportSyncAtRef.current = Date.now();
        updateViewportByPayload("route", points);
    }, [
        deps.endSite,
        deps.routePoints,
        deps.startSite,
        deps.tripStatus,
        updateViewportByPayload
    ]);

    const syncActiveTripViewportToVehicle = useCallback(() => {
        if (![TripStatus.VehicleApproaching, TripStatus.InService].includes(deps.tripStatus)) {
            return;
@@ -449,24 +481,7 @@
                if (!hasLatitudeDelta && !hasLongitudeDelta) {
                    return;
                }
                lastActiveTripViewportSyncAtRef.current = Date.now();
                const mapCtx = Taro.createMapContext("map");
                mapCtx.moveToLocation({
                    latitude: desiredCenterLatitude,
                    longitude: desiredCenterLongitude
                });
                if (activeTripViewportSyncTimerRef.current) {
                    clearTimeout(activeTripViewportSyncTimerRef.current);
                }
                activeTripViewportSyncTimerRef.current = setTimeout(() => {
                    if (typeof deps.setLatitude === "function") {
                        deps.setLatitude(desiredCenterLatitude);
                    }
                    if (typeof deps.setLongitude === "function") {
                        deps.setLongitude(desiredCenterLongitude);
                    }
                    activeTripViewportSyncTimerRef.current = null;
                }, ACTIVE_TRIP_VIEWPORT_SYNC_ANIMATION_MS);
                resetActiveTripViewportToRoute();
            })
            .finally(() => {
                activeTripViewportSyncingRef.current = false;
@@ -479,7 +494,8 @@
        ensureMapRect,
        getDynamicScaleHoldUntil,
        getMapCenterLocation,
        getMapRegion
        getMapRegion,
        resetActiveTripViewportToRoute
    ]);

    useEffect(() => {
@@ -618,6 +634,7 @@
        mapBottomPadding,
        updateMapViewportPadding,
        resolveSafeTopInset,
        computeBottomPadding
        computeBottomPadding,
        handleRegionChange
    };
}

 src/robotaxi/pages/share-trip/index.tsx

@@ -1,5 +1,5 @@
import Taro, { useDidShow, useRouter } from '@tarojs/taro';
import { useEffect, useMemo, useRef, useState } from 'react';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import './index.less';
import useMapMarkers from './hooks/use-map-markers';
import useVehicleTracking from './hooks/use-vehicle-tracking';
@@ -209,7 +209,11 @@
    updateVehicleLocationThrottled,
  });

  const { mapScale, updateMapViewportPadding } = useMapViewport({
  const {
    mapScale,
    updateMapViewportPadding,
    handleRegionChange: handleViewportRegionChange
  } = useMapViewport({
    tripStatus,
    statusRule,
    routePoints,
@@ -274,6 +278,10 @@
    longitude,
    latitude,
  }); // Android 地图浮层
  const handleMapRegionChange = useCallback((event: any) => {
    handleViewportRegionChange(event);
    handleRegionChange(event);
  }, [handleRegionChange, handleViewportRegionChange]);
  const markersWithRouteSummary = useMemo(() => {
    if (!routeSummaryMarker) {
      return markers;
@@ -371,7 +379,7 @@
      polyline={polyline}
      routeDuration={displayRouteDuration}
      renderMapOverlays={renderMapOverlays}
      handleMapRegionChange={handleRegionChange}
      handleMapRegionChange={handleMapRegionChange}
      handleMapPolylineTap={handlePolylineTap}
      handleMapTap={handleMapTap}
      goHome={goHome}