@dou-ui/chart 0.0.0-stage → 0.1.0-alpha.0

package/dist/core/format.js

@@ -0,0 +1,151 @@
+import { stepDecimals } from "./scale.js";
+import { floorTime, parentUnit, startsUnit } from "./time.js";
+// src/core/format.ts
+var formatters = /* @__PURE__ */ new Map();
+function numberFormat(locale, options) {
+	const key = `n:${locale}:${JSON.stringify(options)}`;
+	let format = formatters.get(key);
+	if (!format) formatters.set(key, format = new Intl.NumberFormat(locale, options));
+	return format;
+}
+function dateFormat(locale, options) {
+	const key = `d:${locale}:${JSON.stringify(options)}`;
+	let format = formatters.get(key);
+	if (!format) formatters.set(key, format = new Intl.DateTimeFormat(locale, options));
+	return format;
+}
+/**
+* Formats the ticks of a number axis: as many decimals as the step needs,
+* and in short form ("12万", "1.2M") once the numbers get long, with as
+* many digits as it takes to tell the ticks apart. With `years`, whole
+* numbers under 10000 go without separators, so 2019 doesn't read "2,019".
+*/
+function numberTickFormat(locale, ticks, { years = false } = {}) {
+	const step = ticks.length > 1 ? Math.abs(ticks[1] - ticks[0]) : 0;
+	if (Math.max(0, ...ticks.map(Math.abs)) >= 1e5 && step >= 1e3) for (let digits = 2;; digits++) {
+		const compact = numberFormat(locale, {
+			notation: "compact",
+			maximumFractionDigits: digits
+		});
+		const texts = ticks.map((tick) => compact.format(tick));
+		if (new Set(texts).size === texts.length || digits >= 8) return (value) => compact.format(value);
+	}
+	let decimals = step > 0 ? stepDecimals(step) : 2;
+	for (const tick of ticks) {
+		const text = String(Number(tick.toPrecision(12)));
+		const dot = text.indexOf(".");
+		if (dot >= 0 && !text.includes("e")) decimals = Math.max(decimals, text.length - dot - 1);
+	}
+	const grouping = !(years && ticks.every((tick) => Number.isInteger(tick) && Math.abs(tick) < 1e4));
+	const plain = numberFormat(locale, {
+		maximumFractionDigits: decimals,
+		useGrouping: grouping
+	});
+	return (value) => plain.format(value);
+}
+/** Formats a value for reading in full (tooltips, the accessible summary). */
+function numberFormatFull(locale) {
+	const plain = numberFormat(locale, { maximumFractionDigits: 4 });
+	return (value) => plain.format(value);
+}
+var UNIT_FORMATS = {
+	second: {
+		hour: "2-digit",
+		minute: "2-digit",
+		second: "2-digit",
+		hourCycle: "h23"
+	},
+	minute: {
+		hour: "2-digit",
+		minute: "2-digit",
+		hourCycle: "h23"
+	},
+	hour: {
+		hour: "2-digit",
+		minute: "2-digit",
+		hourCycle: "h23"
+	},
+	day: { day: "numeric" },
+	week: { day: "numeric" },
+	month: { month: "short" },
+	year: { year: "numeric" }
+};
+var CONTEXT_FORMATS = {
+	minute: {
+		month: "short",
+		day: "numeric"
+	},
+	day: {
+		month: "short",
+		day: "numeric"
+	},
+	month: {
+		year: "numeric",
+		month: "short"
+	}
+};
+/**
+* Formats the ticks of a time axis. Most ticks show only the unit they
+* step by ("15日", "09:00"); the first one and the first in each bigger
+* unit say more ("11月2日", "2026年1月"), so the axis reads without a legend.
+* `previous` is the tick before, if any.
+*/
+function timeTickFormat(locale, interval) {
+	const unit = interval.unit;
+	const plain = dateFormat(locale, UNIT_FORMATS[unit]);
+	const parent = parentUnit(unit);
+	const context = CONTEXT_FORMATS[unit === "hour" || unit === "second" ? "minute" : unit === "week" ? "day" : unit];
+	const contextFormat = context ? dateFormat(locale, context) : null;
+	const dayOnly = unit === "hour" || unit === "minute" || unit === "second";
+	return (value, previous) => {
+		const startsParent = parent !== null && previous !== void 0 && floorTime(previous, parent).getTime() !== floorTime(value, parent).getTime();
+		if (contextFormat && (previous === void 0 || startsParent)) {
+			if (dayOnly && !startsUnit(value, "day")) return plain.format(value);
+			if (unit === "month" && startsParent) return dateFormat(locale, { year: "numeric" }).format(value);
+			return contextFormat.format(value);
+		}
+		return plain.format(value);
+	};
+}
+/** How fine a time must be written for points `step` ms apart: 0 days, 1 minutes, 2 seconds, 4 to 6 parts of a second. */
+var rank = (step) => step < 1e3 ? 3 + (step >= 100 ? 1 : step >= 10 ? 2 : 3) : step < 6e4 ? 2 : step < 864e5 ? 1 : 0;
+/**
+* How precisely a point in time needs writing: as precise as the time
+* itself (09:30 needs minutes), and as its neighbor is near (points 100ms
+* apart need tenths of a second, even on a whole second). `digits` are
+* the digits of a second, from 1 to 3.
+*/
+function timePrecision(value, gap = Number.POSITIVE_INFINITY) {
+	const date = new Date(value);
+	const ms = date.getMilliseconds();
+	const own = ms !== 0 ? rank(ms % 100 === 0 ? 100 : ms % 10 === 0 ? 10 : 1) : date.getSeconds() !== 0 ? 2 : date.getMinutes() !== 0 || date.getHours() !== 0 ? 1 : 0;
+	const r = Math.max(own, gap > 0 ? rank(gap) : 0);
+	return {
+		unit: r === 0 ? "day" : r === 1 ? "minute" : "second",
+		digits: r > 3 ? r - 3 : 0
+	};
+}
+/** Formats a point in time in full, as precise as `unit` (tooltips, the accessible summary). */
+function timeFormatFull(locale, unit = "day", digits = 0) {
+	const format = dateFormat(locale, unit === "year" ? { year: "numeric" } : unit === "month" ? {
+		year: "numeric",
+		month: "short"
+	} : unit === "day" || unit === "week" ? {
+		year: "numeric",
+		month: "short",
+		day: "numeric"
+	} : {
+		year: "numeric",
+		month: "short",
+		day: "numeric",
+		hour: "2-digit",
+		minute: "2-digit",
+		second: unit === "second" ? "2-digit" : void 0,
+		fractionalSecondDigits: unit === "second" && digits ? digits : void 0,
+		hourCycle: "h23"
+	});
+	return (value) => format.format(value);
+}
+export { numberFormatFull, numberTickFormat, timeFormatFull, timePrecision, timeTickFormat };
+
+//# sourceMappingURL=format.js.map

package/dist/core/format.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"format.js","names":[],"sources":["../../src/core/format.ts"],"sourcesContent":["import { stepDecimals } from './scale'\nimport { floorTime, parentUnit, startsUnit, type TimeInterval, type TimeUnit } from './time'\n\nconst formatters = new Map<string, Intl.NumberFormat | Intl.DateTimeFormat>()\n\nfunction numberFormat(locale: string, options: Intl.NumberFormatOptions): Intl.NumberFormat {\n  const key = `n:${locale}:${JSON.stringify(options)}`\n  let format = formatters.get(key) as Intl.NumberFormat | undefined\n  if (!format) formatters.set(key, (format = new Intl.NumberFormat(locale, options)))\n  return format\n}\n\nfunction dateFormat(locale: string, options: Intl.DateTimeFormatOptions): Intl.DateTimeFormat {\n  const key = `d:${locale}:${JSON.stringify(options)}`\n  let format = formatters.get(key) as Intl.DateTimeFormat | undefined\n  if (!format) formatters.set(key, (format = new Intl.DateTimeFormat(locale, options)))\n  return format\n}\n\n/**\n * Formats the ticks of a number axis: as many decimals as the step needs,\n * and in short form (\"12万\", \"1.2M\") once the numbers get long, with as\n * many digits as it takes to tell the ticks apart. With `years`, whole\n * numbers under 10000 go without separators, so 2019 doesn't read \"2,019\".\n */\nexport function numberTickFormat(\n  locale: string,\n  ticks: number[],\n  { years = false }: { years?: boolean } = {},\n): (value: number) => string {\n  const step = ticks.length > 1 ? Math.abs(ticks[1]! - ticks[0]!) : 0\n  const largest = Math.max(0, ...ticks.map(Math.abs))\n  if (largest >= 1e5 && step >= 1e3) {\n    for (let digits = 2; ; digits++) {\n      const compact = numberFormat(locale, { notation: 'compact', maximumFractionDigits: digits })\n      const texts = ticks.map((tick) => compact.format(tick))\n      if (new Set(texts).size === texts.length || digits >= 8)\n        return (value) => compact.format(value)\n    }\n  }\n  // enough decimals for every tick (explicit ticks need not be multiples of a power of ten)\n  let decimals = step > 0 ? stepDecimals(step) : 2\n  for (const tick of ticks) {\n    const text = String(Number(tick.toPrecision(12)))\n    const dot = text.indexOf('.')\n    if (dot >= 0 && !text.includes('e')) decimals = Math.max(decimals, text.length - dot - 1)\n  }\n  const grouping = !(years && ticks.every((tick) => Number.isInteger(tick) && Math.abs(tick) < 1e4))\n  const plain = numberFormat(locale, { maximumFractionDigits: decimals, useGrouping: grouping })\n  return (value) => plain.format(value)\n}\n\n/** Formats a value for reading in full (tooltips, the accessible summary). */\nexport function numberFormatFull(locale: string): (value: number) => string {\n  const plain = numberFormat(locale, { maximumFractionDigits: 4 })\n  return (value) => plain.format(value)\n}\n\nconst UNIT_FORMATS: Record<TimeUnit, Intl.DateTimeFormatOptions> = {\n  second: { hour: '2-digit', minute: '2-digit', second: '2-digit', hourCycle: 'h23' },\n  minute: { hour: '2-digit', minute: '2-digit', hourCycle: 'h23' },\n  hour: { hour: '2-digit', minute: '2-digit', hourCycle: 'h23' },\n  day: { day: 'numeric' },\n  week: { day: 'numeric' },\n  month: { month: 'short' },\n  year: { year: 'numeric' },\n}\n\nconst CONTEXT_FORMATS: Partial<Record<TimeUnit, Intl.DateTimeFormatOptions>> = {\n  // the first tick, and each new day / month / year, says which one it is\n  minute: { month: 'short', day: 'numeric' },\n  day: { month: 'short', day: 'numeric' },\n  month: { year: 'numeric', month: 'short' },\n}\n\n/**\n * Formats the ticks of a time axis. Most ticks show only the unit they\n * step by (\"15日\", \"09:00\"); the first one and the first in each bigger\n * unit say more (\"11月2日\", \"2026年1月\"), so the axis reads without a legend.\n * `previous` is the tick before, if any.\n */\nexport function timeTickFormat(\n  locale: string,\n  interval: TimeInterval,\n): (value: number, previous?: number) => string {\n  const unit = interval.unit\n  const plain = dateFormat(locale, UNIT_FORMATS[unit])\n  const parent = parentUnit(unit)\n  const contextUnit =\n    unit === 'hour' || unit === 'second' ? 'minute' : unit === 'week' ? 'day' : unit\n  const context = CONTEXT_FORMATS[contextUnit]\n  const contextFormat = context ? dateFormat(locale, context) : null\n  // hours and minutes: a new day is marked by its date alone\n  const dayOnly = unit === 'hour' || unit === 'minute' || unit === 'second'\n  return (value, previous) => {\n    const startsParent =\n      parent !== null &&\n      previous !== undefined &&\n      floorTime(previous, parent).getTime() !== floorTime(value, parent).getTime()\n    if (contextFormat && (previous === undefined || startsParent)) {\n      if (dayOnly && !startsUnit(value, 'day')) {\n        // the first tick of a time-of-day axis that doesn't start at midnight\n        return plain.format(value)\n      }\n      if (unit === 'month' && startsParent)\n        return dateFormat(locale, { year: 'numeric' }).format(value)\n      return contextFormat.format(value)\n    }\n    return plain.format(value)\n  }\n}\n\n/** How fine a time must be written for points `step` ms apart: 0 days, 1 minutes, 2 seconds, 4 to 6 parts of a second. */\nconst rank = (step: number) =>\n  step < 1000\n    ? 3 + (step >= 100 ? 1 : step >= 10 ? 2 : 3)\n    : step < 60e3\n      ? 2\n      : step < 86400e3\n        ? 1\n        : 0\n\n/**\n * How precisely a point in time needs writing: as precise as the time\n * itself (09:30 needs minutes), and as its neighbor is near (points 100ms\n * apart need tenths of a second, even on a whole second). `digits` are\n * the digits of a second, from 1 to 3.\n */\nexport function timePrecision(value: number, gap = Number.POSITIVE_INFINITY) {\n  const date = new Date(value)\n  const ms = date.getMilliseconds()\n  const own =\n    ms !== 0\n      ? rank(ms % 100 === 0 ? 100 : ms % 10 === 0 ? 10 : 1)\n      : date.getSeconds() !== 0\n        ? 2\n        : date.getMinutes() !== 0 || date.getHours() !== 0\n          ? 1\n          : 0\n  const r = Math.max(own, gap > 0 ? rank(gap) : 0)\n  const unit: TimeUnit = r === 0 ? 'day' : r === 1 ? 'minute' : 'second'\n  return { unit, digits: (r > 3 ? r - 3 : 0) as 0 | 1 | 2 | 3 }\n}\n\n/** Formats a point in time in full, as precise as `unit` (tooltips, the accessible summary). */\nexport function timeFormatFull(\n  locale: string,\n  unit: TimeUnit = 'day',\n  /** Digits of a second, for times less than a second apart. */\n  digits: 0 | 1 | 2 | 3 = 0,\n): (value: number) => string {\n  const options: Intl.DateTimeFormatOptions =\n    unit === 'year'\n      ? { year: 'numeric' }\n      : unit === 'month'\n        ? { year: 'numeric', month: 'short' }\n        : unit === 'day' || unit === 'week'\n          ? { year: 'numeric', month: 'short', day: 'numeric' }\n          : {\n              year: 'numeric',\n              month: 'short',\n              day: 'numeric',\n              hour: '2-digit',\n              minute: '2-digit',\n              second: unit === 'second' ? '2-digit' : undefined,\n              fractionalSecondDigits: unit === 'second' && digits ? digits : undefined,\n              hourCycle: 'h23',\n            }\n  const format = dateFormat(locale, options)\n  return (value) => format.format(value)\n}\n"],"mappings":"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"}

package/dist/core/funnel.js

@@ -0,0 +1,68 @@
+// src/core/funnel.ts
+/** How much of a stage's row its bar takes; the rest is the band to the next. */
+var FUNNEL_BAR = .7;
+/** A stage's bar: its left, top, width and height, in px; `null` without a value. */
+function stageBar(series, view, i) {
+	const x = series.x.values[i];
+	const v = series.top[i];
+	if (x !== x || v !== v) return null;
+	const [right, middle] = view.point(x, Math.max(0, v));
+	const cx = view.plot.x + view.plot.width / 2;
+	const half = Math.max(right - cx, .5);
+	return {
+		x: cx - half,
+		y: middle - view.band / 2,
+		width: half * 2,
+		height: view.band
+	};
+}
+/** The rows of a funnel in stage order, with a value. */
+function stages(series) {
+	const order = [];
+	for (let i = 0; i < series.top.length; i++) if (series.x.values[i] === series.x.values[i] && series.top[i] === series.top[i]) order.push(i);
+	order.sort((a, b) => series.x.values[a] - series.x.values[b]);
+	return order;
+}
+var funnelKind = {
+	type: "funnel",
+	funnel: true,
+	zero: true,
+	draw(painter, series, view) {
+		const order = stages(series);
+		const bars = order.map((i) => stageBar(series, view, i));
+		painter.save();
+		painter.fillStyle = series.color;
+		painter.globalAlpha *= .14;
+		painter.beginPath();
+		for (let k = 0; k + 1 < bars.length; k++) {
+			const a = bars[k];
+			const b = bars[k + 1];
+			if (series.x.values[order[k + 1]] - series.x.values[order[k]] !== 1) continue;
+			painter.moveTo(a.x, a.y + a.height);
+			painter.lineTo(a.x + a.width, a.y + a.height);
+			painter.lineTo(b.x + b.width, b.y);
+			painter.lineTo(b.x, b.y);
+			painter.closePath();
+		}
+		painter.fill();
+		painter.restore();
+		const radius = Math.max(0, series.props.radius ?? 3);
+		painter.save();
+		painter.fillStyle = series.color;
+		painter.beginPath();
+		for (const bar of bars) {
+			const r = Math.min(radius, bar.width / 2, bar.height / 2);
+			painter.moveTo(bar.x + r, bar.y);
+			painter.arcTo(bar.x + bar.width, bar.y, bar.x + bar.width, bar.y + bar.height, r);
+			painter.arcTo(bar.x + bar.width, bar.y + bar.height, bar.x, bar.y + bar.height, r);
+			painter.arcTo(bar.x, bar.y + bar.height, bar.x, bar.y, r);
+			painter.arcTo(bar.x, bar.y, bar.x + bar.width, bar.y, r);
+			painter.closePath();
+		}
+		painter.fill();
+		painter.restore();
+	}
+};
+export { FUNNEL_BAR, funnelKind, stageBar };
+
+//# sourceMappingURL=funnel.js.map

package/dist/core/funnel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"funnel.js","names":[],"sources":["../../src/core/funnel.ts"],"sourcesContent":["import type { Painter } from './painter'\nimport type { ChartSeries, ChartSeriesKind, ChartView } from './series'\n\n/*\n * A funnel: a bar for each stage, centered and one under another in the\n * order given, as wide as its value against the largest; between two\n * stages, a lighter band from one's width to the next shows what was lost.\n */\n\nexport interface FunnelStyle {\n  /** Corner radius of the bars, in px. */\n  radius?: number\n}\n\n/** How much of a stage's row its bar takes; the rest is the band to the next. */\nexport const FUNNEL_BAR = 0.7\n\n/** A stage's bar: its left, top, width and height, in px; `null` without a value. */\nexport function stageBar(series: ChartSeries<FunnelStyle>, view: ChartView, i: number) {\n  const x = series.x.values[i]!\n  const v = series.top[i]!\n  if (x !== x || v !== v) return null\n  const [right, middle] = view.point(x, Math.max(0, v))\n  const cx = view.plot.x + view.plot.width / 2\n  const half = Math.max(right - cx, 0.5)\n  return { x: cx - half, y: middle - view.band / 2, width: half * 2, height: view.band }\n}\n\n/** The rows of a funnel in stage order, with a value. */\nfunction stages(series: ChartSeries<FunnelStyle>): number[] {\n  const order: number[] = []\n  for (let i = 0; i < series.top.length; i++)\n    if (series.x.values[i] === series.x.values[i] && series.top[i] === series.top[i]) order.push(i)\n  order.sort((a, b) => series.x.values[a]! - series.x.values[b]!)\n  return order\n}\n\nexport const funnelKind: ChartSeriesKind<FunnelStyle> = {\n  type: 'funnel',\n  funnel: true,\n  zero: true,\n  draw(painter: Painter, series, view) {\n    const order = stages(series)\n    const bars = order.map((i) => stageBar(series, view, i)!)\n    // the bands between stages, under the bars\n    painter.save()\n    painter.fillStyle = series.color\n    painter.globalAlpha *= 0.14\n    painter.beginPath()\n    for (let k = 0; k + 1 < bars.length; k++) {\n      const a = bars[k]!\n      const b = bars[k + 1]!\n      // only between stages next to each other\n      if (series.x.values[order[k + 1]!]! - series.x.values[order[k]!]! !== 1) continue\n      painter.moveTo(a.x, a.y + a.height)\n      painter.lineTo(a.x + a.width, a.y + a.height)\n      painter.lineTo(b.x + b.width, b.y)\n      painter.lineTo(b.x, b.y)\n      painter.closePath()\n    }\n    painter.fill()\n    painter.restore()\n    const radius = Math.max(0, series.props.radius ?? 3)\n    painter.save()\n    painter.fillStyle = series.color\n    painter.beginPath()\n    for (const bar of bars) {\n      const r = Math.min(radius, bar.width / 2, bar.height / 2)\n      painter.moveTo(bar.x + r, bar.y)\n      painter.arcTo(bar.x + bar.width, bar.y, bar.x + bar.width, bar.y + bar.height, r)\n      painter.arcTo(bar.x + bar.width, bar.y + bar.height, bar.x, bar.y + bar.height, r)\n      painter.arcTo(bar.x, bar.y + bar.height, bar.x, bar.y, r)\n      painter.arcTo(bar.x, bar.y, bar.x + bar.width, bar.y, r)\n      painter.closePath()\n    }\n    painter.fill()\n    painter.restore()\n  },\n}\n"],"mappings":";;AAeA,IAAa,aAAa;;AAG1B,SAAgB,SAAS,QAAkC,MAAiB,GAAW;CACrF,MAAM,IAAI,OAAO,EAAE,OAAO;CAC1B,MAAM,IAAI,OAAO,IAAI;CACrB,IAAI,MAAM,KAAK,MAAM,GAAG,OAAO;CAC/B,MAAM,CAAC,OAAO,UAAU,KAAK,MAAM,GAAG,KAAK,IAAI,GAAG,CAAC,CAAC;CACpD,MAAM,KAAK,KAAK,KAAK,IAAI,KAAK,KAAK,QAAQ;CAC3C,MAAM,OAAO,KAAK,IAAI,QAAQ,IAAI,EAAG;CACrC,OAAO;EAAE,GAAG,KAAK;EAAM,GAAG,SAAS,KAAK,OAAO;EAAG,OAAO,OAAO;EAAG,QAAQ,KAAK;CAAK;AACvF;;AAGA,SAAS,OAAO,QAA4C;CAC1D,MAAM,QAAkB,CAAC;CACzB,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,IAAI,QAAQ,KACrC,IAAI,OAAO,EAAE,OAAO,OAAO,OAAO,EAAE,OAAO,MAAM,OAAO,IAAI,OAAO,OAAO,IAAI,IAAI,MAAM,KAAK,CAAC;CAChG,MAAM,MAAM,GAAG,MAAM,OAAO,EAAE,OAAO,KAAM,OAAO,EAAE,OAAO,EAAG;CAC9D,OAAO;AACT;AAEA,IAAa,aAA2C;CACtD,MAAM;CACN,QAAQ;CACR,MAAM;CACN,KAAK,SAAkB,QAAQ,MAAM;EACnC,MAAM,QAAQ,OAAO,MAAM;EAC3B,MAAM,OAAO,MAAM,KAAK,MAAM,SAAS,QAAQ,MAAM,CAAC,CAAE;EAExD,QAAQ,KAAK;EACb,QAAQ,YAAY,OAAO;EAC3B,QAAQ,eAAe;EACvB,QAAQ,UAAU;EAClB,KAAK,IAAI,IAAI,GAAG,IAAI,IAAI,KAAK,QAAQ,KAAK;GACxC,MAAM,IAAI,KAAK;GACf,MAAM,IAAI,KAAK,IAAI;GAEnB,IAAI,OAAO,EAAE,OAAO,MAAM,IAAI,MAAQ,OAAO,EAAE,OAAO,MAAM,QAAU,GAAG;GACzE,QAAQ,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM;GAClC,QAAQ,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM;GAC5C,QAAQ,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;GACjC,QAAQ,OAAO,EAAE,GAAG,EAAE,CAAC;GACvB,QAAQ,UAAU;EACpB;EACA,QAAQ,KAAK;EACb,QAAQ,QAAQ;EAChB,MAAM,SAAS,KAAK,IAAI,GAAG,OAAO,MAAM,UAAU,CAAC;EACnD,QAAQ,KAAK;EACb,QAAQ,YAAY,OAAO;EAC3B,QAAQ,UAAU;EAClB,KAAK,MAAM,OAAO,MAAM;GACtB,MAAM,IAAI,KAAK,IAAI,QAAQ,IAAI,QAAQ,GAAG,IAAI,SAAS,CAAC;GACxD,QAAQ,OAAO,IAAI,IAAI,GAAG,IAAI,CAAC;GAC/B,QAAQ,MAAM,IAAI,IAAI,IAAI,OAAO,IAAI,GAAG,IAAI,IAAI,IAAI,OAAO,IAAI,IAAI,IAAI,QAAQ,CAAC;GAChF,QAAQ,MAAM,IAAI,IAAI,IAAI,OAAO,IAAI,IAAI,IAAI,QAAQ,IAAI,GAAG,IAAI,IAAI,IAAI,QAAQ,CAAC;GACjF,QAAQ,MAAM,IAAI,GAAG,IAAI,IAAI,IAAI,QAAQ,IAAI,GAAG,IAAI,GAAG,CAAC;GACxD,QAAQ,MAAM,IAAI,GAAG,IAAI,GAAG,IAAI,IAAI,IAAI,OAAO,IAAI,GAAG,CAAC;GACvD,QAAQ,UAAU;EACpB;EACA,QAAQ,KAAK;EACb,QAAQ,QAAQ;CAClB;AACF"}

package/dist/core/grid.js

@@ -0,0 +1,87 @@
+// src/core/grid.ts
+/** About this many points to a cell. */
+var PER_CELL = 4;
+/** At most this many cells along each side. */
+var MOST = 1024;
+var grids = /* @__PURE__ */ new WeakMap();
+/** The grid of the points `(xs[i], ys[i])`; points with a `NaN` are left out. Cached per data. */
+function pointGrid(xs, ys) {
+	const known = grids.get(ys);
+	if (known && known.xs === xs) return known.grid;
+	const n = Math.min(xs.length, ys.length);
+	let x0 = Infinity;
+	let x1 = -Infinity;
+	let y0 = Infinity;
+	let y1 = -Infinity;
+	let count = 0;
+	for (let i = 0; i < n; i++) {
+		const x = xs[i];
+		const y = ys[i];
+		if (x !== x || y !== y) continue;
+		count++;
+		if (x < x0) x0 = x;
+		if (x > x1) x1 = x;
+		if (y < y0) y0 = y;
+		if (y > y1) y1 = y;
+	}
+	const side = Math.min(MOST, Math.max(1, Math.ceil(Math.sqrt(count / PER_CELL))));
+	const columns = x1 > x0 ? side : 1;
+	const rows = y1 > y0 ? side : 1;
+	const width = (x1 - x0) / columns || 1;
+	const height = (y1 - y0) / rows || 1;
+	const cells = new Int32Array(n);
+	const starts = new Int32Array(columns * rows + 1);
+	for (let i = 0; i < n; i++) {
+		const x = xs[i];
+		const y = ys[i];
+		if (x !== x || y !== y) {
+			cells[i] = -1;
+			continue;
+		}
+		const c = Math.min(columns - 1, Math.floor((x - x0) / width));
+		const at = Math.min(rows - 1, Math.floor((y - y0) / height)) * columns + c;
+		cells[i] = at;
+		starts[at + 1]++;
+	}
+	for (let k = 1; k < starts.length; k++) starts[k] += starts[k - 1];
+	const items = new Int32Array(count);
+	const fill = starts.slice(0, -1);
+	for (let i = 0; i < n; i++) {
+		const at = cells[i];
+		if (at >= 0) items[fill[at]++] = i;
+	}
+	const grid = {
+		x0,
+		y0,
+		columns,
+		rows,
+		width,
+		height,
+		starts,
+		items
+	};
+	grids.set(ys, {
+		xs,
+		grid
+	});
+	return grid;
+}
+/** The cell along one side that `value` is in, kept on the grid. */
+var cell = (value, origin, size, most) => Math.min(most - 1, Math.max(0, Math.floor((value - origin) / size)));
+/** Calls `visit` with each point in the cells that touch the data box from `(xa, ya)` to `(xb, yb)`. */
+function eachNear(grid, xa, xb, ya, yb, visit) {
+	const { x0, y0, columns, rows, width, height, starts, items } = grid;
+	const c0 = cell(Math.min(xa, xb), x0, width, columns);
+	const c1 = cell(Math.max(xa, xb), x0, width, columns);
+	const r0 = cell(Math.min(ya, yb), y0, height, rows);
+	const r1 = cell(Math.max(ya, yb), y0, height, rows);
+	if (Math.max(xa, xb) < x0 || Math.min(xa, xb) > x0 + width * columns) return;
+	if (Math.max(ya, yb) < y0 || Math.min(ya, yb) > y0 + height * rows) return;
+	for (let r = r0; r <= r1; r++) for (let c = c0; c <= c1; c++) {
+		const at = r * columns + c;
+		for (let k = starts[at], end = starts[at + 1]; k < end; k++) visit(items[k]);
+	}
+}
+export { eachNear, pointGrid };
+
+//# sourceMappingURL=grid.js.map

package/dist/core/grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.js","names":[],"sources":["../../src/core/grid.ts"],"sourcesContent":["/*\n * A grid over scattered points, for finding the ones near the pointer\n * without going through all of them: each cell lists the points in it.\n * Made once per data, in the data's own numbers, so it holds while zooming.\n */\n\nexport interface PointGrid {\n  /** The data's x and y stretch the cells cover. */\n  x0: number\n  y0: number\n  /** Cells across and down, and the size of one in data numbers. */\n  columns: number\n  rows: number\n  width: number\n  height: number\n  /** Where each cell's points start in `items`; the cell after ends them. */\n  starts: Int32Array\n  /** The points, cell by cell. */\n  items: Int32Array\n}\n\n/** About this many points to a cell. */\nconst PER_CELL = 4\n/** At most this many cells along each side. */\nconst MOST = 1024\n\nconst grids = new WeakMap<Float64Array, { xs: Float64Array; grid: PointGrid }>()\n\n/** The grid of the points `(xs[i], ys[i])`; points with a `NaN` are left out. Cached per data. */\nexport function pointGrid(xs: Float64Array, ys: Float64Array): PointGrid {\n  const known = grids.get(ys)\n  if (known && known.xs === xs) return known.grid\n  const n = Math.min(xs.length, ys.length)\n  let x0 = Infinity\n  let x1 = -Infinity\n  let y0 = Infinity\n  let y1 = -Infinity\n  let count = 0\n  for (let i = 0; i < n; i++) {\n    const x = xs[i]!\n    const y = ys[i]!\n    if (x !== x || y !== y) continue\n    count++\n    if (x < x0) x0 = x\n    if (x > x1) x1 = x\n    if (y < y0) y0 = y\n    if (y > y1) y1 = y\n  }\n  const side = Math.min(MOST, Math.max(1, Math.ceil(Math.sqrt(count / PER_CELL))))\n  const columns = x1 > x0 ? side : 1\n  const rows = y1 > y0 ? side : 1\n  const width = (x1 - x0) / columns || 1\n  const height = (y1 - y0) / rows || 1\n  // each point's cell, then the points sorted by cell (a counting sort)\n  const cells = new Int32Array(n)\n  const starts = new Int32Array(columns * rows + 1)\n  for (let i = 0; i < n; i++) {\n    const x = xs[i]!\n    const y = ys[i]!\n    if (x !== x || y !== y) {\n      cells[i] = -1\n      continue\n    }\n    const c = Math.min(columns - 1, Math.floor((x - x0) / width))\n    const r = Math.min(rows - 1, Math.floor((y - y0) / height))\n    const at = r * columns + c\n    cells[i] = at\n    starts[at + 1]!++\n  }\n  for (let k = 1; k < starts.length; k++) starts[k]! += starts[k - 1]!\n  const items = new Int32Array(count)\n  const fill = starts.slice(0, -1)\n  for (let i = 0; i < n; i++) {\n    const at = cells[i]!\n    if (at >= 0) items[fill[at]!++] = i\n  }\n  const grid: PointGrid = { x0, y0, columns, rows, width, height, starts, items }\n  grids.set(ys, { xs, grid })\n  return grid\n}\n\n/** The cell along one side that `value` is in, kept on the grid. */\nconst cell = (value: number, origin: number, size: number, most: number) =>\n  Math.min(most - 1, Math.max(0, Math.floor((value - origin) / size)))\n\n/** Calls `visit` with each point in the cells that touch the data box from `(xa, ya)` to `(xb, yb)`. */\nexport function eachNear(\n  grid: PointGrid,\n  xa: number,\n  xb: number,\n  ya: number,\n  yb: number,\n  visit: (index: number) => void,\n) {\n  const { x0, y0, columns, rows, width, height, starts, items } = grid\n  const c0 = cell(Math.min(xa, xb), x0, width, columns)\n  const c1 = cell(Math.max(xa, xb), x0, width, columns)\n  const r0 = cell(Math.min(ya, yb), y0, height, rows)\n  const r1 = cell(Math.max(ya, yb), y0, height, rows)\n  // a box wholly off the grid's side touches nothing\n  if (Math.max(xa, xb) < x0 || Math.min(xa, xb) > x0 + width * columns) return\n  if (Math.max(ya, yb) < y0 || Math.min(ya, yb) > y0 + height * rows) return\n  for (let r = r0; r <= r1; r++) {\n    for (let c = c0; c <= c1; c++) {\n      const at = r * columns + c\n      for (let k = starts[at]!, end = starts[at + 1]!; k < end; k++) visit(items[k]!)\n    }\n  }\n}\n"],"mappings":"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"}

package/dist/core/heatmap.js

@@ -0,0 +1,187 @@
+import { extent } from "./data.js";
+// src/core/heatmap.ts
+/** The room between cells, in px: the surface shows through as a grid. */
+var GAP = 1;
+/** Corner radius of a cell, in px. */
+var RADIUS = 2;
+/** How much of the color the smallest value takes, so it still shows on the surface. */
+var LEAST = .06;
+/** The values a heatmap's scale runs between: `min` and `max` as given, else the data's ends. */
+function heatRange(series) {
+	const { min, max } = series.props;
+	const data = extent(series.y);
+	const lo = Number.isFinite(min) ? min : data?.[0];
+	const hi = Number.isFinite(max) ? max : data?.[1];
+	if (lo === void 0 || hi === void 0) return null;
+	return hi > lo ? [lo, hi] : data;
+}
+/** Where `value` falls on the scale, 0 to 1. */
+function heatShare(value, range) {
+	const [lo, hi] = range;
+	if (!(hi > lo)) return 1;
+	return Math.min(1, Math.max(0, (value - lo) / (hi - lo)));
+}
+/** An `rgb()` / `rgba()` / `#rrggbb` color as OKLab, or `null`. */
+function toLab(color) {
+	let rgb = null;
+	const m = /rgba?\(\s*([\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)/.exec(color);
+	if (m) rgb = [
+		Number(m[1]),
+		Number(m[2]),
+		Number(m[3])
+	];
+	else {
+		const hex = /^#([\da-f]{6})$/i.exec(color);
+		if (hex) {
+			const n = Number.parseInt(hex[1], 16);
+			rgb = [
+				n >> 16 & 255,
+				n >> 8 & 255,
+				n & 255
+			];
+		}
+	}
+	if (!rgb) return null;
+	const [r, g, b] = rgb.map((c) => {
+		const v = c / 255;
+		return v <= .04045 ? v / 12.92 : ((v + .055) / 1.055) ** 2.4;
+	});
+	const l = Math.cbrt(.4122214708 * r + .5363325363 * g + .0514459929 * b);
+	const mm = Math.cbrt(.2119034982 * r + .6806995451 * g + .1073969566 * b);
+	const s = Math.cbrt(.0883024619 * r + .2817188376 * g + .6299787005 * b);
+	return [
+		.2104542553 * l + .793617785 * mm - .0040720468 * s,
+		1.9779984951 * l - 2.428592205 * mm + .4505937099 * s,
+		.0259040371 * l + .7827717662 * mm - .808675766 * s
+	];
+}
+function fromLab([L, A, B]) {
+	const l = (L + .3963377774 * A + .2158037573 * B) ** 3;
+	const m = (L - .1055613458 * A - .0638541728 * B) ** 3;
+	const s = (L - .0894841775 * A - 1.291485548 * B) ** 3;
+	const [r, g, b] = [
+		4.0767416621 * l - 3.3077115913 * m + .2309699292 * s,
+		-1.2684380046 * l + 2.6097574011 * m - .3413193965 * s,
+		-.0041960863 * l - .7034186147 * m + 1.707614701 * s
+	].map((v) => {
+		const c = v <= .0031308 ? 12.92 * v : 1.055 * Math.max(0, v) ** (1 / 2.4) - .055;
+		return Math.round(Math.min(1, Math.max(0, c)) * 255);
+	});
+	return `rgb(${r}, ${g}, ${b})`;
+}
+/**
+* The color at `share` (0 to 1) of a scale from `surface` to `color`,
+* mixed in OKLab so equal steps look equal; the smallest still shows.
+*/
+function heatColor(color, surface, share) {
+	const to = toLab(color);
+	const from = toLab(surface);
+	if (!to || !from) return color;
+	const t = LEAST + .94 * share;
+	return fromLab([
+		from[0] + (to[0] - from[0]) * t,
+		from[1] + (to[1] - from[1]) * t,
+		from[2] + (to[2] - from[2]) * t
+	]);
+}
+/** A cell's box: its center and size in px, whichever way the chart runs. */
+function cellOf(series, view, i) {
+	const x = series.x.values[i];
+	const y = series.top[i];
+	if (x !== x || y !== y || series.y[i] !== series.y[i]) return null;
+	const [cx, cy] = view.point(x, y);
+	const across = view.band;
+	const down = Math.abs(view.y.map(0) - view.y.map(1));
+	const [width, height] = view.horizontal ? [down, across] : [across, down];
+	return {
+		x: cx - width / 2,
+		y: cy - height / 2,
+		width,
+		height,
+		cx,
+		cy
+	};
+}
+/** The colors of a series' cells, by row, worked out once per draw. */
+function cellColors(series, view) {
+	const range = heatRange(series);
+	const out = Array.from({ length: series.y.length });
+	if (!range) return out;
+	const steps = /* @__PURE__ */ new Map();
+	for (let i = 0; i < series.y.length; i++) {
+		const v = series.y[i];
+		if (v !== v) continue;
+		const step = Math.round(heatShare(v, range) * 255);
+		let c = steps.get(step);
+		if (!c) steps.set(step, c = heatColor(series.color, view.colors.surface, step / 255));
+		out[i] = c;
+	}
+	return out;
+}
+var heatmapKind = {
+	type: "heatmap",
+	categoryY: true,
+	band: true,
+	tooltip: "item",
+	draw(painter, series, view) {
+		const colors = cellColors(series, view);
+		const { plot } = view;
+		for (let i = 0; i < series.y.length; i++) {
+			const cell = cellOf(series, view, i);
+			const color = colors[i];
+			if (!cell || !color) continue;
+			if (cell.x + cell.width < plot.x || cell.x > plot.x + plot.width) continue;
+			const w = Math.max(0, cell.width - GAP);
+			const h = Math.max(0, cell.height - GAP);
+			const r = Math.min(RADIUS, w / 4, h / 4);
+			painter.fillStyle = color;
+			painter.beginPath();
+			roundRect(painter, cell.x + GAP / 2, cell.y + GAP / 2, w, h, r);
+			painter.fill();
+		}
+	},
+	hit(series, view, px, py) {
+		for (let i = 0; i < series.y.length; i++) {
+			const cell = cellOf(series, view, i);
+			if (!cell) continue;
+			if (px >= cell.x && px < cell.x + cell.width && py >= cell.y && py < cell.y + cell.height) return {
+				index: i,
+				radius: 0
+			};
+		}
+		return null;
+	},
+	labels(series, view) {
+		const colors = cellColors(series, view);
+		const out = [];
+		for (let i = 0; i < series.y.length; i++) {
+			const cell = cellOf(series, view, i);
+			const color = colors[i];
+			if (!cell || !color) continue;
+			out.push({
+				index: i,
+				at: [cell.cx, cell.cy],
+				side: "center",
+				box: {
+					x: cell.x,
+					y: cell.y,
+					width: cell.width - GAP,
+					height: cell.height - GAP,
+					color
+				}
+			});
+		}
+		return out;
+	}
+};
+function roundRect(p, x, y, w, h, r) {
+	p.moveTo(x + r, y);
+	p.arcTo(x + w, y, x + w, y + h, r);
+	p.arcTo(x + w, y + h, x, y + h, r);
+	p.arcTo(x, y + h, x, y, r);
+	p.arcTo(x, y, x + w, y, r);
+	p.closePath();
+}
+export { heatColor, heatRange, heatShare, heatmapKind };
+
+//# sourceMappingURL=heatmap.js.map

package/dist/core/heatmap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"heatmap.js","names":[],"sources":["../../src/core/heatmap.ts"],"sourcesContent":["import { extent } from './data'\nimport type { Painter } from './painter'\nimport type { ChartHit, ChartLabelAnchor, ChartSeries, ChartSeriesKind, ChartView } from './series'\n\n/*\n * A heatmap: a cell for each row, at its x and the category its `y`\n * names, colored by its value along a sequential scale from the chart's\n * surface to the series' color. Lighter is less, darker (or stronger) is\n * more, in steps the eye reads as even.\n */\n\nexport interface HeatmapStyle {\n  /** The value the scale starts at; by default the smallest. */\n  min?: number\n  /** The value the scale ends at; by default the largest. */\n  max?: number\n}\n\n/** The room between cells, in px: the surface shows through as a grid. */\nconst GAP = 1\n/** Corner radius of a cell, in px. */\nconst RADIUS = 2\n/** How much of the color the smallest value takes, so it still shows on the surface. */\nconst LEAST = 0.06\n\n/** The values a heatmap's scale runs between: `min` and `max` as given, else the data's ends. */\nexport function heatRange(\n  series: Pick<ChartSeries<HeatmapStyle>, 'props' | 'y'>,\n): [number, number] | null {\n  const { min, max } = series.props\n  const data = extent(series.y)\n  const lo = Number.isFinite(min) ? min! : data?.[0]\n  const hi = Number.isFinite(max) ? max! : data?.[1]\n  if (lo === undefined || hi === undefined) return null\n  return hi > lo ? [lo, hi] : data\n}\n\n/** Where `value` falls on the scale, 0 to 1. */\nexport function heatShare(value: number, range: [number, number]): number {\n  const [lo, hi] = range\n  if (!(hi > lo)) return 1\n  return Math.min(1, Math.max(0, (value - lo) / (hi - lo)))\n}\n\ntype Lab = [number, number, number]\n\n/** An `rgb()` / `rgba()` / `#rrggbb` color as OKLab, or `null`. */\nfunction toLab(color: string): Lab | null {\n  let rgb: number[] | null = null\n  const m = /rgba?\\(\\s*([\\d.]+)[\\s,]+([\\d.]+)[\\s,]+([\\d.]+)/.exec(color)\n  if (m) rgb = [Number(m[1]), Number(m[2]), Number(m[3])]\n  else {\n    const hex = /^#([\\da-f]{6})$/i.exec(color)\n    if (hex) {\n      const n = Number.parseInt(hex[1]!, 16)\n      rgb = [(n >> 16) & 255, (n >> 8) & 255, n & 255]\n    }\n  }\n  if (!rgb) return null\n  const [r, g, b] = rgb.map((c) => {\n    const v = c / 255\n    return v <= 0.040_45 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4\n  }) as [number, number, number]\n  const l = Math.cbrt(0.412_221_470_8 * r + 0.536_332_536_3 * g + 0.051_445_992_9 * b)\n  const mm = Math.cbrt(0.211_903_498_2 * r + 0.680_699_545_1 * g + 0.107_396_956_6 * b)\n  const s = Math.cbrt(0.088_302_461_9 * r + 0.281_718_837_6 * g + 0.629_978_700_5 * b)\n  return [\n    0.210_454_255_3 * l + 0.793_617_785 * mm - 0.004_072_046_8 * s,\n    1.977_998_495_1 * l - 2.428_592_205 * mm + 0.450_593_709_9 * s,\n    0.025_904_037_1 * l + 0.782_771_766_2 * mm - 0.808_675_766 * s,\n  ]\n}\n\nfunction fromLab([L, A, B]: Lab): string {\n  const l = (L + 0.396_337_777_4 * A + 0.215_803_757_3 * B) ** 3\n  const m = (L - 0.105_561_345_8 * A - 0.063_854_172_8 * B) ** 3\n  const s = (L - 0.089_484_177_5 * A - 1.291_485_548 * B) ** 3\n  const linear = [\n    4.076_741_662_1 * l - 3.307_711_591_3 * m + 0.230_969_929_2 * s,\n    -1.268_438_004_6 * l + 2.609_757_401_1 * m - 0.341_319_396_5 * s,\n    -0.004_196_086_3 * l - 0.703_418_614_7 * m + 1.707_614_701 * s,\n  ]\n  const [r, g, b] = linear.map((v) => {\n    const c = v <= 0.003_130_8 ? 12.92 * v : 1.055 * Math.max(0, v) ** (1 / 2.4) - 0.055\n    return Math.round(Math.min(1, Math.max(0, c)) * 255)\n  })\n  return `rgb(${r}, ${g}, ${b})`\n}\n\n/**\n * The color at `share` (0 to 1) of a scale from `surface` to `color`,\n * mixed in OKLab so equal steps look equal; the smallest still shows.\n */\nexport function heatColor(color: string, surface: string, share: number): string {\n  const to = toLab(color)\n  const from = toLab(surface)\n  if (!to || !from) return color\n  const t = LEAST + (1 - LEAST) * share\n  return fromLab([\n    from[0] + (to[0] - from[0]) * t,\n    from[1] + (to[1] - from[1]) * t,\n    from[2] + (to[2] - from[2]) * t,\n  ])\n}\n\n/** A cell's box: its center and size in px, whichever way the chart runs. */\nfunction cellOf(series: ChartSeries<HeatmapStyle>, view: ChartView, i: number) {\n  const x = series.x.values[i]!\n  const y = series.top[i]!\n  if (x !== x || y !== y || series.y[i] !== series.y[i]) return null\n  const [cx, cy] = view.point(x, y)\n  const across = view.band\n  const down = Math.abs(view.y.map(0) - view.y.map(1))\n  const [width, height] = view.horizontal ? [down, across] : [across, down]\n  return { x: cx - width / 2, y: cy - height / 2, width, height, cx, cy }\n}\n\n/** The colors of a series' cells, by row, worked out once per draw. */\nfunction cellColors(series: ChartSeries<HeatmapStyle>, view: ChartView): string[] {\n  const range = heatRange(series)\n  const out: string[] = Array.from({ length: series.y.length })\n  if (!range) return out\n  // a handful of colors are used over and over: one per step of the scale\n  const steps = new Map<number, string>()\n  for (let i = 0; i < series.y.length; i++) {\n    const v = series.y[i]!\n    if (v !== v) continue\n    const step = Math.round(heatShare(v, range) * 255)\n    let c = steps.get(step)\n    if (!c) steps.set(step, (c = heatColor(series.color, view.colors.surface, step / 255)))\n    out[i] = c\n  }\n  return out\n}\n\nexport const heatmapKind: ChartSeriesKind<HeatmapStyle> = {\n  type: 'heatmap',\n  categoryY: true,\n  band: true,\n  tooltip: 'item',\n  draw(painter: Painter, series, view) {\n    const colors = cellColors(series, view)\n    const { plot } = view\n    for (let i = 0; i < series.y.length; i++) {\n      const cell = cellOf(series, view, i)\n      const color = colors[i]\n      if (!cell || !color) continue\n      if (cell.x + cell.width < plot.x || cell.x > plot.x + plot.width) continue\n      const w = Math.max(0, cell.width - GAP)\n      const h = Math.max(0, cell.height - GAP)\n      const r = Math.min(RADIUS, w / 4, h / 4)\n      painter.fillStyle = color\n      painter.beginPath()\n      roundRect(painter, cell.x + GAP / 2, cell.y + GAP / 2, w, h, r)\n      painter.fill()\n    }\n  },\n  hit(series, view, px, py): ChartHit | null {\n    for (let i = 0; i < series.y.length; i++) {\n      const cell = cellOf(series, view, i)\n      if (!cell) continue\n      if (px >= cell.x && px < cell.x + cell.width && py >= cell.y && py < cell.y + cell.height)\n        return { index: i, radius: 0 }\n    }\n    return null\n  },\n  labels(series, view): ChartLabelAnchor[] {\n    const colors = cellColors(series, view)\n    const out: ChartLabelAnchor[] = []\n    for (let i = 0; i < series.y.length; i++) {\n      const cell = cellOf(series, view, i)\n      const color = colors[i]\n      if (!cell || !color) continue\n      out.push({\n        index: i,\n        at: [cell.cx, cell.cy],\n        side: 'center',\n        box: { x: cell.x, y: cell.y, width: cell.width - GAP, height: cell.height - GAP, color },\n      })\n    }\n    return out\n  },\n}\n\nfunction roundRect(p: Painter, x: number, y: number, w: number, h: number, r: number) {\n  p.moveTo(x + r, y)\n  p.arcTo(x + w, y, x + w, y + h, r)\n  p.arcTo(x + w, y + h, x, y + h, r)\n  p.arcTo(x, y + h, x, y, r)\n  p.arcTo(x, y, x + w, y, r)\n  p.closePath()\n}\n"],"mappings":"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"}

package/dist/core/histogram.js

@@ -0,0 +1,81 @@
+import { nextNiceStep, niceStep } from "./scale.js";
+import { barLabels, drawBars } from "./bar.js";
+import { warnOnce } from "./warn.js";
+// src/core/histogram.ts
+/** The most bins a histogram has: more would be thinner than a pixel, and slow. */
+var MAX_BINS = 1e3;
+/**
+* Counts `values` into bins of width `step`, or of a round width giving
+* about `count` bins (by default, by the number of values: Sturges' rule).
+* Values that aren't numbers are left out.
+*/
+function histogramBins(values, { count, step } = {}) {
+	let min = Infinity;
+	let max = -Infinity;
+	let n = 0;
+	for (let i = 0; i < values.length; i++) {
+		const v = values[i];
+		if (!Number.isFinite(v)) continue;
+		n++;
+		if (v < min) min = v;
+		if (v > max) max = v;
+	}
+	if (!n) return [];
+	if (step !== void 0 && !(step > 0)) warnOnce("histogram-step", `a histogram's \`step\` must be above 0; ${step} is left out.`);
+	let width = step && step > 0 ? step : max > min ? niceStep(max - min, Math.min(MAX_BINS, Math.max(1, count ?? Math.ceil(Math.log2(n)) + 1))) : 1;
+	if ((max - Math.floor(min / width) * width) / width > 1e3) {
+		warnOnce("histogram-bins", `a histogram's \`step\` of ${width} makes more than ${MAX_BINS} bins; they are widened.`);
+		width = niceStep(max - min, MAX_BINS / 2);
+		while ((max - Math.floor(min / width) * width) / width > MAX_BINS) width = nextNiceStep(width);
+	}
+	const start = Math.floor(min / width) * width;
+	const bins = Math.max(1, Math.ceil((max - start) / width - 1e-9));
+	const out = [];
+	for (let k = 0; k < bins; k++) {
+		const x0 = round(start + k * width, width);
+		const x1 = round(start + (k + 1) * width, width);
+		out.push({
+			x0,
+			x1,
+			x: (x0 + x1) / 2,
+			count: 0
+		});
+	}
+	for (let i = 0; i < values.length; i++) {
+		const v = values[i];
+		if (!Number.isFinite(v)) continue;
+		const k = Math.min(bins - 1, Math.floor((v - start) / width + 1e-9));
+		out[k].count++;
+	}
+	return out;
+}
+function round(value, step) {
+	const digits = Math.max(0, -Math.floor(Math.log10(step)) + 1);
+	return Number(value.toFixed(Math.min(20, digits)));
+}
+/** The bars across all of each bin, a hairline apart. */
+var placement = (view) => {
+	const gap = view.band > 4 ? 1 : 0;
+	return {
+		offset: -view.band / 2 + gap / 2,
+		width: view.band - gap
+	};
+};
+var histogramKind = {
+	type: "bar",
+	zero: true,
+	band: true,
+	draw: (painter, series, view) => drawBars(painter, series, view, placement(view)),
+	labels: (series, view) => barLabels(series, view, placement(view)),
+	xTitle: (series, row, text) => {
+		const b = series.rows[row];
+		return b ? `${text(b.x0)} – ${text(b.x1)}` : "";
+	},
+	xStep: (series) => {
+		const b = series.rows[0];
+		return b ? b.x1 - b.x0 : NaN;
+	}
+};
+export { MAX_BINS, histogramBins, histogramKind };
+
+//# sourceMappingURL=histogram.js.map