shishengliang/lingniu-vehicle-ingest
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf(monitor): throttle selected map centering

Browse Source
This commit is contained in:
lingniu
2026-07-16 10:35:52 +08:00
parent cf9e2a9803
commit e0a5ba6f5d
1 changed files with 9 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
vehicle-data-platform/apps/web/src/v2/map/FleetMap.tsx
View File

@@ -25,6 +25,7 @@ const MAX_POINT_MOVE_DURATION_MS = 120_000;
const MIN_POINT_MOVE_FRAME_MS = 100; const MIN_POINT_MOVE_FRAME_MS = 100;
const MAX_POINT_MOVE_FRAME_MS = 220; const MAX_POINT_MOVE_FRAME_MS = 220;
const POINT_MOVE_EPSILON = 0.000003; const POINT_MOVE_EPSILON = 0.000003;
const MAP_FOLLOW_FRAME_MS = 500;
const MAP_INTERACTION_PAN_DURATION_MS = 650; const MAP_INTERACTION_PAN_DURATION_MS = 650;
const clusterVisualCache = new Map<number, { diameter: number; url: string }>(); const clusterVisualCache = new Map<number, { diameter: number; url: string }>();
@@ -516,6 +517,8 @@ export function FleetMap({ vehicles, selectedVin, onSelect, monitorMap, onSelect
let startedAt: number | undefined; let startedAt: number | undefined;
const longestMoveDuration = Math.max(...[...movingIDs].map((id) => moveDurationByID.get(id) ?? DEFAULT_POINT_MOVE_DURATION_MS)); const longestMoveDuration = Math.max(...[...movingIDs].map((id) => moveDurationByID.get(id) ?? DEFAULT_POINT_MOVE_DURATION_MS));
const frameMs = pointMoveFrameMs(data.length, motions.length); const frameMs = pointMoveFrameMs(data.length, motions.length);
let lastFollowAt = 0;
let selectedFollowComplete = false;
const paint = (elapsed: number) => { const paint = (elapsed: number) => {
advancePointMotions(motions, elapsed); advancePointMotions(motions, elapsed);
mass.setData(data); mass.setData(data);
@@ -526,7 +529,12 @@ export function FleetMap({ vehicles, selectedVin, onSelect, monitorMap, onSelect
if (label) label.position = motion.point.lnglat; if (label) label.position = motion.point.lnglat;
if (selectedVinRef.current === motion.point.id) { if (selectedVinRef.current === motion.point.id) {
selectionRef.current?.setPosition?.(motion.point.lnglat); selectionRef.current?.setPosition?.(motion.point.lnglat);
if (followSelectedRef.current) mapRef.current?.setCenter?.(motion.point.lnglat); const motionComplete = elapsed >= motion.durationMs;
if (followSelectedRef.current && !selectedFollowComplete && (elapsed - lastFollowAt >= MAP_FOLLOW_FRAME_MS || motionComplete)) {
mapRef.current?.setCenter?.(motion.point.lnglat);
lastFollowAt = elapsed;
selectedFollowComplete = motionComplete;
}
} }
} }
}; };