Function updateReadouts

examples/sampling/main.ts:135–161

(
  rawPointCount: number,
  xMax: number,
  controls: SamplingControls,
  zoom: { start: number; end: number } | null
)

};

const updateReadouts = (
  rawPointCount: number,
  xMax: number,
  controls: SamplingControls,
  zoom: { start: number; end: number } | null
): void => {
  const start = zoom?.start ?? 0;
  const end = zoom?.end ?? 100;
  const span = Math.max(0, Math.min(100, end) - Math.max(0, start));
  const spanFrac = Math.max(0, Math.min(1, span / 100));

  // With x = index and an explicit x-domain [0..xMax], visible points are ~ proportional to span.
  const visibleRaw = Math.max(2, Math.floor(rawPointCount * spanFrac));
  const target = controls.mode === 'none' ? visibleRaw : computeZoomAwareTarget(controls.threshold, spanFrac);
  const expectedRendered = controls.mode === 'none' ? visibleRaw : Math.min(visibleRaw, target);

  setText('totalPoints', formatInt(rawPointCount));
  setText('xDomain', `0 → ${formatInt(xMax)}`);
  setText('samplingResolved', controls.mode);
  setText('samplingThresholdResolved', formatInt(controls.threshold));

  setText('zoomRange', `${formatPercent(start)} → ${formatPercent(end)}`);
  setText('zoomSpan', `${formatPercent(span)} (of full span)`);
  setText('visibleRawPoints', formatInt(visibleRaw));
  setText('targetPoints', controls.mode === 'none' ? '— (sampling: none)' : formatInt(target));
  setText('expectedRendered', formatInt(expectedRendered));
};

async function main(): Promise<void> {
  const container = document.getElementById('chart');