fix(地图交互): 优化地图标记点击的跳转动画与样式

hejianhao

2026-03-31 2c6d671ca42c1218bcf9969f209a6138774f3b29

fix(地图交互): 优化地图标记点击的跳转动画与样式

- 修改乘客须知组件样式，为内容区域添加右侧内边距
- 将地图标记点击的跳转方式从 `moveToLocation` 改为直接更新经纬度
- 添加指针跳动动画，在动画期间隐藏工具提示，600ms后显示
- 统一优化两个页面的跳转逻辑，提升用户体验
- 修正运营区域页面中的标点符号格式

 src/pages/robotaxi/home/index.tsx

@@ -1219,15 +1219,21 @@
      // 忽略因调用 moveToLocation 引起的 region change，避免重复吸附计算
      shouldIgnoreRegionChange.current = true;
      
      const mapCtx = Taro.createMapContext('map');
      mapCtx.moveToLocation({
        latitude: targetMarker.latitude,
        longitude: targetMarker.longitude,
      });
      // 先隐藏tooltip，并触发指针跳动动画
      setShowToolTip(false);
      setBounce(true);
      
      // 直接更新经纬度实现跳转
      setLatitude(targetMarker.latitude);
      setLongitude(targetMarker.longitude);

      setIsAdsorbed(true);
      setCurrentSite(targetMarker);
      setShowToolTip(true);
      // 等待指针动画(600ms)结束后，再展示tooltip和吸附状态
      setTimeout(() => {
        setBounce(false);
        setIsAdsorbed(true);
        setCurrentSite(targetMarker);
        setShowToolTip(true);
      }, 600);
    }
  };


 src/robotaxi/pages/begin-route/components/css-folder/passenger-notice.less

@@ -37,6 +37,7 @@
            position: relative;
            margin-top: 34px;
            height: 342px;
            padding-right: 1em;

            .passenger-content-desc {
                height: 100%;
@@ -95,4 +96,4 @@
            color: #FFFFFF;
        }
    }
}
}

 src/robotaxi/pages/operating-area/index.tsx

@@ -446,15 +446,15 @@
            <View className="content-desc">
              <View className="desc-item">
                <Text className="index">1.</Text>
                <Text className="text">在运营时段可正常使用打车服务,非运营时段服务暂停</Text>
                <Text className="text">在运营时段可正常使用打车服务，非运营时段服务暂停</Text>
              </View>
              <View className="desc-item">
                <Text className="index">2.</Text>
                <Text className="text">各站点运营时间可能存在调整,实际运营情况请以页面实时展示为准</Text>
                <Text className="text">各站点运营时间可能存在调整，实际运营情况请以页面实时展示为准</Text>
              </View>
              <View className="desc-item">
                <Text className="index">3.</Text>
                <Text className="text">如有问题,请拨打客服热线xxxxxx</Text>
                <Text className="text">如有问题，请拨打客服热线xxxxxx</Text>
              </View>
            </View>
          </View>

 src/robotaxi/pages/select-map-site/index.tsx

@@ -462,17 +462,21 @@

    const targetMarker = markers.find(m => m.id === markerId);
    if (targetMarker) {
      const mapCtx = Taro.createMapContext('map');
      mapCtx.moveToLocation({
        latitude: targetMarker.latitude,
        longitude: targetMarker.longitude,
      });
      // 先隐藏tooltip，并触发指针跳动动画
      setShowToolTip(false);
      setBounce(true);

      setSelectedSite(targetMarker);
      setOutOfServiceRange(getOutOfServiceRange(isOperatingArea, targetMarker));
      // 直接更新经纬度实现跳转
      setLatitude(targetMarker.latitude);
      setLongitude(targetMarker.longitude);
      setShowToolTip(true);

      // 等待指针动画(600ms)结束后，再展示tooltip和吸附状态
      setTimeout(() => {
        setBounce(false);
        setSelectedSite(targetMarker);
        setOutOfServiceRange(getOutOfServiceRange(isOperatingArea, targetMarker));
        setShowToolTip(true);
      }, 600);
    }
  };