Answer the review: size the rings to the band the frame covers, and clear the text

The rings are centred on the Sun and the frame need not be. Sizing their step
from how far the frame reaches — 210 pc for a star at 190 with the camera 20 pc
back — gives 20 pc rings at 180 and 200, both outside a frame 19 pc deep, so a
view away from the Sun still had no ring on it and no ladder of labels either.
`distanceRings` now takes the span the frame covers rather than its far edge,
and the step is a fifth of that: 5 pc rings from 165 to 210 for the same view.

Measured in the app, centred on a star 187 pc out in the galactic plane: 4 ring
labels drawn 20 pc above the plane and 7 from 2 pc, against 1 and none before.

The clearance was a radius around the anchor, and a label is a line of text
hanging 135 px to one side of its anchor: at 0.065 NDC apart, past the radius,
"50 pc" printed inside "Alpha Centauri". It is now tested against the span the
name occupies, on the side it hangs, with the radius kept for the pair whose
text runs the other way.

Also from the review: the ladder in the clearance test was built at exactly the
constant it tests, so 1057 of 2000 camera poses would have decided it by float
round-trip error — the rungs now sit 0.02 either side of the rule. And two
comments that were wrong: a frame one step short of the survey edge does get its
callout, and CSS2DRenderer hides a label behind the camera rather than drawing
it at the page edge.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016jxMkwA2rbicdGxHosecYi

src/app/shared/format/scale-bar.spec.ts

@@ -28,30 +28,41 @@ describe('distanceRings', () => {
   // The opening view sits about 307 pc from the Sun: the rings the map always had, with the
   // survey edge at the fifth, and on out past the camera for the stars now drawn beyond it.
   it('reaches past the camera from the opening view', () => {
-    expect(distanceRings(307, 5, 250)).toEqual([50, 100, 150, 200, 250, 300, 350]);
+    expect(distanceRings(0, 307, 5, 250)).toEqual([50, 100, 150, 200, 250, 300, 350]);
   });
 
   it('closes in with the camera', () => {
-    expect(distanceRings(20, 5, 250)).toEqual([2, 4, 6, 8, 10, 12, 14, 16, 18, 20]);
-    expect(distanceRings(1, 5, 250)).toEqual([0.2, 0.4, 0.6, 0.8, 1]);
+    expect(distanceRings(0, 20, 5, 250)).toEqual([2, 4, 6, 8, 10, 12, 14, 16, 18, 20]);
+    expect(distanceRings(0, 1, 5, 250)).toEqual([0.2, 0.4, 0.6, 0.8, 1]);
   });
 
   // Near Mirfak the camera is 155 pc out; rounding the step down to 20 pc must not leave the
   // rings stopping at 100.
   it('covers the whole distance whatever the rounding', () => {
-    expect(distanceRings(155, 5, 250)).toEqual([20, 40, 60, 80, 100, 120, 140, 160]);
+    expect(distanceRings(0, 155, 5, 250)).toEqual([20, 40, 60, 80, 100, 120, 140, 160]);
+  });
+
+  // A star 190 pc out seen from 20 pc away: the frame is a band about 19 pc either side of it and
+  // the Sun is nowhere in it. Sized to the 210 pc it reaches, the step would be 20 pc and the
+  // nearest rings — 180 and 200 — would both miss the frame.
+  it('spaces the rings for a frame that does not hold the Sun', () => {
+    const radii = distanceRings(171, 210, 5, 250);
+
+    expect(radii).toEqual([170, 175, 180, 185, 190, 195, 200, 205, 210]);
+    expect(radii.some((radius) => Math.abs(radius - 190) < 19)).toBe(true);
   });
 
   it('marks the callout among rings the step does not land on', () => {
-    expect(distanceRings(1000, 5, 250)).toEqual([200, 250, 400, 600, 800, 1000]);
+    expect(distanceRings(0, 1000, 5, 250)).toEqual([200, 250, 400, 600, 800, 1000]);
   });
 
-  it('leaves the callout out when it is past the last ring', () => {
-    expect(distanceRings(100, 5, 250)).toEqual([20, 40, 60, 80, 100]);
+  it('leaves the callout out when it is past the last ring, or behind the first', () => {
+    expect(distanceRings(0, 100, 5, 250)).toEqual([20, 40, 60, 80, 100]);
+    expect(distanceRings(400, 440, 5, 250)).toEqual([400, 405, 410, 415, 420, 425, 430, 435, 440]);
   });
 
   it('draws no rings for a camera with no distance', () => {
-    expect(distanceRings(0, 5, 250)).toEqual([]);
+    expect(distanceRings(0, 0, 5, 250)).toEqual([]);
   });
 });
 

src/app/shared/format/scale-bar.ts

@@ -16,20 +16,31 @@ export function roundLengthAtMost(value: number): number | null {
 }
 
 /**
- * Rings at a round step of about `reach / count`, out to `reach` or just past it, plus `callout`
- * where it falls between the first ring and the last: the grid's own radii are round, and the one
- * radius that means something in its own right is marked whether the step lands on it or not. A
- * frame that does not reach it has no ring for it. Rounding the step down makes for `count` to
- * `ceil(2.5 × count)` rings, and the callout can add one: 5 to 14 for a count of 5.
+ * Rings across the span from `nearest` to `reach`, at a round step of about a `count`th of it,
+ * plus `callout` where it falls between the first ring and the last: the grid's own radii are
+ * round, and the one radius that means something in its own right is marked whether the step lands
+ * on it or not. A frame short of it by less than one step still gets it, since the last ring
+ * overshoots `reach`; one that stops well short does not.
+ *
+ * Two numbers rather than one because these rings are centred on a fixed point — the Sun — and a
+ * frame need not be. Looking at something 200 pc out from 20 pc away, what is on screen is a band
+ * 200 pc wide at its narrowest and nowhere near the Sun; a step sized to the whole 220 puts every
+ * ring off the frame. The span is what the frame covers, so the step is what it can resolve.
+ *
+ * Rounding the step down makes for `count` to `ceil(2.5 × count)` rings, and the callout can add
+ * one: 5 to 14 for a count of 5.
  */
-export function distanceRings(reach: number, count: number, callout: number): number[] {
-  const step = roundLengthAtMost(reach / count);
+export function distanceRings(nearest: number, reach: number, count: number, callout: number): number[] {
+  const step = roundLengthAtMost((reach - nearest) / count);
   if (step === null) {
     return [];
   }
+  // The ring just inside the near edge of the span, so the band is crossed rather than started at.
+  const first = Math.max(1, Math.floor(nearest / step));
+  const last = Math.ceil(reach / step);
   // `toPrecision` clears the binary noise of stepping by a tenth: 0.1 × 3 is 0.30000000000000004.
-  const radii = Array.from({ length: Math.ceil(reach / step) }, (_, index) => Number((step * (index + 1)).toPrecision(12)));
-  if (callout > step && callout < radii[radii.length - 1] && !radii.includes(callout)) {
+  const radii = Array.from({ length: last - first + 1 }, (_, index) => Number((step * (first + index)).toPrecision(12)));
+  if (callout > radii[0] && callout < radii[radii.length - 1] && !radii.includes(callout)) {
     radii.push(callout);
     radii.sort((a, b) => a - b);
   }