Re-tune render sizes for the world-space model: smaller defaults, wide low ends

The defaults were calibrated in the screen-fixed era; world-scaling renders
sizes at setting x k/kFit, so at the default label gate (2x fit) everything
read ~2x too big ("labels way too large even at the minimum"). Fit-zoom
normalizes layout scale away, so the fix belongs in sizes, not layout:
spreading nodes further apart in world units changes nothing at fit.

- Defaults: nodeSize 6 -> 4, arrowLength 5 -> 4, labelSize 12 -> 7.
- Clamps/slider ranges widened at the low end: nodeSize 1-14 (step 0.5),
  edgeWidth 0.25-4 (step 0.25), arrowLength 1-15 (step 0.5),
  labelSize 3-24 (step 0.5).
- GLOW_PAD 9 -> 6 (halo dominated small discs), REGION_LABEL_SIZE 18 -> 14.
- Tests updated for the new clamp bounds plus a low-end pass-through case
  (403/403). The saved render-settings.json still shadows defaults by
  design; the local copy was reset so the new defaults showed immediately.
This commit is contained in:
amosblomqvist
2026-09-13 07:26:22 +03:00
parent ecadededd9
commit c096854e87
4 changed files with 33 additions and 20 deletions
+2 -2
View File
@@ -117,7 +117,7 @@ const LABEL_LINE_HEIGHT = 1.3;
/** Zoom span (camera-ratio units) over which labels fade together. */
export const LABELS_FADE_SPAN = 0.5;
const GLOW_PAD = 9; // px the halo extends beyond the node disc (constant)
const GLOW_PAD = 6; // px the halo extends beyond the node disc (constant)
const GLOW_ALPHA = 0.45; // halo opacity at the disc edge, fading outward
const HOVER_FADE_MS = 180; // hover halo opacity fade length
const ZOOM_EASE_MS = 45; // wheel-zoom glide: exponential-ease time constant (~250ms per notch)
@@ -139,7 +139,7 @@ const HULL_FILL_LAYERS = [
] as const;
const HULL_STROKE_PAD = 14;
const HULL_CORNER_RADIUS = 9;
const REGION_LABEL_SIZE = 18;
const REGION_LABEL_SIZE = 14;
/** All "px" constants above are screen px AT FIT ZOOM. The renderer scales
* them into world units (÷ kFit) once per geometry build; camera zoom then
+8 -8
View File
@@ -500,33 +500,33 @@ export function GraphView() {
<div className="mt-1.5 flex flex-col gap-2 border-t pt-1.5">
<SettingSlider
label="Node size"
min={2}
min={1}
max={14}
step={1}
step={0.5}
value={settings.nodeSize}
onChange={(v) => changeSettings((cur) => ({ ...cur, nodeSize: v }))}
/>
<SettingSlider
label="Edge width"
min={0.5}
min={0.25}
max={4}
step={0.5}
step={0.25}
value={settings.edgeWidth}
onChange={(v) => changeSettings((cur) => ({ ...cur, edgeWidth: v }))}
/>
<SettingSlider
label="Arrowhead size"
min={2}
min={1}
max={15}
step={1}
step={0.5}
value={settings.arrowLength}
onChange={(v) => changeSettings((cur) => ({ ...cur, arrowLength: v }))}
/>
<SettingSlider
label="Label size"
min={6}
min={3}
max={24}
step={1}
step={0.5}
value={settings.labelSize}
onChange={(v) => changeSettings((cur) => ({ ...cur, labelSize: v }))}
/>