@fundar/data-chart-telling 0.0.24 → 0.0.26

package/dist/plots/bar/buildBarMarkers.d.ts

@@ -0,0 +1,30 @@
+import type { Series } from '../../types/plots/data/common';
+import type { BarSegmentStyle } from '../../types/plots/segments/common';
+import type { VisualGroup } from '../../types/plots/segments/config';
+import type { HoverPoint } from '../../types/layout/tooltip';
+import type { BarMarkerConfig } from '../../types/markers/common';
+import type { BarLayout } from './layout.svelte';
+/**
+ * Every `'bar'` marker for one BarPlot render: one `role: 'segment'` marker
+ * per series (stacked) or per visual segment (grouped/overlap), plus one
+ * `role: 'hitArea'` marker per category, so a chart never gets segment
+ * markers without their hit areas.
+ *
+ * `'hitArea'` geometry is left unresolved (just `category` + `data`) —
+ * resolving it to pixels needs svelteplot's live scale, only available
+ * where the marker actually renders.
+ */
+export declare function buildBarMarkers<TData extends Record<string, unknown>>(args: {
+    groupedSeries: VisualGroup<Series<TData>, BarSegmentStyle>[];
+    barLayout: BarLayout<TData>;
+    isHorizontal: boolean;
+    hoverPoints: HoverPoint<TData>[];
+    palette: string[];
+    disabledFillFor: (seriesName: string) => {
+        fill?: string;
+        fillOpacity?: number;
+    } | undefined;
+    active: boolean;
+    setHoverMatch: (rows: TData[]) => void;
+    clearHoverMatch: () => void;
+}): BarMarkerConfig[];

package/dist/plots/bar/buildBarMarkers.js

@@ -0,0 +1,100 @@
+import { resolveAccessor } from '../utils/accessors';
+import { paletteColor } from '../../utils/color';
+/**
+ * Every `'bar'` marker for one BarPlot render: one `role: 'segment'` marker
+ * per series (stacked) or per visual segment (grouped/overlap), plus one
+ * `role: 'hitArea'` marker per category, so a chart never gets segment
+ * markers without their hit areas.
+ *
+ * `'hitArea'` geometry is left unresolved (just `category` + `data`) —
+ * resolving it to pixels needs svelteplot's live scale, only available
+ * where the marker actually renders.
+ */
+export function buildBarMarkers(args) {
+    const { groupedSeries, barLayout, isHorizontal, hoverPoints, palette, disabledFillFor, active, setHoverMatch, clearHoverMatch } = args;
+    const segmentMarkers = [];
+    groupedSeries.forEach((group, seriesIndex) => {
+        const xFn = resolveAccessor(group.series.x);
+        const yFn = resolveAccessor(group.series.y);
+        const defaultColor = paletteColor(seriesIndex, palette);
+        const disabledFill = disabledFillFor(group.series.name);
+        if (barLayout.layout === 'stacked') {
+            const stackedBaselineFn = (d) => barLayout.stackedBaseline(xFn(d), seriesIndex);
+            const stackedTopFn = (d) => barLayout.stackedBaseline(xFn(d), seriesIndex) + Number(yFn(d));
+            const marker = {
+                type: 'bar',
+                role: 'segment',
+                isHorizontal,
+                data: group.series.data,
+                style: {
+                    fill: disabledFill?.fill ?? defaultColor,
+                    fillOpacity: disabledFill?.fillOpacity ?? 1,
+                },
+            };
+            if (isHorizontal) {
+                marker.y = xFn;
+                marker.x1 = stackedBaselineFn;
+                marker.x2 = stackedTopFn;
+            }
+            else {
+                marker.x = xFn;
+                marker.y1 = stackedBaselineFn;
+                marker.y2 = stackedTopFn;
+            }
+            segmentMarkers.push(marker);
+            return;
+        }
+        for (const seg of group.visualSegments) {
+            const marker = {
+                type: 'bar',
+                role: 'segment',
+                isHorizontal,
+                data: seg.data,
+                style: {
+                    fill: disabledFill?.fill ?? seg.style.fill ?? defaultColor,
+                    fillOpacity: disabledFill?.fillOpacity ?? seg.style.fillOpacity ?? 1,
+                },
+            };
+            if (isHorizontal) {
+                marker.y = xFn;
+                marker.x1 = barLayout.valueBaseline;
+                marker.x2 = yFn;
+            }
+            else {
+                marker.x = xFn;
+                marker.y1 = barLayout.valueBaseline;
+                marker.y2 = yFn;
+            }
+            if (barLayout.layout === 'grouped') {
+                if (isHorizontal) {
+                    marker.insetTop = seriesIndex * barLayout.seriesStep + barLayout.seriesGap / 2;
+                    marker.insetBottom = (barLayout.seriesCount - 1 - seriesIndex) * barLayout.seriesStep + barLayout.seriesGap / 2;
+                }
+                else {
+                    marker.insetLeft = seriesIndex * barLayout.seriesStep + barLayout.seriesGap / 2;
+                    marker.insetRight = (barLayout.seriesCount - 1 - seriesIndex) * barLayout.seriesStep + barLayout.seriesGap / 2;
+                }
+            }
+            segmentMarkers.push(marker);
+        }
+    });
+    const byCategory = new Map();
+    for (const p of hoverPoints) {
+        const key = isHorizontal ? p.y : p.x;
+        const list = byCategory.get(key);
+        if (list)
+            list.push(p);
+        else
+            byCategory.set(key, [p]);
+    }
+    const hitAreaMarkers = [...byCategory.entries()].map(([category, points]) => ({
+        type: 'bar',
+        role: 'hitArea',
+        isHorizontal,
+        category,
+        data: points.map((p) => p.row),
+        onpointerenter: active ? () => setHoverMatch(points.map((p) => p.row)) : undefined,
+        onpointerleave: active ? clearHoverMatch : undefined,
+    }));
+    return [...segmentMarkers, ...hitAreaMarkers];
+}

package/dist/plots/bar/layout.svelte.d.ts

@@ -1,6 +1,5 @@
-import type { AxisValue } from '../../types/plots/axis';
+import type { AxisValue, AxisBasedScalesConfig } from '../../types/layout/scales';
 import type { Series } from '../../types/plots/data/common';
-import type { AxisBasedScalesConfig } from '../../types/plots/props';
 import type { BarSegmentStyle } from '../../types/plots/segments/common';
 import type { VisualGroup } from '../../types/plots/segments/config';
 import type { MarginConfig } from '../../types/plots/props';

package/dist/plots/bar/layout.svelte.js

@@ -13,7 +13,7 @@ export function createBarLayout(args) {
     const cfg = $derived(getConfiguration());
     /**
      * How series sharing the same category are arranged — see
-     * {@link import('../../types/plots/axis').AxisScale.seriesLayout}. Read
+     * {@link import('../../types/layout/scales').AxisScale.seriesLayout}. Read
      * off `scales.z` since it's the grouping axis, not the category axis itself.
      */
     const layout = $derived(args.scales().z?.seriesLayout ?? 'overlap');