@voila.dev/chart 4.0.0

package/dist/core/marks/stats/distribution.js

@@ -0,0 +1,354 @@
+import {
+  channelLabel,
+  isPlaceable,
+  numericValue,
+  readChannel
+} from "../../channel.js";
+import { markId, paint } from "../shared.js";
+import {
+  boxSummary,
+  kernelDensity,
+  samples,
+  silvermanBandwidth
+} from "./statistics.js";
+import { areaPath, polygonPath } from "../../paths.js";
+import { categoryKey } from "../../scales/discrete.js";
+function groupValues(data, options) {
+  const categories = readChannel(data, options.category);
+  const values = readChannel(data, options.value).map(numericValue);
+  const groups = /* @__PURE__ */ new Map();
+  for (const [index, category] of categories.entries()) {
+    const value = values[index];
+    if (!isPlaceable(category) || value === void 0) {
+      continue;
+    }
+    const key = categoryKey(category);
+    const group = groups.get(key) ?? { category, values: [] };
+    group.values.push(value);
+    groups.set(key, group);
+  }
+  return [...groups.values()];
+}
+function rangeOf(groups) {
+  return groups.flatMap(
+    (group) => group.values.length === 0 ? [] : [Math.min(...group.values), Math.max(...group.values)]
+  );
+}
+const OUTLIER_RADIUS = 2.5;
+function boxY(data, options) {
+  const groups = groupValues(data, options);
+  const summaries = groups.map((group) => ({
+    group,
+    summary: boxSummary(group.values)
+  }));
+  return {
+    id: options.id,
+    coordinate: "cartesian",
+    focusOrder: "x",
+    channels: {
+      x: {
+        values: groups.map((group) => group.category),
+        discrete: "band",
+        label: channelLabel(options.category)
+      },
+      y: {
+        values: rangeOf(groups),
+        label: channelLabel(options.value) ?? options.label
+      }
+    },
+    render(context) {
+      const id = markId(options.id, "boxY", context);
+      const { x: xScale, y: yScale } = context.scales;
+      if (xScale === void 0 || yScale === void 0) {
+        return { nodes: [] };
+      }
+      const color = options.fill ?? context.paletteColor(context.markIndex);
+      const width = xScale.bandwidth * (options.width ?? 0.6);
+      const nodes = [];
+      const points = [];
+      for (const { group, summary } of summaries) {
+        if (summary === void 0) {
+          continue;
+        }
+        const key = categoryKey(group.category);
+        const center = xScale.center(group.category);
+        const left = center - width / 2;
+        const stroke = {
+          stroke: color,
+          strokeWidth: 1.5,
+          opacity: options.opacity
+        };
+        const top = yScale.map(summary.q3);
+        const bottom = yScale.map(summary.q1);
+        nodes.push(
+          {
+            kind: "line",
+            key: `${id}:whisker:${key}`,
+            role: "mark",
+            x1: center,
+            y1: yScale.map(summary.high),
+            x2: center,
+            y2: yScale.map(summary.low),
+            paint: paint(stroke)
+          },
+          {
+            kind: "rect",
+            key: `${id}:box:${key}`,
+            role: "mark",
+            x: left,
+            y: Math.min(top, bottom),
+            width,
+            height: Math.abs(bottom - top),
+            corners: [2, 2, 2, 2],
+            paint: paint({ ...stroke, fill: color, fillOpacity: 0.25 })
+          },
+          {
+            kind: "line",
+            key: `${id}:median:${key}`,
+            role: "mark",
+            x1: left,
+            y1: yScale.map(summary.median),
+            x2: left + width,
+            y2: yScale.map(summary.median),
+            paint: paint({ ...stroke, strokeWidth: 2.5 })
+          },
+          ...summary.outliers.map(
+            (value, index) => ({
+              kind: "circle",
+              key: `${id}:outlier:${key}:${index}`,
+              role: "mark",
+              cx: center,
+              cy: yScale.map(value),
+              r: OUTLIER_RADIUS,
+              paint: paint({ fill: "none", ...stroke })
+            })
+          )
+        );
+        if (options.tip !== false) {
+          points.push({
+            key: `${id}:${key}`,
+            markId: id,
+            index: groups.indexOf(group),
+            datum: summary,
+            x: center,
+            y: yScale.map(summary.median),
+            xValue: group.category,
+            yValue: summary.median,
+            seriesLabel: options.label,
+            color,
+            title: context.formatX(group.category),
+            value: `${context.formatY(summary.median)} (${context.formatY(summary.q1)} \u2013 ${context.formatY(summary.q3)})`,
+            hit: {
+              kind: "rect",
+              rect: {
+                x: left,
+                y: Math.min(top, bottom),
+                width,
+                height: Math.abs(bottom - top)
+              }
+            }
+          });
+        }
+      }
+      return { nodes, points };
+    }
+  };
+}
+const DENSITY_SAMPLES = 48;
+function violinY(data, options) {
+  const groups = groupValues(data, options);
+  const shapes = groups.map((group) => {
+    const low = Math.min(...group.values);
+    const high = Math.max(...group.values);
+    const pad = silvermanBandwidth(group.values);
+    const at = samples(low - pad, high + pad, DENSITY_SAMPLES);
+    return {
+      group,
+      at,
+      density: kernelDensity(group.values, at),
+      summary: boxSummary(group.values)
+    };
+  });
+  const peak = Math.max(0, ...shapes.flatMap((shape) => shape.density));
+  return {
+    id: options.id,
+    coordinate: "cartesian",
+    focusOrder: "x",
+    channels: {
+      x: {
+        values: groups.map((group) => group.category),
+        discrete: "band",
+        label: channelLabel(options.category)
+      },
+      y: {
+        values: shapes.flatMap((shape) => [
+          shape.at[0],
+          shape.at[shape.at.length - 1]
+        ]),
+        label: channelLabel(options.value) ?? options.label
+      }
+    },
+    render(context) {
+      const id = markId(options.id, "violinY", context);
+      const { x: xScale, y: yScale } = context.scales;
+      if (xScale === void 0 || yScale === void 0) {
+        return { nodes: [] };
+      }
+      const color = options.fill ?? context.paletteColor(context.markIndex);
+      const half = xScale.bandwidth / 2;
+      const nodes = [];
+      const points = [];
+      for (const [index, shape] of shapes.entries()) {
+        const center = xScale.center(shape.group.category);
+        const width = (value) => peak === 0 ? 0 : value / peak * half;
+        const right = shape.at.map((value, sample) => ({
+          x: center + width(shape.density[sample]),
+          y: yScale.map(value)
+        }));
+        const left = shape.at.map((value, sample) => ({
+          x: center - width(shape.density[sample]),
+          y: yScale.map(value)
+        })).reverse();
+        const key = categoryKey(shape.group.category);
+        nodes.push({
+          kind: "path",
+          key: `${id}:${key}`,
+          role: "mark",
+          d: polygonPath([...right, ...left]),
+          paint: paint({
+            fill: color,
+            fillOpacity: 0.3,
+            stroke: color,
+            strokeWidth: 1.5,
+            opacity: options.opacity
+          })
+        });
+        const summary = shape.summary;
+        if (summary === void 0) {
+          continue;
+        }
+        nodes.push({
+          kind: "line",
+          key: `${id}:median:${key}`,
+          role: "mark",
+          x1: center - half * 0.25,
+          y1: yScale.map(summary.median),
+          x2: center + half * 0.25,
+          y2: yScale.map(summary.median),
+          paint: { stroke: color, strokeWidth: 2.5 }
+        });
+        if (options.tip !== false) {
+          points.push({
+            key: `${id}:${key}`,
+            markId: id,
+            index,
+            datum: summary,
+            x: center,
+            y: yScale.map(summary.median),
+            xValue: shape.group.category,
+            yValue: summary.median,
+            seriesLabel: options.label,
+            color,
+            title: context.formatX(shape.group.category),
+            value: `${context.formatY(summary.median)} (${context.formatY(summary.q1)} \u2013 ${context.formatY(summary.q3)})`
+          });
+        }
+      }
+      return { nodes, points };
+    }
+  };
+}
+const DEFAULT_OVERLAP = 1.6;
+function ridgeline(data, options) {
+  const overlap = options.overlap ?? DEFAULT_OVERLAP;
+  const groups = groupValues(data, options);
+  const all = groups.flatMap((group) => group.values);
+  const low = Math.min(...all);
+  const high = Math.max(...all);
+  const pad = silvermanBandwidth(all);
+  const at = samples(low - pad, high + pad, DENSITY_SAMPLES * 2);
+  const shapes = groups.map((group) => ({
+    group,
+    density: kernelDensity(group.values, at, silvermanBandwidth(group.values))
+  }));
+  const peak = Math.max(0, ...shapes.flatMap((shape) => shape.density));
+  return {
+    id: options.id,
+    coordinate: "cartesian",
+    focusOrder: "y",
+    channels: {
+      x: {
+        values: all.length === 0 ? [] : [at[0], at[at.length - 1]],
+        label: channelLabel(options.value) ?? options.label
+      },
+      y: {
+        values: groups.map((group) => group.category),
+        discrete: "band",
+        padding: 0,
+        // Room above the first row for its ridge to rise into.
+        paddingOuter: Math.max(0, overlap - 1),
+        label: channelLabel(options.category)
+      }
+    },
+    render(context) {
+      const id = markId(options.id, "ridgeline", context);
+      const { x: xScale, y: yScale } = context.scales;
+      if (xScale === void 0 || yScale === void 0) {
+        return { nodes: [] };
+      }
+      const rise = yScale.bandwidth * overlap;
+      const nodes = [];
+      const points = [];
+      for (const [index, shape] of shapes.entries()) {
+        const color = options.fill ?? context.paletteColor(index);
+        const baseline = yScale.map(shape.group.category) + yScale.bandwidth;
+        const top = at.map((value, sample) => ({
+          x: xScale.map(value),
+          y: baseline - (peak === 0 ? 0 : shape.density[sample] / peak * rise)
+        }));
+        const bottom = at.map((value) => ({
+          x: xScale.map(value),
+          y: baseline
+        }));
+        const key = categoryKey(shape.group.category);
+        nodes.push({
+          kind: "path",
+          key: `${id}:${key}`,
+          role: "mark",
+          d: areaPath(top, bottom, "monotone"),
+          paint: paint({
+            fill: color,
+            fillOpacity: 0.75,
+            stroke: context.theme.background,
+            strokeWidth: 1,
+            opacity: options.opacity
+          })
+        });
+        const summary = boxSummary(shape.group.values);
+        if (options.tip !== false && summary !== void 0) {
+          points.push({
+            key: `${id}:${key}`,
+            markId: id,
+            index,
+            datum: summary,
+            x: xScale.map(summary.median),
+            y: baseline - yScale.bandwidth / 2,
+            xValue: summary.median,
+            yValue: shape.group.category,
+            seriesLabel: options.label,
+            color,
+            title: context.formatY(shape.group.category),
+            value: `${context.formatX(summary.median)} (${context.formatX(summary.q1)} \u2013 ${context.formatX(summary.q3)})`
+          });
+        }
+      }
+      return { nodes, points };
+    }
+  };
+}
+export {
+  boxY,
+  ridgeline,
+  violinY
+};
+//# sourceMappingURL=distribution.js.map

package/dist/core/marks/stats/distribution.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/marks/stats/distribution.ts"],
+  "sourcesContent": ["import {\n\tchannelLabel,\n\tisPlaceable,\n\tnumericValue,\n\treadChannel,\n} from \"#/core/channel.ts\";\nimport { markId, paint } from \"#/core/marks/shared.ts\";\nimport {\n\tboxSummary,\n\tkernelDensity,\n\tsamples,\n\tsilvermanBandwidth,\n} from \"#/core/marks/stats/statistics.ts\";\nimport { areaPath, type ChartXY, polygonPath } from \"#/core/paths.ts\";\nimport { categoryKey } from \"#/core/scales/discrete.ts\";\nimport type {\n\tChartAccessor,\n\tChartMark,\n\tChartPoint,\n\tChartValue,\n\tSceneNode,\n} from \"#/core/types.ts\";\n\n/**\n * Distributions per category: the box plot, the violin and the ridgeline.\n * Each groups the values by category first; a category's point (what the\n * keyboard visits) sits on its median.\n */\n\ninterface DistributionOptions<TDatum> {\n\treadonly id?: string;\n\treadonly label?: string;\n\treadonly fill?: string;\n\treadonly opacity?: number;\n\treadonly tip?: boolean;\n\treadonly category: ChartAccessor<TDatum, ChartValue>;\n\treadonly value: ChartAccessor<TDatum, ChartValue>;\n}\n\ninterface Group {\n\treadonly category: ChartValue;\n\treadonly values: number[];\n}\n\nfunction groupValues<TDatum>(\n\tdata: ReadonlyArray<TDatum>,\n\toptions: DistributionOptions<TDatum>,\n): ReadonlyArray<Group> {\n\tconst categories = readChannel(data, options.category);\n\tconst values = readChannel(data, options.value).map(numericValue);\n\tconst groups = new Map<string, Group>();\n\tfor (const [index, category] of categories.entries()) {\n\t\tconst value = values[index];\n\t\tif (!isPlaceable(category) || value === undefined) {\n\t\t\tcontinue;\n\t\t}\n\t\tconst key = categoryKey(category);\n\t\tconst group = groups.get(key) ?? { category, values: [] };\n\t\tgroup.values.push(value);\n\t\tgroups.set(key, group);\n\t}\n\treturn [...groups.values()];\n}\n\nfunction rangeOf(groups: ReadonlyArray<Group>): ReadonlyArray<number> {\n\treturn groups.flatMap((group) =>\n\t\tgroup.values.length === 0\n\t\t\t? []\n\t\t\t: [Math.min(...group.values), Math.max(...group.values)],\n\t);\n}\n\nexport interface BoxOptions<TDatum> extends DistributionOptions<TDatum> {\n\t/** Share of the band the box takes. */\n\treadonly width?: number;\n}\n\nconst OUTLIER_RADIUS = 2.5;\n\n/**\n * Box and whiskers per category: the box from the first to the third\n * quartile, the median across it, whiskers to the furthest values within\n * 1.5 IQR, and the outliers past them as dots.\n */\nexport function boxY<TDatum>(\n\tdata: ReadonlyArray<TDatum>,\n\toptions: BoxOptions<TDatum>,\n): ChartMark {\n\tconst groups = groupValues(data, options);\n\tconst summaries = groups.map((group) => ({\n\t\tgroup,\n\t\tsummary: boxSummary(group.values),\n\t}));\n\treturn {\n\t\tid: options.id,\n\t\tcoordinate: \"cartesian\",\n\t\tfocusOrder: \"x\",\n\t\tchannels: {\n\t\t\tx: {\n\t\t\t\tvalues: groups.map((group) => group.category),\n\t\t\t\tdiscrete: \"band\",\n\t\t\t\tlabel: channelLabel(options.category),\n\t\t\t},\n\t\t\ty: {\n\t\t\t\tvalues: rangeOf(groups),\n\t\t\t\tlabel: channelLabel(options.value) ?? options.label,\n\t\t\t},\n\t\t},\n\t\trender(context) {\n\t\t\tconst id = markId(options.id, \"boxY\", context);\n\t\t\tconst { x: xScale, y: yScale } = context.scales;\n\t\t\tif (xScale === undefined || yScale === undefined) {\n\t\t\t\treturn { nodes: [] };\n\t\t\t}\n\t\t\tconst color = options.fill ?? context.paletteColor(context.markIndex);\n\t\t\tconst width = xScale.bandwidth * (options.width ?? 0.6);\n\t\t\tconst nodes: SceneNode[] = [];\n\t\t\tconst points: ChartPoint[] = [];\n\t\t\tfor (const { group, summary } of summaries) {\n\t\t\t\tif (summary === undefined) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t\tconst key = categoryKey(group.category);\n\t\t\t\tconst center = xScale.center(group.category);\n\t\t\t\tconst left = center - width / 2;\n\t\t\t\tconst stroke = {\n\t\t\t\t\tstroke: color,\n\t\t\t\t\tstrokeWidth: 1.5,\n\t\t\t\t\topacity: options.opacity,\n\t\t\t\t};\n\t\t\t\tconst top = yScale.map(summary.q3);\n\t\t\t\tconst bottom = yScale.map(summary.q1);\n\t\t\t\tnodes.push(\n\t\t\t\t\t{\n\t\t\t\t\t\tkind: \"line\",\n\t\t\t\t\t\tkey: `${id}:whisker:${key}`,\n\t\t\t\t\t\trole: \"mark\",\n\t\t\t\t\t\tx1: center,\n\t\t\t\t\t\ty1: yScale.map(summary.high),\n\t\t\t\t\t\tx2: center,\n\t\t\t\t\t\ty2: yScale.map(summary.low),\n\t\t\t\t\t\tpaint: paint(stroke),\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\tkind: \"rect\",\n\t\t\t\t\t\tkey: `${id}:box:${key}`,\n\t\t\t\t\t\trole: \"mark\",\n\t\t\t\t\t\tx: left,\n\t\t\t\t\t\ty: Math.min(top, bottom),\n\t\t\t\t\t\twidth,\n\t\t\t\t\t\theight: Math.abs(bottom - top),\n\t\t\t\t\t\tcorners: [2, 2, 2, 2],\n\t\t\t\t\t\tpaint: paint({ ...stroke, fill: color, fillOpacity: 0.25 }),\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\tkind: \"line\",\n\t\t\t\t\t\tkey: `${id}:median:${key}`,\n\t\t\t\t\t\trole: \"mark\",\n\t\t\t\t\t\tx1: left,\n\t\t\t\t\t\ty1: yScale.map(summary.median),\n\t\t\t\t\t\tx2: left + width,\n\t\t\t\t\t\ty2: yScale.map(summary.median),\n\t\t\t\t\t\tpaint: paint({ ...stroke, strokeWidth: 2.5 }),\n\t\t\t\t\t},\n\t\t\t\t\t...summary.outliers.map(\n\t\t\t\t\t\t(value, index): SceneNode => ({\n\t\t\t\t\t\t\tkind: \"circle\",\n\t\t\t\t\t\t\tkey: `${id}:outlier:${key}:${index}`,\n\t\t\t\t\t\t\trole: \"mark\",\n\t\t\t\t\t\t\tcx: center,\n\t\t\t\t\t\t\tcy: yScale.map(value),\n\t\t\t\t\t\t\tr: OUTLIER_RADIUS,\n\t\t\t\t\t\t\tpaint: paint({ fill: \"none\", ...stroke }),\n\t\t\t\t\t\t}),\n\t\t\t\t\t),\n\t\t\t\t);\n\t\t\t\tif (options.tip !== false) {\n\t\t\t\t\tpoints.push({\n\t\t\t\t\t\tkey: `${id}:${key}`,\n\t\t\t\t\t\tmarkId: id,\n\t\t\t\t\t\tindex: groups.indexOf(group),\n\t\t\t\t\t\tdatum: summary,\n\t\t\t\t\t\tx: center,\n\t\t\t\t\t\ty: yScale.map(summary.median),\n\t\t\t\t\t\txValue: group.category,\n\t\t\t\t\t\tyValue: summary.median,\n\t\t\t\t\t\tseriesLabel: options.label,\n\t\t\t\t\t\tcolor,\n\t\t\t\t\t\ttitle: context.formatX(group.category),\n\t\t\t\t\t\tvalue: `${context.formatY(summary.median)} (${context.formatY(summary.q1)} \u2013 ${context.formatY(summary.q3)})`,\n\t\t\t\t\t\thit: {\n\t\t\t\t\t\t\tkind: \"rect\",\n\t\t\t\t\t\t\trect: {\n\t\t\t\t\t\t\t\tx: left,\n\t\t\t\t\t\t\t\ty: Math.min(top, bottom),\n\t\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\t\theight: Math.abs(bottom - top),\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn { nodes, points };\n\t\t},\n\t};\n}\n\nconst DENSITY_SAMPLES = 48;\n\n/**\n * The density of each category's values, mirrored around its centre: the\n * shape a box plot hides (two peaks, a long tail).\n */\nexport function violinY<TDatum>(\n\tdata: ReadonlyArray<TDatum>,\n\toptions: DistributionOptions<TDatum>,\n): ChartMark {\n\tconst groups = groupValues(data, options);\n\tconst shapes = groups.map((group) => {\n\t\tconst low = Math.min(...group.values);\n\t\tconst high = Math.max(...group.values);\n\t\tconst pad = silvermanBandwidth(group.values);\n\t\tconst at = samples(low - pad, high + pad, DENSITY_SAMPLES);\n\t\treturn {\n\t\t\tgroup,\n\t\t\tat,\n\t\t\tdensity: kernelDensity(group.values, at),\n\t\t\tsummary: boxSummary(group.values),\n\t\t};\n\t});\n\tconst peak = Math.max(0, ...shapes.flatMap((shape) => shape.density));\n\treturn {\n\t\tid: options.id,\n\t\tcoordinate: \"cartesian\",\n\t\tfocusOrder: \"x\",\n\t\tchannels: {\n\t\t\tx: {\n\t\t\t\tvalues: groups.map((group) => group.category),\n\t\t\t\tdiscrete: \"band\",\n\t\t\t\tlabel: channelLabel(options.category),\n\t\t\t},\n\t\t\ty: {\n\t\t\t\tvalues: shapes.flatMap((shape) => [\n\t\t\t\t\tshape.at[0],\n\t\t\t\t\tshape.at[shape.at.length - 1],\n\t\t\t\t]),\n\t\t\t\tlabel: channelLabel(options.value) ?? options.label,\n\t\t\t},\n\t\t},\n\t\trender(context) {\n\t\t\tconst id = markId(options.id, \"violinY\", context);\n\t\t\tconst { x: xScale, y: yScale } = context.scales;\n\t\t\tif (xScale === undefined || yScale === undefined) {\n\t\t\t\treturn { nodes: [] };\n\t\t\t}\n\t\t\tconst color = options.fill ?? context.paletteColor(context.markIndex);\n\t\t\tconst half = xScale.bandwidth / 2;\n\t\t\tconst nodes: SceneNode[] = [];\n\t\t\tconst points: ChartPoint[] = [];\n\t\t\tfor (const [index, shape] of shapes.entries()) {\n\t\t\t\tconst center = xScale.center(shape.group.category);\n\t\t\t\tconst width = (value: number) =>\n\t\t\t\t\tpeak === 0 ? 0 : (value / peak) * half;\n\t\t\t\tconst right: ChartXY[] = shape.at.map((value, sample) => ({\n\t\t\t\t\tx: center + width(shape.density[sample]),\n\t\t\t\t\ty: yScale.map(value),\n\t\t\t\t}));\n\t\t\t\tconst left: ChartXY[] = shape.at\n\t\t\t\t\t.map((value, sample) => ({\n\t\t\t\t\t\tx: center - width(shape.density[sample]),\n\t\t\t\t\t\ty: yScale.map(value),\n\t\t\t\t\t}))\n\t\t\t\t\t.reverse();\n\t\t\t\tconst key = categoryKey(shape.group.category);\n\t\t\t\tnodes.push({\n\t\t\t\t\tkind: \"path\",\n\t\t\t\t\tkey: `${id}:${key}`,\n\t\t\t\t\trole: \"mark\",\n\t\t\t\t\td: polygonPath([...right, ...left]),\n\t\t\t\t\tpaint: paint({\n\t\t\t\t\t\tfill: color,\n\t\t\t\t\t\tfillOpacity: 0.3,\n\t\t\t\t\t\tstroke: color,\n\t\t\t\t\t\tstrokeWidth: 1.5,\n\t\t\t\t\t\topacity: options.opacity,\n\t\t\t\t\t}),\n\t\t\t\t});\n\t\t\t\tconst summary = shape.summary;\n\t\t\t\tif (summary === undefined) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t\tnodes.push({\n\t\t\t\t\tkind: \"line\",\n\t\t\t\t\tkey: `${id}:median:${key}`,\n\t\t\t\t\trole: \"mark\",\n\t\t\t\t\tx1: center - half * 0.25,\n\t\t\t\t\ty1: yScale.map(summary.median),\n\t\t\t\t\tx2: center + half * 0.25,\n\t\t\t\t\ty2: yScale.map(summary.median),\n\t\t\t\t\tpaint: { stroke: color, strokeWidth: 2.5 },\n\t\t\t\t});\n\t\t\t\tif (options.tip !== false) {\n\t\t\t\t\tpoints.push({\n\t\t\t\t\t\tkey: `${id}:${key}`,\n\t\t\t\t\t\tmarkId: id,\n\t\t\t\t\t\tindex,\n\t\t\t\t\t\tdatum: summary,\n\t\t\t\t\t\tx: center,\n\t\t\t\t\t\ty: yScale.map(summary.median),\n\t\t\t\t\t\txValue: shape.group.category,\n\t\t\t\t\t\tyValue: summary.median,\n\t\t\t\t\t\tseriesLabel: options.label,\n\t\t\t\t\t\tcolor,\n\t\t\t\t\t\ttitle: context.formatX(shape.group.category),\n\t\t\t\t\t\tvalue: `${context.formatY(summary.median)} (${context.formatY(summary.q1)} \u2013 ${context.formatY(summary.q3)})`,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn { nodes, points };\n\t\t},\n\t};\n}\n\nconst DEFAULT_OVERLAP = 1.6;\n\nexport interface RidgelineOptions<TDatum> extends DistributionOptions<TDatum> {\n\t/** How far each ridge may rise into the row above: 1 stays in its row. */\n\treadonly overlap?: number;\n}\n\n/**\n * One density per row, stacked down the chart and allowed to overlap the row\n * above: many distributions compared along one shared x axis.\n */\nexport function ridgeline<TDatum>(\n\tdata: ReadonlyArray<TDatum>,\n\toptions: RidgelineOptions<TDatum>,\n): ChartMark {\n\tconst overlap = options.overlap ?? DEFAULT_OVERLAP;\n\tconst groups = groupValues(data, options);\n\tconst all = groups.flatMap((group) => group.values);\n\tconst low = Math.min(...all);\n\tconst high = Math.max(...all);\n\tconst pad = silvermanBandwidth(all);\n\tconst at = samples(low - pad, high + pad, DENSITY_SAMPLES * 2);\n\tconst shapes = groups.map((group) => ({\n\t\tgroup,\n\t\tdensity: kernelDensity(group.values, at, silvermanBandwidth(group.values)),\n\t}));\n\tconst peak = Math.max(0, ...shapes.flatMap((shape) => shape.density));\n\treturn {\n\t\tid: options.id,\n\t\tcoordinate: \"cartesian\",\n\t\tfocusOrder: \"y\",\n\t\tchannels: {\n\t\t\tx: {\n\t\t\t\tvalues: all.length === 0 ? [] : [at[0], at[at.length - 1]],\n\t\t\t\tlabel: channelLabel(options.value) ?? options.label,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\tvalues: groups.map((group) => group.category),\n\t\t\t\tdiscrete: \"band\",\n\t\t\t\tpadding: 0,\n\t\t\t\t// Room above the first row for its ridge to rise into.\n\t\t\t\tpaddingOuter: Math.max(0, overlap - 1),\n\t\t\t\tlabel: channelLabel(options.category),\n\t\t\t},\n\t\t},\n\t\trender(context) {\n\t\t\tconst id = markId(options.id, \"ridgeline\", context);\n\t\t\tconst { x: xScale, y: yScale } = context.scales;\n\t\t\tif (xScale === undefined || yScale === undefined) {\n\t\t\t\treturn { nodes: [] };\n\t\t\t}\n\t\t\tconst rise = yScale.bandwidth * overlap;\n\t\t\tconst nodes: SceneNode[] = [];\n\t\t\tconst points: ChartPoint[] = [];\n\t\t\tfor (const [index, shape] of shapes.entries()) {\n\t\t\t\tconst color = options.fill ?? context.paletteColor(index);\n\t\t\t\tconst baseline = yScale.map(shape.group.category) + yScale.bandwidth;\n\t\t\t\tconst top = at.map((value, sample) => ({\n\t\t\t\t\tx: xScale.map(value),\n\t\t\t\t\ty:\n\t\t\t\t\t\tbaseline - (peak === 0 ? 0 : (shape.density[sample] / peak) * rise),\n\t\t\t\t}));\n\t\t\t\tconst bottom = at.map((value) => ({\n\t\t\t\t\tx: xScale.map(value),\n\t\t\t\t\ty: baseline,\n\t\t\t\t}));\n\t\t\t\tconst key = categoryKey(shape.group.category);\n\t\t\t\tnodes.push({\n\t\t\t\t\tkind: \"path\",\n\t\t\t\t\tkey: `${id}:${key}`,\n\t\t\t\t\trole: \"mark\",\n\t\t\t\t\td: areaPath(top, bottom, \"monotone\"),\n\t\t\t\t\tpaint: paint({\n\t\t\t\t\t\tfill: color,\n\t\t\t\t\t\tfillOpacity: 0.75,\n\t\t\t\t\t\tstroke: context.theme.background,\n\t\t\t\t\t\tstrokeWidth: 1,\n\t\t\t\t\t\topacity: options.opacity,\n\t\t\t\t\t}),\n\t\t\t\t});\n\t\t\t\tconst summary = boxSummary(shape.group.values);\n\t\t\t\tif (options.tip !== false && summary !== undefined) {\n\t\t\t\t\tpoints.push({\n\t\t\t\t\t\tkey: `${id}:${key}`,\n\t\t\t\t\t\tmarkId: id,\n\t\t\t\t\t\tindex,\n\t\t\t\t\t\tdatum: summary,\n\t\t\t\t\t\tx: xScale.map(summary.median),\n\t\t\t\t\t\ty: baseline - yScale.bandwidth / 2,\n\t\t\t\t\t\txValue: summary.median,\n\t\t\t\t\t\tyValue: shape.group.category,\n\t\t\t\t\t\tseriesLabel: options.label,\n\t\t\t\t\t\tcolor,\n\t\t\t\t\t\ttitle: context.formatY(shape.group.category),\n\t\t\t\t\t\tvalue: `${context.formatX(summary.median)} (${context.formatX(summary.q1)} \u2013 ${context.formatX(summary.q3)})`,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn { nodes, points };\n\t\t},\n\t};\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/core/marks/stats/dodge.d.ts

@@ -0,0 +1,16 @@
+import { type ChartMarkOptions } from "../shared.js";
+import type { ChartAccessor, ChartMark, ChartValue } from "../../types.js";
+export interface DodgeOptions<TDatum> extends ChartMarkOptions<TDatum> {
+    readonly x: ChartAccessor<TDatum, ChartValue>;
+    readonly r?: number;
+    readonly fill?: string;
+    /** Grow from the middle of the plot, or up from its bottom. */
+    readonly anchor?: "middle" | "bottom";
+}
+/**
+ * A beeswarm: one dot per datum along x, nudged up or down just enough not
+ * to overlap, so a crowd of values shows its shape and every value stays
+ * visible and focusable.
+ */
+export declare function dodgeY<TDatum>(data: ReadonlyArray<TDatum>, options: DodgeOptions<TDatum>): ChartMark;
+//# sourceMappingURL=dodge.d.ts.map

package/dist/core/marks/stats/dodge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dodge.d.ts","sourceRoot":"","sources":["../../../../src/core/marks/stats/dodge.ts"],"names":[],"mappings":"AACA,OAAO,EACN,KAAK,gBAAgB,EAMrB,MAAM,wBAAwB,CAAC;AAChC,OAAO,KAAK,EACX,aAAa,EACb,SAAS,EAET,UAAU,EAEV,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,YAAY,CAAC,MAAM,CAAE,SAAQ,gBAAgB,CAAC,MAAM,CAAC;IACrE,QAAQ,CAAC,CAAC,EAAE,aAAa,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAC9C,QAAQ,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,+DAA+D;IAC/D,QAAQ,CAAC,MAAM,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;CACtC;AAKD;;;;GAIG;AACH,wBAAgB,MAAM,CAAC,MAAM,EAC5B,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,EAC3B,OAAO,EAAE,YAAY,CAAC,MAAM,CAAC,GAC3B,SAAS,CAmGX"}

package/dist/core/marks/stats/dodge.js

@@ -0,0 +1,104 @@
+import { channelLabel, isPlaceable, readChannel } from "../../channel.js";
+import {
+  colorChannel,
+  markId,
+  paint,
+  seriesResolver,
+  valueOn
+} from "../shared.js";
+const DEFAULT_RADIUS = 4;
+const SPACING = 1;
+function dodgeY(data, options) {
+  const xs = readChannel(data, options.x);
+  const colors = colorChannel(data, options);
+  const r = options.r ?? DEFAULT_RADIUS;
+  return {
+    id: options.id,
+    coordinate: "cartesian",
+    focusOrder: "point",
+    channels: {
+      x: {
+        values: xs.filter(isPlaceable),
+        label: channelLabel(options.x) ?? options.label,
+        inset: r
+      },
+      color: colors.channel
+    },
+    render(context) {
+      const id = markId(options.id, "dodgeY", context);
+      const xScale = context.scales.x;
+      if (xScale === void 0) {
+        return { nodes: [] };
+      }
+      const { plot } = context;
+      const seriesOf = seriesResolver(
+        colors.values,
+        { ...options, fixedColor: options.fill },
+        id,
+        context
+      );
+      const order = xs.map((raw, index) => ({ index, value: valueOn(xScale, raw) })).filter(
+        (entry) => entry.value !== void 0
+      ).map((entry) => ({ ...entry, x: xScale.center(entry.value) })).sort((left, right) => left.x - right.x);
+      const placed = [];
+      const diameter = r * 2 + SPACING;
+      const bottom = options.anchor === "bottom";
+      const baseline = bottom ? plot.y + plot.height - r : plot.y + plot.height / 2;
+      const nodes = [];
+      const points = [];
+      for (const entry of order) {
+        const near = placed.filter(
+          (other) => Math.abs(other.x - entry.x) < diameter
+        );
+        let offset = 0;
+        for (let step = 0; ; step += 1) {
+          const magnitude = Math.ceil(step / (bottom ? 1 : 2)) * (diameter / 2);
+          offset = bottom || step % 2 === 1 ? -magnitude : magnitude;
+          const y2 = baseline + offset;
+          if (near.every(
+            (other) => Math.hypot(other.x - entry.x, other.y - y2) >= diameter
+          ))
+            break;
+        }
+        const y = baseline + offset;
+        placed.push({ x: entry.x, y });
+        const series = seriesOf(entry.index);
+        nodes.push({
+          kind: "circle",
+          key: `${id}:${entry.index}`,
+          series: series.key,
+          role: "mark",
+          cx: entry.x,
+          cy: y,
+          r,
+          paint: paint({ fill: series.color, opacity: options.opacity })
+        });
+        if (options.tip !== false) {
+          points.push({
+            key: `${id}:${entry.index}`,
+            markId: id,
+            index: entry.index,
+            datum: data[entry.index],
+            x: entry.x,
+            y,
+            xValue: entry.value,
+            series: series.key,
+            seriesLabel: series.label,
+            color: series.color,
+            title: series.label ?? context.formatX(entry.value),
+            value: context.formatX(entry.value),
+            hit: {
+              kind: "rect",
+              rect: { x: entry.x - r, y: y - r, width: r * 2, height: r * 2 }
+            }
+          });
+        }
+      }
+      return { nodes, points };
+    }
+  };
+}
+export {
+  dodgeY
+};
+//# sourceMappingURL=dodge.js.map

package/dist/core/marks/stats/dodge.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/core/marks/stats/dodge.ts"],
+  "sourcesContent": ["import { channelLabel, isPlaceable, readChannel } from \"#/core/channel.ts\";\nimport {\n\ttype ChartMarkOptions,\n\tcolorChannel,\n\tmarkId,\n\tpaint,\n\tseriesResolver,\n\tvalueOn,\n} from \"#/core/marks/shared.ts\";\nimport type {\n\tChartAccessor,\n\tChartMark,\n\tChartPoint,\n\tChartValue,\n\tSceneNode,\n} from \"#/core/types.ts\";\n\nexport interface DodgeOptions<TDatum> extends ChartMarkOptions<TDatum> {\n\treadonly x: ChartAccessor<TDatum, ChartValue>;\n\treadonly r?: number;\n\treadonly fill?: string;\n\t/** Grow from the middle of the plot, or up from its bottom. */\n\treadonly anchor?: \"middle\" | \"bottom\";\n}\n\nconst DEFAULT_RADIUS = 4;\nconst SPACING = 1;\n\n/**\n * A beeswarm: one dot per datum along x, nudged up or down just enough not\n * to overlap, so a crowd of values shows its shape and every value stays\n * visible and focusable.\n */\nexport function dodgeY<TDatum>(\n\tdata: ReadonlyArray<TDatum>,\n\toptions: DodgeOptions<TDatum>,\n): ChartMark {\n\tconst xs = readChannel(data, options.x);\n\tconst colors = colorChannel(data, options);\n\tconst r = options.r ?? DEFAULT_RADIUS;\n\treturn {\n\t\tid: options.id,\n\t\tcoordinate: \"cartesian\",\n\t\tfocusOrder: \"point\",\n\t\tchannels: {\n\t\t\tx: {\n\t\t\t\tvalues: xs.filter(isPlaceable),\n\t\t\t\tlabel: channelLabel(options.x) ?? options.label,\n\t\t\t\tinset: r,\n\t\t\t},\n\t\t\tcolor: colors.channel,\n\t\t},\n\t\trender(context) {\n\t\t\tconst id = markId(options.id, \"dodgeY\", context);\n\t\t\tconst xScale = context.scales.x;\n\t\t\tif (xScale === undefined) {\n\t\t\t\treturn { nodes: [] };\n\t\t\t}\n\t\t\tconst { plot } = context;\n\t\t\tconst seriesOf = seriesResolver(\n\t\t\t\tcolors.values,\n\t\t\t\t{ ...options, fixedColor: options.fill },\n\t\t\t\tid,\n\t\t\t\tcontext,\n\t\t\t);\n\t\t\tconst order = xs\n\t\t\t\t.map((raw, index) => ({ index, value: valueOn(xScale, raw) }))\n\t\t\t\t.filter(\n\t\t\t\t\t(entry): entry is { index: number; value: ChartValue } =>\n\t\t\t\t\t\tentry.value !== undefined,\n\t\t\t\t)\n\t\t\t\t.map((entry) => ({ ...entry, x: xScale.center(entry.value) }))\n\t\t\t\t.sort((left, right) => left.x - right.x);\n\t\t\tconst placed: Array<{ x: number; y: number }> = [];\n\t\t\tconst diameter = r * 2 + SPACING;\n\t\t\tconst bottom = options.anchor === \"bottom\";\n\t\t\tconst baseline = bottom\n\t\t\t\t? plot.y + plot.height - r\n\t\t\t\t: plot.y + plot.height / 2;\n\t\t\tconst nodes: SceneNode[] = [];\n\t\t\tconst points: ChartPoint[] = [];\n\t\t\tfor (const entry of order) {\n\t\t\t\tconst near = placed.filter(\n\t\t\t\t\t(other) => Math.abs(other.x - entry.x) < diameter,\n\t\t\t\t);\n\t\t\t\tlet offset = 0;\n\t\t\t\t// Try 0, +1, \u22121, +2, \u22122 half-diameters (only upwards from a bottom anchor).\n\t\t\t\tfor (let step = 0; ; step += 1) {\n\t\t\t\t\tconst magnitude = Math.ceil(step / (bottom ? 1 : 2)) * (diameter / 2);\n\t\t\t\t\toffset = bottom || step % 2 === 1 ? -magnitude : magnitude;\n\t\t\t\t\tconst y = baseline + offset;\n\t\t\t\t\tif (\n\t\t\t\t\t\tnear.every(\n\t\t\t\t\t\t\t(other) => Math.hypot(other.x - entry.x, other.y - y) >= diameter,\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tconst y = baseline + offset;\n\t\t\t\tplaced.push({ x: entry.x, y });\n\t\t\t\tconst series = seriesOf(entry.index);\n\t\t\t\tnodes.push({\n\t\t\t\t\tkind: \"circle\",\n\t\t\t\t\tkey: `${id}:${entry.index}`,\n\t\t\t\t\tseries: series.key,\n\t\t\t\t\trole: \"mark\",\n\t\t\t\t\tcx: entry.x,\n\t\t\t\t\tcy: y,\n\t\t\t\t\tr,\n\t\t\t\t\tpaint: paint({ fill: series.color, opacity: options.opacity }),\n\t\t\t\t});\n\t\t\t\tif (options.tip !== false) {\n\t\t\t\t\tpoints.push({\n\t\t\t\t\t\tkey: `${id}:${entry.index}`,\n\t\t\t\t\t\tmarkId: id,\n\t\t\t\t\t\tindex: entry.index,\n\t\t\t\t\t\tdatum: data[entry.index],\n\t\t\t\t\t\tx: entry.x,\n\t\t\t\t\t\ty,\n\t\t\t\t\t\txValue: entry.value,\n\t\t\t\t\t\tseries: series.key,\n\t\t\t\t\t\tseriesLabel: series.label,\n\t\t\t\t\t\tcolor: series.color,\n\t\t\t\t\t\ttitle: series.label ?? context.formatX(entry.value),\n\t\t\t\t\t\tvalue: context.formatX(entry.value),\n\t\t\t\t\t\thit: {\n\t\t\t\t\t\t\tkind: \"rect\",\n\t\t\t\t\t\t\trect: { x: entry.x - r, y: y - r, width: r * 2, height: r * 2 },\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn { nodes, points };\n\t\t},\n\t};\n}\n"],
+  "mappings": "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",
+  "names": ["y"]
+}

package/dist/core/marks/stats/hexbin.d.ts

@@ -0,0 +1,26 @@
+import type { ChartAccessor, ChartMark, ChartValue } from "../../types.js";
+export interface HexbinOptions<TDatum> {
+    readonly id?: string;
+    readonly x: ChartAccessor<TDatum, ChartValue>;
+    readonly y: ChartAccessor<TDatum, ChartValue>;
+    /** Pixel radius of a hexagon. */
+    readonly radius?: number;
+    /** Colour of the fullest bin; emptier bins fade towards the background. */
+    readonly fill?: string;
+    readonly label?: string;
+}
+/**
+ * The centre of the hexagon a pixel falls in, on a pointy-top grid whose odd
+ * rows are offset by half a hexagon. Near a slanted edge the nearest row is
+ * not always the right one, so the closer of the two candidate centres wins.
+ */
+export declare function hexCenter(x: number, y: number, radius: number): {
+    x: number;
+    y: number;
+};
+/**
+ * Points counted into hexagons: a scatter too dense to read as dots. The
+ * bins are found in pixels, so they stay hexagonal whatever the scales.
+ */
+export declare function hexbin<TDatum>(data: ReadonlyArray<TDatum>, options: HexbinOptions<TDatum>): ChartMark;
+//# sourceMappingURL=hexbin.d.ts.map

package/dist/core/marks/stats/hexbin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hexbin.d.ts","sourceRoot":"","sources":["../../../../src/core/marks/stats/hexbin.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACX,aAAa,EACb,SAAS,EAET,UAAU,EAEV,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,aAAa,CAAC,MAAM;IACpC,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,CAAC,EAAE,aAAa,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAC9C,QAAQ,CAAC,CAAC,EAAE,aAAa,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAC9C,iCAAiC;IACjC,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB,2EAA2E;IAC3E,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;CACxB;AAKD;;;;GAIG;AACH,wBAAgB,SAAS,CACxB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,MAAM,EAAE,MAAM,GACZ;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAa1B;AAYD;;;GAGG;AACH,wBAAgB,MAAM,CAAC,MAAM,EAC5B,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,EAC3B,OAAO,EAAE,aAAa,CAAC,MAAM,CAAC,GAC5B,SAAS,CAqFX"}