charts.layout

Imports name this capability’s declared dependencies, which fune builds next to it in your project; each one links to its page.

import { roundFloat } from "./math_round_float.ts";  ← from math.round-float ^1.0.0 · built alongside by fune
import type { Margins, PlotArea } from "./charts_layout_types.ts";

/** The rectangle left for data once the margins are taken off the chart. */
export function plotArea(width: number, height: number, margins: Margins): PlotArea {
  const { top, right, bottom, left } = margins;
  if (!(top >= 0 && right >= 0 && bottom >= 0 && left >= 0)) {
    throw new RangeError("margins must not be negative");
  }
  const w = width - left - right;
  const h = height - top - bottom;
  // A zero or negative plot would draw nothing, or draw everything flipped.
  if (!(w > 0 && h > 0)) {
    throw new RangeError(`margins leave no room to plot: ${width} x ${height} less margins is ${w} x ${h}`);
  }
  return { x: roundFloat(left, 2), y: roundFloat(top, 2), width: roundFloat(w, 2), height: roundFloat(h, 2) };
}

Imports name this capability’s declared dependencies, which fune builds next to it in your project; each one links to its page.

import { roundFloat } from "./math_round_float.ts";  ← from math.round-float ^1.0.0 · built alongside by fune
import type { LegendItem } from "./charts_layout_types.ts";

// Space between the swatch and its text.
const SWATCH_PADDING = 4;

/**
 * Legend items laid out left to right, wrapping onto a new row when the next
 * item would pass maxWidth. Text width is estimated from the number of
 * characters (Unicode code points) times charWidth: no font is measured, so
 * the answer is the same everywhere, and a caller with real metrics can pass
 * a charWidth to suit.
 */
export function legendRows(
  labels: readonly string[],
  maxWidth: number,
  charWidth: number,
  swatchSize: number,
  gap: number,
  rowHeight: number,
): readonly LegendItem[] {
  if (!(maxWidth > 0)) throw new RangeError(`maxWidth must be greater than zero, received ${maxWidth}`);
  if (!(charWidth >= 0 && swatchSize >= 0 && gap >= 0 && rowHeight >= 0)) {
    throw new RangeError("legend sizes must not be negative");
  }
  const items: LegendItem[] = [];
  let row = 0;
  let x = 0;
  let onRow = 0;
  for (const label of labels) {
    const width = swatchSize + SWATCH_PADDING + [...label].length * charWidth;
    // An item wider than the whole legend still gets a row of its own rather
    // than an empty row before it.
    if (onRow > 0 && x + width > maxWidth) {
      row += 1;
      x = 0;
      onRow = 0;
    }
    items.push({
      label,
      row,
      x: roundFloat(x, 2),
      y: roundFloat(row * rowHeight, 2),
      width: roundFloat(width, 2),
      textX: roundFloat(x + swatchSize + SWATCH_PADDING, 2),
    });
    x = x + width + gap;
    onRow += 1;
  }
  return items;
}

import type { LabelBox } from "./charts_layout_types.ts";

/**
 * Which labels to show so that none overlap: greedily, most important first
 * (higher priority, then earlier in the list), keeping a label only if it
 * clears every label already kept by at least `padding`. Touching is not
 * overlapping. The result is in input order.
 */
export function avoidCollisions(boxes: readonly LabelBox[], padding: number): readonly boolean[] {
  if (!(padding >= 0)) throw new RangeError(`padding must not be negative, received ${padding}`);
  for (const b of boxes) {
    if (!(b.width >= 0 && b.height >= 0)) throw new RangeError("label boxes must not have negative size");
  }
  const order = boxes.map((_, i) => i).sort((a, b) => boxes[b].priority - boxes[a].priority || a - b);
  const shown = boxes.map(() => false);
  const kept: LabelBox[] = [];
  for (const i of order) {
    const a = boxes[i];
    const clash = kept.some(
      (k) =>
        a.x < k.x + k.width + padding &&
        k.x < a.x + a.width + padding &&
        a.y < k.y + k.height + padding &&
        k.y < a.y + a.height + padding,
    );
    if (!clash) {
      kept.push(a);
      shown[i] = true;
    }
  }
  return shown;
}