fix: smooth globe rotation - only rescale points on zoom change
pointRadius was recalculated on every controls change event (including rotation frames), causing 50k+ points to re-render each frame. Now only triggers when altitude changes >5%, keeping rotation smooth. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
2c0cb7a67a
commit
8c2d75380d
1 changed files with 11 additions and 12 deletions
|
|
@ -209,19 +209,19 @@ 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;
|
||||
// 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);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue