diff --git a/web/src/plugins/radio/RadioTab.tsx b/web/src/plugins/radio/RadioTab.tsx index 1a53a2c..6b2ee53 100644 --- a/web/src/plugins/radio/RadioTab.tsx +++ b/web/src/plugins/radio/RadioTab.tsx @@ -209,18 +209,18 @@ export default function RadioTab({ data }: { data: any }) { controls.autoRotateSpeed = 0.3; } - // Scale point radius based on zoom altitude so points don't overlap when zoomed in - let scaleRafId = 0; - const BASE_ALT = 2.0; // default altitude + // Scale point radius only when zoom (altitude) changes, not during rotation + let lastAlt = 2.0; + const BASE_ALT = 2.0; const onControlsChange = () => { - cancelAnimationFrame(scaleRafId); - scaleRafId = requestAnimationFrame(() => { - const alt = globe.pointOfView().altitude; - const scale = Math.max(0.1, alt / BASE_ALT); - globe.pointRadius((d: any) => { - const base = Math.max(0.12, Math.min(0.45, 0.06 + (d.size ?? 1) * 0.005)); - return base * scale; - }); + const alt = globe.pointOfView().altitude; + // Only recalc when altitude changed significantly (>5%) + if (Math.abs(alt - lastAlt) / lastAlt < 0.05) return; + lastAlt = alt; + const scale = Math.max(0.1, alt / BASE_ALT); + globe.pointRadius((d: any) => { + const base = Math.max(0.12, Math.min(0.45, 0.06 + (d.size ?? 1) * 0.005)); + return base * scale; }); }; controls.addEventListener('change', onControlsChange); @@ -245,7 +245,6 @@ export default function RadioTab({ data }: { data: any }) { return () => { controls.removeEventListener('change', onControlsChange); - cancelAnimationFrame(scaleRafId); el.removeEventListener('mousedown', onInteract); el.removeEventListener('touchstart', onInteract); el.removeEventListener('wheel', onInteract);