@k2b/ui 0.51.0 → 0.52.0

package/dist/browser/charts/core/svg-histogram.js

@@ -0,0 +1,73 @@
+// Ported SVG algorithm, kept verbatim; separate module for per-kind frame loading.
+import { autoBin, chartDatumSvg, computeAxisScale, computePlotArea, DEFAULT_HEIGHT, DEFAULT_WIDTH, emptyChart, fmt, normalizePadding, pickMapper, renderHeader, renderReferenceLines, renderXAxisNumeric, renderYAxis, svgRoot } from "./svg-common";
+/**
+ * Render a histogram (frequency distribution) of the given observations.
+ * Uses Sturges' formula by default for bin count, or accepts an explicit
+ * count or list of bin edges.
+ *
+ * Bars are adjacent (no inter-bar gap) since a histogram represents a
+ * continuous distribution. The x-axis is numeric (bin edges as ticks).
+ *
+ * @example
+ * charts.histogram({ data: observations, title: "Reaction times (ms)" });
+ *
+ * @example
+ * charts.histogram({ data: scores, bins: 20, yAxis: { label: "Count" } });
+ */
+export const histogram = opts => {
+  const width = opts.width ?? DEFAULT_WIDTH;
+  const height = opts.height ?? DEFAULT_HEIGHT;
+  const padding = normalizePadding(opts.padding);
+  const header = renderHeader(width, opts.title, opts.subtitle);
+  const finite = opts.data.filter(v => Number.isFinite(v));
+  if (finite.length === 0) return emptyChart(width, height, opts.className);
+  const {
+    edges,
+    counts
+  } = autoBin(finite, opts.bins);
+  const area = computePlotArea(width, height, padding, !!opts.xAxis?.label, !!opts.yAxis?.label, header.height, 0);
+  const xAxis = computeAxisScale(edges, opts.xAxis);
+  const yAxis = computeAxisScale([0, ...counts], opts.yAxis);
+  const xMap = pickMapper(xAxis.scale);
+  const yMap = pickMapper(yAxis.scale);
+  const body = [];
+  body.push(renderYAxis(yAxis, area, opts.yAxis));
+  body.push(renderXAxisNumeric(xAxis, area, height, opts.xAxis));
+  const zeroPx = yAxis.scale === "log" ? area.y1 : yMap(0, yAxis.domain, [area.y1, area.y0]);
+  for (let i = 0; i < counts.length; i++) {
+    const left = xMap(edges[i], xAxis.domain, [area.x0, area.x1]);
+    const right = xMap(edges[i + 1], xAxis.domain, [area.x0, area.x1]);
+    const c = counts[i];
+    if (yAxis.scale === "log" && c <= 0) continue;
+    const top = yMap(c, yAxis.domain, [area.y1, area.y0]);
+    body.push(chartDatumSvg(`<rect class="stdlib-chart-bar stdlib-chart-series-0" x="${fmt(left)}" y="${fmt(top)}" width="${fmt(right - left)}" height="${fmt(zeroPx - top)}"/>`, {
+      index: i,
+      role: "bin",
+      anchor: [(left + right) / 2, (top + zeroPx) / 2],
+      values: [{
+        key: "from",
+        value: edges[i],
+        formatted: opts.xAxis?.format?.(edges[i])
+      }, {
+        key: "to",
+        value: edges[i + 1],
+        formatted: opts.xAxis?.format?.(edges[i + 1])
+      }, {
+        key: "upperInclusive",
+        value: i === counts.length - 1 ? "true" : "false"
+      }, {
+        key: "count",
+        value: c
+      }]
+    }, opts.inspect));
+  }
+  if (opts.references && opts.references.length > 0) {
+    body.push(renderReferenceLines(opts.references, xAxis, yAxis, area));
+  }
+  return svgRoot({
+    width,
+    height,
+    className: opts.className
+  }, header.svg + body.join(""));
+};
+//# sourceMappingURL=svg-histogram.js.map

package/dist/browser/charts/core/svg-histogram.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["charts/core/svg-histogram.ts"],"sourcesContent":["// Ported SVG algorithm, kept verbatim; separate module for per-kind frame loading.\nimport {\n  autoBin,\n  chartDatumSvg,\n  computeAxisScale,\n  computePlotArea,\n  DEFAULT_HEIGHT,\n  DEFAULT_WIDTH,\n  emptyChart,\n  fmt,\n  type HistogramOptions,\n  normalizePadding,\n  pickMapper,\n  renderHeader,\n  renderReferenceLines,\n  renderXAxisNumeric,\n  renderYAxis,\n  svgRoot,\n} from \"./svg-common\";\n/**\n * Render a histogram (frequency distribution) of the given observations.\n * Uses Sturges' formula by default for bin count, or accepts an explicit\n * count or list of bin edges.\n *\n * Bars are adjacent (no inter-bar gap) since a histogram represents a\n * continuous distribution. The x-axis is numeric (bin edges as ticks).\n *\n * @example\n * charts.histogram({ data: observations, title: \"Reaction times (ms)\" });\n *\n * @example\n * charts.histogram({ data: scores, bins: 20, yAxis: { label: \"Count\" } });\n */\nexport const histogram = (opts: HistogramOptions): string => {\n  const width = opts.width ?? DEFAULT_WIDTH;\n  const height = opts.height ?? DEFAULT_HEIGHT;\n  const padding = normalizePadding(opts.padding);\n  const header = renderHeader(width, opts.title, opts.subtitle);\n\n  const finite = opts.data.filter((v) => Number.isFinite(v));\n  if (finite.length === 0) return emptyChart(width, height, opts.className);\n\n  const { edges, counts } = autoBin(finite, opts.bins);\n  const area = computePlotArea(width, height, padding, !!opts.xAxis?.label, !!opts.yAxis?.label, header.height, 0);\n\n  const xAxis = computeAxisScale(edges, opts.xAxis);\n  const yAxis = computeAxisScale([0, ...counts], opts.yAxis);\n  const xMap = pickMapper(xAxis.scale);\n  const yMap = pickMapper(yAxis.scale);\n\n  const body: string[] = [];\n  body.push(renderYAxis(yAxis, area, opts.yAxis));\n  body.push(renderXAxisNumeric(xAxis, area, height, opts.xAxis));\n\n  const zeroPx = yAxis.scale === \"log\" ? area.y1 : yMap(0, yAxis.domain, [area.y1, area.y0]);\n  for (let i = 0; i < counts.length; i++) {\n    const left = xMap(edges[i]!, xAxis.domain, [area.x0, area.x1]);\n    const right = xMap(edges[i + 1]!, xAxis.domain, [area.x0, area.x1]);\n    const c = counts[i]!;\n    if (yAxis.scale === \"log\" && c <= 0) continue;\n    const top = yMap(c, yAxis.domain, [area.y1, area.y0]);\n    body.push(\n      chartDatumSvg(\n        `<rect class=\"stdlib-chart-bar stdlib-chart-series-0\" x=\"${fmt(left)}\" y=\"${fmt(top)}\" width=\"${fmt(right - left)}\" height=\"${fmt(zeroPx - top)}\"/>`,\n        {\n          index: i,\n          role: \"bin\",\n          anchor: [(left + right) / 2, (top + zeroPx) / 2],\n          values: [\n            { key: \"from\", value: edges[i]!, formatted: opts.xAxis?.format?.(edges[i]!) },\n            { key: \"to\", value: edges[i + 1]!, formatted: opts.xAxis?.format?.(edges[i + 1]!) },\n            { key: \"upperInclusive\", value: i === counts.length - 1 ? \"true\" : \"false\" },\n            { key: \"count\", value: c },\n          ],\n        },\n        opts.inspect,\n      ),\n    );\n  }\n\n  if (opts.references && opts.references.length > 0) {\n    body.push(renderReferenceLines(opts.references, xAxis, yAxis, area));\n  }\n\n  return svgRoot({ width, height, className: opts.className }, header.svg + body.join(\"\"));\n};\n"],"mappings":"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","ignoreList":[]}