@genome-spy/core 0.67.0 → 0.69.0

package/dist/src/view/multiscale.js

@@ -0,0 +1,233 @@
+import { isArray, isObject } from "vega-util";
+import { isExprRef } from "../paramRuntime/paramUtils.js";
+
+const DEFAULT_FADE = 0.5;
+
+/**
+ * @typedef {"unitsPerPixel"} MultiscaleMetric
+ * @typedef {"x" | "y" | "auto"} MultiscaleChannel
+ * @typedef {number | import("../spec/parameter.js").ExprRef} StopValue
+ *
+ * @typedef {{
+ *     metric: MultiscaleMetric;
+ *     values: StopValue[];
+ *     channel: MultiscaleChannel;
+ *     fade: number;
+ * }} ParsedStops
+ */
+
+/**
+ * @param {object} spec
+ * @returns {spec is import("../spec/view.js").MultiscaleSpec}
+ */
+export function isMultiscaleSpec(spec) {
+    return "multiscale" in spec && isArray(spec.multiscale);
+}
+
+/**
+ * Converts a multiscale spec into a regular layer spec by wrapping each stage
+ * into a generated opacity layer.
+ *
+ * @param {import("../spec/view.js").MultiscaleSpec} spec
+ * @returns {import("../spec/view.js").LayerSpec}
+ */
+export function normalizeMultiscaleSpec(spec) {
+    if (!spec.multiscale.length) {
+        throw new Error('"multiscale" must contain at least one child view.');
+    }
+
+    const parsedStops = parseStops(spec.stops, spec.multiscale.length);
+
+    /** @type {import("../spec/view.js").LayerSpec["layer"]} */
+    const layer = spec.multiscale.map((child, i) => {
+        if (spec.multiscale.length === 1) {
+            return child;
+        }
+
+        return {
+            opacity: createStageOpacity(i, spec.multiscale.length, parsedStops),
+            layer: [child],
+        };
+    });
+
+    const passThrough = { ...spec };
+    delete passThrough.multiscale;
+    delete passThrough.stops;
+
+    return {
+        ...passThrough,
+        layer,
+    };
+}
+
+/**
+ * @param {import("../spec/view.js").MultiscaleStopsDef} stops
+ * @param {number} stageCount
+ * @returns {ParsedStops}
+ */
+function parseStops(stops, stageCount) {
+    /** @type {MultiscaleMetric} */
+    let metric = "unitsPerPixel";
+    /** @type {StopValue[]} */
+    let values;
+    /** @type {MultiscaleChannel} */
+    let channel = "auto";
+    let fade = DEFAULT_FADE;
+
+    if (isArray(stops)) {
+        values = parseStopValues(stops, stageCount, "stops");
+    } else if (isObject(stops)) {
+        metric = stops.metric ?? "unitsPerPixel";
+        values = parseStopValues(stops.values, stageCount, "stops.values");
+        channel = stops.channel ?? "auto";
+        fade = stops.fade ?? DEFAULT_FADE;
+    } else {
+        throw new Error('"stops" must be an array or an object with "values".');
+    }
+
+    if (metric !== "unitsPerPixel") {
+        throw new Error(
+            'Only "unitsPerPixel" is supported for "stops.metric" in multiscale.'
+        );
+    }
+
+    if (!["x", "y", "auto"].includes(channel)) {
+        throw new Error('"stops.channel" must be one of "x", "y", or "auto".');
+    }
+
+    if (!Number.isFinite(fade) || fade < 0 || fade > 0.5) {
+        throw new Error(
+            '"stops.fade" must be a finite number in range [0, 0.5].'
+        );
+    }
+
+    values.forEach((value, index) => {
+        if (!isExprRef(value) && (!Number.isFinite(value) || value <= 0)) {
+            throw new Error(
+                "Invalid stop value at index " +
+                    index +
+                    ". Stop values must be positive finite numbers."
+            );
+        }
+    });
+
+    if (!values.some(isExprRef)) {
+        const numericValues = /** @type {number[]} */ (values);
+
+        for (let i = 1; i < numericValues.length; i++) {
+            if (numericValues[i - 1] <= numericValues[i]) {
+                throw new Error(
+                    '"stops.values" must be strictly decreasing for "unitsPerPixel".'
+                );
+            }
+        }
+
+        for (let i = 0; i < numericValues.length - 1; i++) {
+            const leftLower = numericValues[i] * (1 - fade);
+            const rightUpper = numericValues[i + 1] * (1 + fade);
+            if (leftLower <= rightUpper) {
+                throw new Error(
+                    "Adjacent transitions overlap. Reduce fade or increase stop spacing."
+                );
+            }
+        }
+    }
+
+    return {
+        metric,
+        values,
+        channel,
+        fade,
+    };
+}
+
+/**
+ * @param {unknown} rawValues
+ * @param {number} stageCount
+ * @param {string} path
+ * @returns {StopValue[]}
+ */
+function parseStopValues(rawValues, stageCount, path) {
+    if (!isArray(rawValues)) {
+        throw new Error(
+            '"' + path + '" must be an array of numbers or ExprRefs.'
+        );
+    }
+
+    const expectedStopCount = stageCount - 1;
+    if (rawValues.length !== expectedStopCount) {
+        throw new Error(
+            "Invalid stop count for multiscale. Expected " +
+                expectedStopCount +
+                ", got " +
+                rawValues.length +
+                "."
+        );
+    }
+
+    for (const value of rawValues) {
+        if (!isExprRef(value) && !Number.isFinite(value)) {
+            throw new Error(
+                '"' + path + '" must contain only numbers or ExprRefs.'
+            );
+        }
+    }
+
+    return /** @type {StopValue[]} */ (rawValues);
+}
+
+/**
+ * @param {number} stageIndex
+ * @param {number} stageCount
+ * @param {ParsedStops} stops
+ * @returns {import("../spec/view.js").DynamicOpacity}
+ */
+function createStageOpacity(stageIndex, stageCount, stops) {
+    /** @type {StopValue[]} */
+    let unitsPerPixel;
+    /** @type {number[]} */
+    let values;
+    const transitions = stops.values.map((stop) => ({
+        hi: scaleStop(stop, 1 + stops.fade),
+        lo: scaleStop(stop, 1 - stops.fade),
+    }));
+
+    if (stageIndex === 0) {
+        unitsPerPixel = [transitions[0].hi, transitions[0].lo];
+    } else if (stageIndex === stageCount - 1) {
+        const last = transitions.at(-1);
+        unitsPerPixel = [last.hi, last.lo];
+    } else {
+        const previous = transitions[stageIndex - 1];
+        const next = transitions[stageIndex];
+
+        unitsPerPixel = [previous.hi, previous.lo, next.hi, next.lo];
+    }
+
+    if (stageIndex === 0) {
+        values = [1, 0];
+    } else if (stageIndex === stageCount - 1) {
+        values = [0, 1];
+    } else {
+        values = [0, 1, 1, 0];
+    }
+
+    return {
+        channel: stops.channel,
+        unitsPerPixel,
+        values,
+    };
+}
+
+/**
+ * @param {StopValue} stop
+ * @param {number} factor
+ * @returns {StopValue}
+ */
+function scaleStop(stop, factor) {
+    if (isExprRef(stop)) {
+        return { expr: "(" + stop.expr + ") * " + factor };
+    } else {
+        return stop * factor;
+    }
+}

package/dist/src/view/multiscale.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=multiscale.test.d.ts.map

package/dist/src/view/multiscale.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"multiscale.test.d.ts","sourceRoot":"","sources":["../../../src/view/multiscale.test.js"],"names":[],"mappings":""}

package/dist/src/view/testUtils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"testUtils.d.ts","sourceRoot":"","sources":["../../../src/view/testUtils.js"],"names":[],"mappings":"AAoBA;;;GAGG;AACH,2DAHW,OAAO,kBAAkB,EAAE,kBAAkB,6CA+DvD;AAGS,uBAAC,CAAC,SAAS,OAAO,WAAW,EAAE,OAAO,QAAQ,QAAQ,aAAa;IAAE,KAAI,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,CAAA;CAAE,uBAAuB,OAAO,kBAAkB,EAAE,kBAAkB,GAAK,OAAO,CAAC,CAAC,CAAC,CAAA;AAgBhL,oCAAC,CAAC,SAAS,OAAO,WAAW,EAAE,OAAO,QAAQ,QAAQ,aAAa;IAAE,KAAI,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,CAAA;CAAE,YAAY,WAAW,YAAY;IAAC,MAAM,EAAE,OAAO,CAAC;IAAC,YAAY,EAAE,OAAO,CAAA;CAAC,GAAK,OAAO,CAAC,CAAC,CAAC,CAAA;;;;;uBAnGpL,OAAO,iBAAiB,EAAE,QAAQ;;;;;0BAClC,OAAO,yBAAyB,EAAE,OAAO"}
+{"version":3,"file":"testUtils.d.ts","sourceRoot":"","sources":["../../../src/view/testUtils.js"],"names":[],"mappings":"AAoBA;;;GAGG;AACH,2DAHW,OAAO,kBAAkB,EAAE,kBAAkB,6CAoEvD;AAGS,uBAAC,CAAC,SAAS,OAAO,WAAW,EAAE,OAAO,QAAQ,QAAQ,aAAa;IAAE,KAAI,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,CAAA;CAAE,uBAAuB,OAAO,kBAAkB,EAAE,kBAAkB,GAAK,OAAO,CAAC,CAAC,CAAC,CAAA;AAgBhL,oCAAC,CAAC,SAAS,OAAO,WAAW,EAAE,OAAO,QAAQ,QAAQ,aAAa;IAAE,KAAI,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,CAAA;CAAE,YAAY,WAAW,YAAY;IAAC,MAAM,EAAE,OAAO,CAAC;IAAC,YAAY,EAAE,OAAO,CAAA;CAAC,GAAK,OAAO,CAAC,CAAC,CAAC,CAAA;;;;;uBAxGpL,OAAO,iBAAiB,EAAE,QAAQ;;;;;0BAClC,OAAO,yBAAyB,EAAE,OAAO"}

package/dist/src/view/testUtils.js

@@ -38,6 +38,8 @@ export function createTestViewContext(viewFactoryOptions = {}) {
         ],
     });
 
+    const dataFlow = new DataFlow();
+
     // @ts-expect-error
     const c = /** @type {ViewContext} */ ({
         createOrImportView: async function (
@@ -55,7 +57,7 @@ export function createTestViewContext(viewFactoryOptions = {}) {
             );
         },
 
-        dataFlow: new DataFlow(),
+        dataFlow,
         genomeStore,
 
         fontManager: new BmFontManager(),
@@ -78,6 +80,9 @@ export function createTestViewContext(viewFactoryOptions = {}) {
 
         isViewConfiguredVisible: () => true,
 
+        addBroadcastListener: () => undefined,
+        removeBroadcastListener: () => undefined,
+
         //...partialContext,
     });
 

package/dist/src/view/unitView.d.ts

@@ -33,25 +33,20 @@ export default class UnitView extends View {
      * @param {Channel} channel
      */
     getDataAccessor(channel: import("../spec/channel.js").Channel): import("../types/encoder.js").Accessor<import("../spec/channel.js").Scalar>;
+    /**
+     * Returns data accessors configured for the `search` channel.
+     *
+     * @returns {import("vega-util").AccessorFn[]}
+     */
+    getSearchAccessors(): import("vega-util").AccessorFn[];
     /**
      * Returns a collector that is associated with this view.
      */
     getCollector(): import("../data/collector.js").default;
     /**
-     * Extracts the domain from the data.
-     *
-     * TODO: Optimize! Now this performs redundant work if multiple views share the same collector.
-     * Also, all relevant fields should be processed in one iteration: https://jsbench.me/y5kkqy52jo/1
-     * In fact, domain extraction could be a responsibility of the collector: As it handles data items,
-     * it extracts domains for all fields (and data types) that need extracted domains.
-     * Alternatively, extractor nodes could be added to the data flow, just like Vega does
-     * (with aggregate and extent).
-     *
-     * @param {Channel} channel
-     * @param {import("../spec/channel.js").Type} type
-     * @returns {DomainArray}
+     * Registers collector subscriptions that keep scale domains up to date.
      */
-    extractDataDomain(channel: import("../spec/channel.js").Channel, type: import("../spec/channel.js").Type): import("../utils/domainArray.js").DomainArray;
+    registerDomainSubscriptions(): void;
     getZoomLevel(): number;
     /**
      * @param {string} channel

package/dist/src/view/unitView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"unitView.d.ts","sourceRoot":"","sources":["../../../src/view/unitView.js"],"names":[],"mappings":"AA6BA;;;;GAIG;AACH,wBAHU,MAAM,CAAC,OAAO,iBAAiB,EAAE,QAAQ,EAAE,cAAc,kBAAkB,EAAE,OAAO,CAAC,CAc7F;AAEF;IAeI;;;;;;;;OAQG;IACH,kBAPW,OAAO,iBAAiB,EAAE,QAAQ,WAClC,OAAO,yBAAyB,EAAE,OAAO,gBACzC,OAAO,oBAAoB,EAAE,OAAO,cACpC,OAAO,WAAW,EAAE,OAAO,QAC3B,MAAM,YACN,OAAO,WAAW,EAAE,WAAW,EAyCzC;IApCG,yCAAgB;IAIZ,iDAAiD;IACjD,MADW,OAAO,kBAAkB,EAAE,OAAO,CACnB;IAoKlC,2DAIC;IAgBD;;;;;OAKG;IAEH,iEAyJC;IAUD;;;;;OAKG;IACH,4IAMC;IAkBD;;OAEG;IACH,uDAEC;IAED;;;;;;;;;;;;;OAaG;IACH,uEAHW,OAAO,oBAAoB,EAAE,IAAI,iDAqB3C;IAED,uBAQC;IAgBD;;;;OAIG;IACH,8BAJW,MAAM,+DAEJ,OAAO,iBAAiB,EAAE,kBAAkB,CAKxD;;CACJ;iBAvgBgB,WAAW"}
+{"version":3,"file":"unitView.d.ts","sourceRoot":"","sources":["../../../src/view/unitView.js"],"names":[],"mappings":"AA+BA;;;;GAIG;AACH,wBAHU,MAAM,CAAC,OAAO,iBAAiB,EAAE,QAAQ,EAAE,cAAc,kBAAkB,EAAE,OAAO,CAAC,CAc7F;AAEF;IAwBI;;;;;;;;OAQG;IACH,kBAPW,OAAO,iBAAiB,EAAE,QAAQ,WAClC,OAAO,yBAAyB,EAAE,OAAO,gBACzC,OAAO,oBAAoB,EAAE,OAAO,cACpC,OAAO,WAAW,EAAE,OAAO,QAC3B,MAAM,YACN,OAAO,WAAW,EAAE,WAAW,EAyCzC;IApCG,yCAAgB;IAIZ,iDAAiD;IACjD,MADW,OAAO,kBAAkB,EAAE,OAAO,CACnB;IAyKlC,2DAIC;IAoBD;;;;;OAKG;IAEH,iEAqJC;IAUD;;;;;OAKG;IACH,4IAMC;IAED;;;;OAIG;IACH,sBAFa,OAAO,WAAW,EAAE,UAAU,EAAE,CAS5C;IAkBD;;OAEG;IACH,uDAEC;IAED;;OAEG;IACH,oCA0EC;IAED,uBAQC;IAgBD;;;;OAIG;IACH,8BAJW,MAAM,+DAEJ,OAAO,iBAAiB,EAAE,kBAAkB,CAKxD;;CACJ;iBAllBgB,WAAW"}

package/dist/src/view/unitView.js

@@ -14,7 +14,7 @@ import {
     isPrimaryPositionalChannel,
     isValueDefWithCondition,
 } from "../encoder/encoder.js";
-import createDomain from "../utils/domainArray.js";
+import { isScaleAccessor } from "../encoder/accessor.js";
 import AxisResolution from "../scales/axisResolution.js";
 import View from "./view.js";
 import {
@@ -24,8 +24,10 @@ import {
     isPointSelectionConfig,
     updateMultiPointSelection,
 } from "../selection/selection.js";
+import { getEncodingSearchFields } from "../encoder/metadataChannels.js";
 import { UNIQUE_ID_KEY } from "../data/transforms/identifier.js";
 import { createEventFilterFunction } from "../utils/expression.js";
+import { field } from "../utils/field.js";
 
 /**
  *
@@ -48,7 +50,6 @@ export const markTypes = {
 export default class UnitView extends View {
     /**
      * @typedef {import("../spec/channel.js").Channel} Channel
-     * @typedef {import("../utils/domainArray.js").DomainArray} DomainArray
      * @typedef {import("../spec/view.js").ResolutionTarget} ResolutionTarget
      * @typedef {((datum: import("../data/flowNode.js").Datum) => import("../spec/channel.js").Scalar) & { fieldDef: import("../spec/channel.js").FieldDef}} FieldAccessor
      *
@@ -60,6 +61,16 @@ export default class UnitView extends View {
      */
     #zoomLevelSetter;
 
+    /**
+     * @type {boolean}
+     */
+    #domainSubscriptionsRegistered = false;
+
+    /**
+     * @type {import("vega-util").AccessorFn[] | null}
+     */
+    #searchAccessors = null;
+
     /**
      *
      * @param {import("../spec/view.js").UnitSpec} spec
@@ -84,7 +95,7 @@ export default class UnitView extends View {
 
         this.resolve();
 
-        this.#zoomLevelSetter = this.paramMediator.allocateSetter(
+        this.#zoomLevelSetter = this.paramRuntime.allocateSetter(
             "zoomLevel",
             1.0
         );
@@ -111,7 +122,7 @@ export default class UnitView extends View {
     }
 
     #setupPointSelection() {
-        for (const [name, param] of this.paramMediator.paramConfigs) {
+        for (const [name, param] of this.paramRuntime.paramConfigs) {
             if (!("select" in param)) {
                 continue;
             }
@@ -134,7 +145,12 @@ export default class UnitView extends View {
                 const none = 0;
                 let lastId = none;
 
-                const setter = this.paramMediator.getSetter(name);
+                const setter = (
+                    /** @type {any} */
+                    selection
+                ) => {
+                    this.paramRuntime.setValue(name, selection);
+                };
 
                 const getHoveredDatum = () => {
                     const h = this.context.getCurrentHover();
@@ -164,7 +180,7 @@ export default class UnitView extends View {
                         if (toggle) {
                             if (datum) {
                                 const previousSelection =
-                                    this.paramMediator.getValue(name);
+                                    this.paramRuntime.getValue(name);
                                 selection = updateMultiPointSelection(
                                     previousSelection,
                                     {
@@ -253,6 +269,10 @@ export default class UnitView extends View {
         const encoding = super.getEncoding();
         const supportedChannels = this.mark.getSupportedChannels();
         for (const channel of Object.keys(encoding)) {
+            if (channel === "key") {
+                continue;
+            }
+
             if (!supportedChannels.includes(channel)) {
                 delete encoding[channel];
             }
@@ -284,6 +304,10 @@ export default class UnitView extends View {
                 continue;
             }
 
+            if (Array.isArray(channelDef)) {
+                continue;
+            }
+
             /** @type {import("../spec/channel.js").ChannelDefWithScale} */
             let channelDefWithScale;
 
@@ -392,23 +416,14 @@ export default class UnitView extends View {
                     });
                 }
 
-                const dataDomainSource =
-                    this.getLayoutAncestors()
-                        // TODO: Should check until the resolved scale resolution
-                        .some(
-                            (view) => !view.options.contributesToScaleDomain
-                        ) ||
-                    (isChannelDefWithScale(channelDefWithScale) &&
-                        channelDefWithScale.contributesToScaleDomain === false)
-                        ? undefined
-                        : this.extractDataDomain.bind(this);
+                const contributesToDomain = !this.isDomainInert();
 
                 const resolution = view.resolutions[type][targetChannel];
                 const unregister = resolution.registerMember({
                     view: this,
                     channel,
                     channelDef: channelDefWithScale,
-                    dataDomainSource,
+                    contributesToDomain,
                 });
                 this.registerDisposer(() => {
                     // Unregister returns true when it removed the last member.
@@ -416,6 +431,7 @@ export default class UnitView extends View {
                         unregister() &&
                         view.resolutions[type][targetChannel] === resolution
                     ) {
+                        resolution.dispose();
                         delete view.resolutions[type][targetChannel];
                     }
                 });
@@ -445,6 +461,20 @@ export default class UnitView extends View {
         return encoders[channel]?.dataAccessor;
     }
 
+    /**
+     * Returns data accessors configured for the `search` channel.
+     *
+     * @returns {import("vega-util").AccessorFn[]}
+     */
+    getSearchAccessors() {
+        if (!this.#searchAccessors) {
+            const fields = getEncodingSearchFields(this.getEncoding()) ?? [];
+            this.#searchAccessors = fields.map((fieldName) => field(fieldName));
+        }
+
+        return this.#searchAccessors;
+    }
+
     /**
      * Returns an accessor that returns a (composite) key for partitioning the data
      *
@@ -469,37 +499,82 @@ export default class UnitView extends View {
     }
 
     /**
-     * Extracts the domain from the data.
-     *
-     * TODO: Optimize! Now this performs redundant work if multiple views share the same collector.
-     * Also, all relevant fields should be processed in one iteration: https://jsbench.me/y5kkqy52jo/1
-     * In fact, domain extraction could be a responsibility of the collector: As it handles data items,
-     * it extracts domains for all fields (and data types) that need extracted domains.
-     * Alternatively, extractor nodes could be added to the data flow, just like Vega does
-     * (with aggregate and extent).
-     *
-     * @param {Channel} channel
-     * @param {import("../spec/channel.js").Type} type
-     * @returns {DomainArray}
+     * Registers collector subscriptions that keep scale domains up to date.
      */
-    extractDataDomain(channel, type) {
-        /** @type {DomainArray} */
-        let domain = createDomain(type);
-
-        (this.mark.encoders[channel]?.accessors ?? [])
-            .filter((a) => a.scaleChannel)
-            .forEach((accessor) => {
-                if (accessor.constant) {
-                    domain.extend(accessor({}));
-                } else {
-                    const collector = this.getCollector();
-                    if (collector?.completed) {
-                        collector.visitData((d) => domain.extend(accessor(d)));
-                    }
+    registerDomainSubscriptions() {
+        if (this.#domainSubscriptionsRegistered) {
+            return;
+        }
+
+        if (this.isDomainInert()) {
+            return;
+        }
+
+        const collector = this.getCollector();
+        if (!collector) {
+            return;
+        }
+
+        const encoders = this.mark.encoders;
+        if (!encoders) {
+            throw new Error("Encoders are not initialized!");
+        }
+
+        this.#domainSubscriptionsRegistered = true;
+
+        /** @type {Map<import("../scales/scaleResolution.js").default, Set<import("../types/encoder.js").ScaleAccessor>>} */
+        const accessorsByResolution = new Map();
+
+        for (const encoder of Object.values(encoders)) {
+            if (!encoder) {
+                continue;
+            }
+
+            const accessors = encoder.accessors ?? [];
+            if (accessors.length === 0) {
+                continue;
+            }
+
+            for (const accessor of accessors) {
+                if (!isScaleAccessor(accessor)) {
+                    continue;
+                }
+                if (accessor.channelDef.domainInert) {
+                    continue;
+                }
+                const resolution = this.getScaleResolution(
+                    accessor.scaleChannel
+                );
+                if (!resolution) {
+                    throw new Error(
+                        "Missing scale resolution for channel: " +
+                            accessor.scaleChannel
+                    );
                 }
-            });
 
-        return domain;
+                let accessorsForResolution =
+                    accessorsByResolution.get(resolution);
+                if (!accessorsForResolution) {
+                    accessorsForResolution = new Set();
+                    accessorsByResolution.set(
+                        resolution,
+                        accessorsForResolution
+                    );
+                }
+                accessorsForResolution.add(accessor);
+            }
+        }
+
+        for (const [resolution, accessors] of accessorsByResolution) {
+            if (accessors.size === 0) {
+                continue;
+            }
+            const unregister = resolution.registerCollectorSubscriptions(
+                collector,
+                accessors
+            );
+            this.registerDisposer(unregister);
+        }
     }
 
     getZoomLevel() {