refactor(station): 简化站点缩放聚焦逻辑

ai-coding

2026-06-13 11f3274b1d4048bf2df5f3a0282ab951513ac23d

refactor(station): 简化站点缩放聚焦逻辑

Co-Authored-By: '廖芳' <liaof@xiaopeng.com>

 src/robotaxi/hooks/use-station-scale-focus.ts

@@ -1,4 +1,4 @@
import { useMemo, useState, useEffect, useRef, useCallback } from 'react';
import { useMemo, useState, useRef, useCallback } from 'react';
import { GEOFENCE_STATION_FILL_COLOR, GEOFENCE_STATION_STROKE_COLOR } from '../constants/geofence';

type Deps = {
@@ -14,8 +14,8 @@
 * 场站站点地图围栏展示聚焦控制 Hook。
 * 
 * 职责：
 * 1. 当选中“场站内”的站点，并且发生地图放大操作使得缩放达到 17~18 级（即 >= 16.9）时，去掉运营区围栏蒙层，仅展示场站围栏。
 * 2. 移出场站时、选择其他站点时，或缩放比例小于 17 时，恢复展示所有围栏。
 * 1. 当地图放大操作使得缩放达到 17~18 级（即 >= 16.9）时，去掉运营区围栏蒙层，仅展示场站围栏。
 * 2. 缩放比例小于 17 时，恢复展示所有围栏。
 */
export default function useStationScaleFocus({ currentSite, originalPolygons, originalFencePolylines }: Deps) {
  const isStationSite = useMemo(() => {
@@ -26,21 +26,7 @@
  const [shouldFocusFence, setShouldFocusFence] = useState(false);
  const lastScaleRef = useRef<number | undefined>(undefined);

  useEffect(() => {
    if (!isStationSite) {
      setShouldFocusFence(false);
    } else {
      // 刚选中场站时，重置一次参照物，避免拿上一次旧的值去对比
      lastScaleRef.current = undefined;
    }
  }, [isStationSite]);

  const handleScaleChange = useCallback((scale: number) => {
    if (!isStationSite) {
      lastScaleRef.current = scale;
      return;
    }

    if (lastScaleRef.current !== undefined) {
      if (Math.abs(scale - lastScaleRef.current) > 0.001) {
        // 如果是有效放大操作（规避细微浮点误差），并且达到了 17 级及以上
@@ -58,14 +44,14 @@
      return;
    }
    lastScaleRef.current = scale;
  }, [isStationSite]);
  }, []);

  // 根据当前是否选中场站站点且满足聚焦条件时，过滤围栏数据
  // 根据缩放级别过滤围栏数据
  const displayPolygons = useMemo(() => {
    if (!shouldFocusFence) {
      return originalPolygons;
    }
    // 选中场站且满足条件时，仅保留场站的围栏
    // 放大到 17+ 级时，仅保留场站的围栏
    return originalPolygons.filter(polygon => polygon.fillColor === GEOFENCE_STATION_FILL_COLOR);
  }, [shouldFocusFence, originalPolygons]);

@@ -73,7 +59,7 @@
    if (!shouldFocusFence) {
      return originalFencePolylines;
    }
    // 选中场站且满足条件时，仅保留场站的虚线边框
    // 放大到 17+ 级时，仅保留场站的虚线边框
    return originalFencePolylines.filter(polyline => polyline.color === GEOFENCE_STATION_STROKE_COLOR);
  }, [shouldFocusFence, originalFencePolylines]);