@genome-spy/core 0.48.1 → 0.49.0

package/dist/src/gl/glslScaleGenerator.js

@@ -10,23 +10,23 @@ import { color as d3color } from "d3-color";
 import {
     getDiscreteRangeMapper,
     isColorChannel,
-    isDatumDef,
     isDiscreteChannel,
     getPrimaryChannel,
-    isValueDef,
     isFieldDef,
 } from "../encoder/encoder.js";
 import { asArray, peek } from "../utils/arrayUtils.js";
 import { InternMap } from "internmap";
-import { isExprRef } from "../view/paramMediator.js";
+import { isExprRef, validateParameterName } from "../view/paramMediator.js";
 import scaleNull from "../utils/scaleNull.js";
 
 export const ATTRIBUTE_PREFIX = "attr_";
 export const DOMAIN_PREFIX = "uDomain_";
 export const RANGE_PREFIX = "range_";
+export const ACCESSOR_FUNCTION_PREFIX = "accessor_";
 export const SCALE_FUNCTION_PREFIX = "scale_";
 export const SCALED_FUNCTION_PREFIX = "getScaled_";
 export const RANGE_TEXTURE_PREFIX = "uRangeTexture_";
+export const PARAM_PREFIX = "uParam_";
 
 // https://stackoverflow.com/a/47543127
 const FLT_MAX = 3.402823466e38;
@@ -51,13 +51,37 @@ function splitScaleType(type) {
     };
 }
 
+/**
+ *
+ * @param {Channel} channel
+ * @param {number} conditionNumber
+ * @returns {string}
+ */
+export function makeAccessorFunctionName(channel, conditionNumber) {
+    return `${ACCESSOR_FUNCTION_PREFIX}${channel}_${conditionNumber}`;
+}
+
+/**
+ * @typedef {object} AccessorParts
+ * @prop {Channel} channel
+ * @prop {string} accessorGlsl
+ * @prop {string} accessorFunctionName
+ * @prop {string} [attributeName]
+ * @prop {string} [attributeGlsl]
+ * @prop {string} [uniformName]
+ * @prop {string} [uniformGlsl]
+ * @prop {(x: any) => any} [adjuster]
+ */
+
 /**
  * Generates GLSL code for a constant value.
  *
  * @param {Channel} channel
+ * @param {number} conditionNumber
  * @param {number | number[] | string | boolean} value
+ * @returns {AccessorParts}
  */
-export function generateConstantValueGlsl(channel, value) {
+export function generateConstantValueGlsl(channel, conditionNumber, value) {
     /** @type {VectorizedValue} */
     let vec;
     if (isDiscreteChannel(channel)) {
@@ -84,13 +108,21 @@ export function generateConstantValueGlsl(channel, value) {
         vec = vectorize(value);
     }
 
-    let glsl = `
-#define ${channel}_DEFINED
-${vec.type} ${SCALED_FUNCTION_PREFIX}${channel}() {
+    const accessorFunctionName = makeAccessorFunctionName(
+        channel,
+        conditionNumber
+    );
+    const accessorGlsl = `
+${vec.type} ${accessorFunctionName}() {
     // Constant value
     return ${vec};
 }`;
-    return glsl;
+
+    return {
+        channel,
+        accessorGlsl,
+        accessorFunctionName,
+    };
 }
 
 /**
@@ -98,8 +130,10 @@ ${vec.type} ${SCALED_FUNCTION_PREFIX}${channel}() {
  * used as dynamic mark properties that map to encoding channels.
  *
  * @param {Channel} channel
+ * @param {number} conditionNumber
+ * @returns {AccessorParts}
  */
-export function generateDynamicValueGlslAndUniform(channel) {
+export function generateDynamicValueGlslAndUniform(channel, conditionNumber) {
     let dataType = "float";
     /** @type {(x: any) => any} */
     let adjuster = (x) => x;
@@ -109,13 +143,16 @@ export function generateDynamicValueGlslAndUniform(channel) {
         adjuster = (x) => cssColorToArray(x);
     }
 
-    const uniformName = `u${capitalize(channel)}`;
+    const uniformName = `u${capitalize(channel)}_${conditionNumber}`;
 
     const uniformGlsl = `    // Dynamic value\n    uniform ${dataType} ${uniformName};`;
 
-    let scaleGlsl = `
-#define ${channel}_DEFINED
-${dataType} ${SCALED_FUNCTION_PREFIX}${channel}() {
+    const accessorFunctionName = makeAccessorFunctionName(
+        channel,
+        conditionNumber
+    );
+    let accessorGlsl = `
+${dataType} ${accessorFunctionName}() {
     // Dynamic value
     return ${uniformName};
 }`;
@@ -124,56 +161,95 @@ ${dataType} ${SCALED_FUNCTION_PREFIX}${channel}() {
         channel,
         uniformName,
         uniformGlsl,
-        scaleGlsl,
+        accessorGlsl,
+        accessorFunctionName,
         adjuster,
     };
 }
 
 /**
- *
  * @param {Channel} channel
- * @param {import("../view/scaleResolution.js").default} scaleResolution TODO: typing
- * @param {import("../spec/channel.js").ChannelDef} channelDef
+ * @param {any} scale
+ * @param {number} conditionNumber
  * @param {Channel[]} [sharedQuantitativeChannels] Channels that share the same quantitative field
+ * @returns {AccessorParts}
  */
-// eslint-disable-next-line complexity
-export function generateScaleGlsl(
+export function generateDataGlsl(
     channel,
-    scaleResolution,
-    channelDef,
+    scale,
+    conditionNumber,
     sharedQuantitativeChannels = [channel]
 ) {
-    if (isValueDef(channelDef)) {
-        throw new Error(
-            `Cannot create scale for "value": ${JSON.stringify(channelDef)}`
-        );
-    }
-
-    /**
-     * Typecast to any to make it easier to handle all the different scale variants
-     * @type {any}
-     */
-    const scale = scaleResolution ? scaleResolution.scale : scaleNull();
-
-    const primary = getPrimaryChannel(channel);
+    const { attributeType } = getAttributeAndArrayTypes(scale, channel);
     const attributeName =
         ATTRIBUTE_PREFIX + makeAttributeName(sharedQuantitativeChannels);
-    const domainUniformName = DOMAIN_PREFIX + primary;
-    const rangeName = RANGE_PREFIX + primary;
 
-    // The attribute has discrete values
-    const discrete = isDiscrete(scale.type);
+    const attributeGlsl = `in highp ${attributeType} ${attributeName};`;
 
-    const hp = isHighPrecisionScale(scale.type);
-    const largeHp = hp && isLargeGenome(scale.domain());
+    const accessorFunctionName = makeAccessorFunctionName(
+        channel,
+        conditionNumber
+    );
 
-    const attributeType = largeHp
-        ? "uvec2"
-        : hp
-        ? "uint"
-        : discrete
-        ? "uint"
-        : "float";
+    const accessorGlsl = `
+${attributeType} ${accessorFunctionName}() {
+    return ${attributeName};
+}`;
+
+    return {
+        channel,
+        attributeName,
+        attributeGlsl,
+        accessorGlsl,
+        accessorFunctionName,
+    };
+}
+/**
+ * @param {Channel} channel
+ * @param {any} scale
+ * @param {number} conditionNumber
+ * @returns {AccessorParts}
+ */
+export function generateDatumGlslAndUniform(channel, scale, conditionNumber) {
+    const { attributeType } = getAttributeAndArrayTypes(scale, channel);
+
+    // TODO: Use uniform prefix
+    const uniformName = ATTRIBUTE_PREFIX + makeAttributeName(channel);
+    const uniformGlsl = `    uniform highp ${attributeType} ${uniformName};`;
+
+    const accessorFunctionName = makeAccessorFunctionName(
+        channel,
+        conditionNumber
+    );
+    const accessorGlsl = `
+${attributeType} ${accessorFunctionName}() {
+    return ${uniformName};
+}`;
+
+    return {
+        channel,
+        uniformName,
+        uniformGlsl,
+        accessorGlsl,
+        accessorFunctionName,
+    };
+}
+
+/**
+ *
+ * @param {Channel} channel
+ * @param {any} scale
+ * @param {import("../spec/channel.js").ChannelDef} channelDef
+ */
+// eslint-disable-next-line complexity
+export function generateScaleGlsl(channel, scale, channelDef) {
+    scale ??= scaleNull();
+
+    const primary = getPrimaryChannel(channel);
+    const domainUniformName = DOMAIN_PREFIX + primary;
+    const rangeUniformName = RANGE_PREFIX + primary;
+
+    const { hp, attributeType } = getAttributeAndArrayTypes(scale, channel);
 
     const domainLength = scale.domain ? scale.domain().length : undefined;
 
@@ -189,8 +265,6 @@ export function generateScaleGlsl(
     glsl.push(`// Channel: ${channel}`);
     glsl.push("");
 
-    glsl.push(`#define ${channel}_DEFINED`);
-
     const { transform } = splitScaleType(scale.type);
 
     /**
@@ -204,14 +278,18 @@ export function generateScaleGlsl(
     let functionCall;
     switch (transform) {
         case "linear":
-            functionCall = makeScaleCall("scaleLinear", "domain", rangeName);
+            functionCall = makeScaleCall(
+                "scaleLinear",
+                "domain",
+                rangeUniformName
+            );
             break;
 
         case "log":
             functionCall = makeScaleCall(
                 "scaleLog",
                 "domain",
-                rangeName,
+                rangeUniformName,
                 scale.base()
             );
             break;
@@ -220,7 +298,7 @@ export function generateScaleGlsl(
             functionCall = makeScaleCall(
                 "scaleSymlog",
                 "domain",
-                rangeName,
+                rangeUniformName,
                 scale.constant()
             );
             break;
@@ -230,7 +308,7 @@ export function generateScaleGlsl(
             functionCall = makeScaleCall(
                 "scalePow",
                 "domain",
-                rangeName,
+                rangeUniformName,
                 scale.exponent()
             );
             break;
@@ -240,7 +318,7 @@ export function generateScaleGlsl(
             functionCall = makeScaleCall(
                 "scaleBandHp",
                 "domain",
-                rangeName,
+                rangeUniformName,
                 scale.paddingInner(),
                 scale.paddingOuter(),
                 scale.align(),
@@ -253,7 +331,7 @@ export function generateScaleGlsl(
             functionCall = makeScaleCall(
                 "scaleBand",
                 "domain",
-                rangeName,
+                rangeUniformName,
                 scale.paddingInner(),
                 scale.paddingOuter(),
                 scale.align(),
@@ -303,17 +381,17 @@ export function generateScaleGlsl(
             }
             rangeUniform = `    uniform ${getFloatVectorType(
                 range.length
-            )} ${rangeName};`;
+            )} ${rangeUniformName};`;
         } else if (range.length && range.every(isNumber)) {
             const vectorizedRange = vectorizeRange(range);
 
             glsl.push(
-                `const ${vectorizedRange.type} ${rangeName} = ${vectorizedRange};`
+                `const ${vectorizedRange.type} ${rangeUniformName} = ${vectorizedRange};`
             );
         }
     }
 
-    const returnType = isColorChannel(channel) ? "vec3" : "float";
+    const returnType = getScaledDataTypeForChannel(channel);
 
     /**
      * An optional interpolator function that maps the transformed value to the range.
@@ -340,10 +418,6 @@ export function generateScaleGlsl(
         interpolate = `getDiscreteColor(${textureUniformName}, int(transformed)).r`;
     }
 
-    const [attributeGlsl, markUniformGlsl] = isDatumDef(channelDef)
-        ? [undefined, `    uniform highp ${attributeType} ${attributeName};`]
-        : [`in highp ${attributeType} ${attributeName};`, undefined];
-
     /** @type {string[]} Channel's scale function*/
     const scaleBody = [];
 
@@ -409,12 +483,6 @@ ${returnType} ${SCALE_FUNCTION_PREFIX}${channel}(${attributeType} value) {
 ${scaleBody.map((x) => `    ${x}\n`).join("")}
 }`);
 
-    // A convenience getter for the scaled value
-    glsl.push(`
-${returnType} ${SCALED_FUNCTION_PREFIX}${channel}() {
-    return ${SCALE_FUNCTION_PREFIX}${channel}(${attributeName});
-}`);
-
     const concatenated = glsl.join("\n");
 
     if (usesDomain && channel == primary) {
@@ -429,18 +497,58 @@ ${returnType} ${SCALED_FUNCTION_PREFIX}${channel}() {
     }
 
     return {
-        attributeName,
-        attributeGlsl,
-        // Ends up in the Mark uniform block
-        markUniformGlsl,
         glsl: concatenated,
         domainUniformName,
         domainUniform,
-        rangeName,
+        rangeUniformName,
         rangeUniform,
     };
 }
 
+/**
+ *
+ * @param {Channel} channel
+ * @param {import("../types/encoder.js").Accessor[]} accessors
+ */
+export function generateConditionalEncoderGlsl(channel, accessors) {
+    const type = getScaledDataTypeForChannel(channel);
+
+    /** @type {string[]}  */
+    const conditions = [];
+    /** @type {string[]}  */
+    const statements = [];
+
+    for (let i = 0; i < accessors.length; i++) {
+        const accessor = accessors[i];
+        const accessorFunctionName = makeAccessorFunctionName(channel, i);
+        const { param, empty } = accessor.predicate;
+
+        const paramUniform = PARAM_PREFIX + validateParameterName(param);
+        const idAttribute = ATTRIBUTE_PREFIX + "uniqueId";
+
+        // Hardcoded condition for single point selection ... for now.
+        conditions.push(
+            param
+                ? `${idAttribute} == ${paramUniform}${
+                      empty ? ` || ${paramUniform} == uint(0)` : ""
+                  }`
+                : null
+        );
+
+        statements.push(
+            accessor.scaleChannel
+                ? `return ${SCALE_FUNCTION_PREFIX}${channel}(${accessorFunctionName}());`
+                : `return ${accessorFunctionName}();`
+        );
+    }
+
+    return `${type} ${SCALED_FUNCTION_PREFIX}${channel}() {
+${ifElseGlsl(conditions, statements)}
+}
+
+#define ${channel}_DEFINED`;
+}
+
 /**
  * Adds a trailing decimal zero so that GLSL is happy.
  *
@@ -506,6 +614,17 @@ function getFloatVectorType(numComponents) {
     }
 }
 
+/**
+ * @param {Channel} channel
+ */
+export function getScaledDataTypeForChannel(channel) {
+    return isColorChannel(channel)
+        ? "vec3"
+        : channel == "uniqueId"
+        ? "uint"
+        : "float";
+}
+
 /**
  * @param {string} color
  */
@@ -551,6 +670,37 @@ function makeFunctionCall(name, ...args) {
     return `${name}(${fixedArgs.join(", ")})`;
 }
 
+/**
+ *
+ * @param {import("../types/encoder.js").VegaScale} scale
+ * @param {import("../spec/channel.js").Channel} channel
+ */
+export function getAttributeAndArrayTypes(scale, channel) {
+    const discrete = scale && isDiscrete(scale.type);
+    const hp = scale && isHighPrecisionScale(scale.type);
+    const largeHp = hp && isLargeGenome(scale.domain());
+
+    /**
+     * @type {{attributeType: string, arrayConstructor: Uint32ArrayConstructor | Uint16ArrayConstructor | Float32ArrayConstructor}}
+     */
+    const props = largeHp
+        ? { attributeType: "uvec2", arrayConstructor: Uint32Array }
+        : hp
+        ? { attributeType: "uint", arrayConstructor: Uint32Array }
+        : discrete
+        ? { attributeType: "uint", arrayConstructor: Uint16Array }
+        : channel == "uniqueId"
+        ? { attributeType: "uint", arrayConstructor: Uint32Array }
+        : { attributeType: "float", arrayConstructor: Float32Array };
+
+    return Object.assign(props, {
+        numComponents: +(props.attributeType.match(/^vec([234])$/)?.[1] ?? 1),
+        discrete,
+        hp,
+        largeHp,
+    });
+}
+
 /**
  * True if scale needs more than 24 bits (float32) of precision.
  *
@@ -686,3 +836,40 @@ export const getRangeForGlsl = (scale, channel) =>
         : scale.range
         ? scale.range()
         : undefined;
+
+/**
+ * @param {string[]} conditions
+ * @param {string[]} statements
+ * @returns {string}
+ */
+export function ifElseGlsl(conditions, statements) {
+    if (conditions.length != statements.length) {
+        throw new Error("Unequal array lengths");
+    }
+
+    const n = conditions.length;
+
+    if (n == 0) {
+        return "";
+    } else if (n == 1 && conditions[0] == null) {
+        return statements[0];
+    }
+
+    const parts = [];
+    for (let i = 0; i < n; i++) {
+        const condition = conditions[i];
+        const ifelse =
+            i == 0
+                ? `if (${condition})`
+                : condition == null && i == n - 1
+                ? `else`
+                : `else if (${condition})`;
+        parts.push(
+            `    ${ifelse} {
+        ${statements[i]}
+    }`
+        );
+    }
+
+    return parts.join("\n");
+}

package/dist/src/gl/includes/picking.vertex.glsl.js

@@ -1,2 +1,2 @@
-const shader = "/**Based on concepts presented at:*https:*https:*/out highp vec4 vPickingColor;/***Passes the unique id to the fragment shader as a color if picking is enabled.*Returns true if picking is enabled.*/bool setupPicking(){if(uPickingEnabled){\n#ifdef uniqueId_DEFINED\nint id=int(getScaled_uniqueId());vPickingColor=vec4(ivec4(id>>0,id>>8,id>>16,0xFF)&0xFF)/float(0xFF);\n#else\nvPickingColor=vec4(1.0);\n#endif\nreturn true;}return false;}";
+const shader = "/**Based on concepts presented at:*https:*https:*/out highp vec4 vPickingColor;/***Passes the unique id to the fragment shader as a color if picking is enabled.*Returns true if picking is enabled.*/bool setupPicking(){if(uPickingEnabled){\n#ifdef uniqueId_DEFINED\nuint id=attr_uniqueId;vPickingColor=vec4(ivec4(id>>0,id>>8,id>>16,id>>24)&0xFF)/float(0xFF);\n#else\nvPickingColor=vec4(1.0);\n#endif\nreturn true;}return false;}";
 export default shader;

package/dist/src/marks/link.common.glsl.js

@@ -1,2 +1,2 @@
-const shader = "layout(std140)uniform Mark{uniform float uArcHeightFactor;uniform float uMinArcHeight;uniform float uMinPickingSize;uniform int uShape;uniform int uOrient;uniform bool uClampApex;uniform float uMaxChordLength;uniform vec2 uArcFadingDistance;uniform int uSegmentBreaks;\n#pragma markUniforms\n};";
+const shader = "layout(std140)uniform Mark{uniform float uArcHeightFactor;uniform float uMinArcHeight;uniform float uMinPickingSize;uniform int uShape;uniform int uOrient;uniform bool uClampApex;uniform float uMaxChordLength;uniform vec2 uArcFadingDistance;uniform bool uNoFadingOnPointSelection;uniform int uSegmentBreaks;\n#pragma markUniforms\n};";
 export default shader;

package/dist/src/marks/link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../src/marks/link.js"],"names":[],"mappings":"AAYA;IA+BQ;;;;;OAKG;IACH,yBAEC;IA2GD;;;;;;MAKC;CAwFR;iBArPgB,WAAW"}
+{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../src/marks/link.js"],"names":[],"mappings":"AAYA;IAgCQ;;;;;OAKG;IACH,yBAEC;IAoHD;;;;;;MAKC;CAwFR;iBA/PgB,WAAW"}

package/dist/src/marks/link.js

@@ -35,6 +35,7 @@ export default class LinkMark extends Mark {
                 clampApex: false,
                 maxChordLength: 50000,
                 arcFadingDistance: false,
+                noFadingOnPointSelection: true,
 
                 linkShape: "arc",
                 orient: "vertical",
@@ -138,10 +139,19 @@ export default class LinkMark extends Mark {
             props.segments,
             (x) => x + 1
         );
+        this.registerMarkUniformValue(
+            "uNoFadingOnPointSelection",
+            props.noFadingOnPointSelection,
+            (x) => !!x
+        );
     }
 
     updateGraphicsData() {
         const collector = this.unitView.getCollector();
+        if (!collector) {
+            console.debug("No collector");
+            return;
+        }
         const itemCount = collector.getItemCount();
 
         const builder = new LinkVertexBuilder({

package/dist/src/marks/link.vertex.glsl.js

@@ -1,2 +1,2 @@
-const shader = "out vec4 vColor;out float vSize;out float vNormalLengthInPixels;const int SHAPE_ARC=0;const int SHAPE_DOME=1;const int SHAPE_DIAGONAL=2;const int SHAPE_LINE=3;const int ORIENT_VERTICAL=0;const int ORIENT_HORIZONTAL=1;float distanceFromLine(vec2 pointOnLine1,vec2 pointOnLine2,vec2 point){vec2 a=point-pointOnLine1;vec2 b=pointOnLine2-pointOnLine1;vec2 proj=dot(a,b)/dot(b,b)*b;return length(a-proj);}bool isInsideViewport(vec2 point,float marginFactor){vec2 margin=uViewportSize*vec2(marginFactor);return point.x>=-margin.x&&point.x<=uViewportSize.x+margin.x&&point.y>=-margin.y&&point.y<=uViewportSize.y+margin.y;}void main(void){float pixelSize=1.0/uDevicePixelRatio;float opacity=getScaled_opacity()*uViewOpacity;vec2 p1,p2,p3,p4;vec2 a=applySampleFacet(vec2(getScaled_x(),getScaled_y()))*uViewportSize;vec2 b=applySampleFacet(vec2(getScaled_x2(),getScaled_y2()))*uViewportSize;if(uShape<=SHAPE_DOME){if(uShape==SHAPE_DOME){vec2 height=vec2(0.0);if(uOrient==ORIENT_VERTICAL){p1=vec2(min(a.x,b.x),b.y);p4=vec2(max(a.x,b.x),b.y);height=vec2(0.0,a.y-b.y);if(uClampApex){if(p4.x>0.0){p1.x=max(p1.x,-p4.x);}if(p1.x<uViewportSize.x){p4.x=min(p4.x,2.0*uViewportSize.x-p1.x);}}}else{p1=vec2(b.x,min(a.y,b.y));p4=vec2(b.x,max(a.y,b.y));height=vec2(a.x-b.x,0.0);if(uClampApex){if(p4.y>0.0){p1.y=max(p1.y,-p4.y);}if(p1.y<uViewportSize.y){p4.y=min(p4.y,2.0*uViewportSize.y-p1.y);}}}vec2 controlOffset=height/0.75;p2=p1+controlOffset;p3=p4+controlOffset;}if(uShape==SHAPE_ARC){p1=a;p4=b;vec2 chordVector=p4-p1;vec2 unitChordVector=normalize(chordVector);vec2 chordNormal=vec2(-unitChordVector.y,unitChordVector.x);float chordLength=length(chordVector);if(chordLength>uMaxChordLength){if(isInsideViewport(p1,2.0)){chordLength=uMaxChordLength;p4=p1+unitChordVector*uMaxChordLength;}else if(isInsideViewport(p4,2.0)){chordLength=uMaxChordLength;p1=p4-unitChordVector*uMaxChordLength;}}float height=max(chordLength/2.0*uArcHeightFactor,uMinArcHeight);vec2 controlOffset=chordNormal*height/0.75;p2=p1+controlOffset;p3=p4+controlOffset;}}else if(uShape==SHAPE_DIAGONAL){if(uOrient==ORIENT_VERTICAL){p1=a;p2=vec2(a.x,(a.y+b.y)/2.0);p3=vec2(b.x,(a.y+b.y)/2.0);p4=b;}else{p1=a;p2=vec2((a.x+b.x)/2.0,a.y);p3=vec2((a.x+b.x)/2.0,b.y);p4=b;}}else if(uShape==SHAPE_LINE){p1=a;p2=(a+b)/2.0;p3=p2;p4=b;}vec2 strip=vec2(float(gl_VertexID/2)/float(uSegmentBreaks),float(gl_VertexID % 2)-0.5);float t=smoothstep(0.0,1.0,strip.x);vec2 C1=p4-3.0*p3+3.0*p2-p1;vec2 C2=3.0*p3-6.0*p2+3.0*p1;vec2 C3=3.0*p2-3.0*p1;vec2 C4=p1;vec2 p;if(t==0.0){p=p1;}else if(t==1.0){p=p4;}else{p=C1*t*t*t+C2*t*t+C3*t+C4;}vec2 tangent=normalize(3.0*C1*t*t+2.0*C2*t+C3);vec2 normal=vec2(-tangent.y,tangent.x);float size=getScaled_size();if(size<pixelSize){opacity*=size/pixelSize;size=pixelSize;}float paddedSize=uPickingEnabled? max(size,uMinPickingSize): size+pixelSize;vNormalLengthInPixels=strip.y*paddedSize;if(uShape==SHAPE_ARC&&uArcFadingDistance[0]>0.0&&uArcFadingDistance[1]>0.0){float d=distanceFromLine(p1,p4,p);float distanceOpacity=smoothstep(uArcFadingDistance[1],uArcFadingDistance[0],d);opacity*=distanceOpacity;if(distanceOpacity<=0.0){vNormalLengthInPixels=0.0;}}p+=normal*vNormalLengthInPixels;gl_Position=pixelsToNdc(p);vec3 color=getScaled_color();vColor=vec4(color*opacity,opacity);vSize=paddedSize;setupPicking();}";
+const shader = "out vec4 vColor;out float vSize;out float vNormalLengthInPixels;const int SHAPE_ARC=0;const int SHAPE_DOME=1;const int SHAPE_DIAGONAL=2;const int SHAPE_LINE=3;const int ORIENT_VERTICAL=0;const int ORIENT_HORIZONTAL=1;float distanceFromLine(vec2 pointOnLine1,vec2 pointOnLine2,vec2 point){vec2 a=point-pointOnLine1;vec2 b=pointOnLine2-pointOnLine1;vec2 proj=dot(a,b)/dot(b,b)*b;return length(a-proj);}bool isInsideViewport(vec2 point,float marginFactor){vec2 margin=uViewportSize*vec2(marginFactor);return point.x>=-margin.x&&point.x<=uViewportSize.x+margin.x&&point.y>=-margin.y&&point.y<=uViewportSize.y+margin.y;}void main(void){float pixelSize=1.0/uDevicePixelRatio;float opacity=getScaled_opacity()*uViewOpacity;vec2 p1,p2,p3,p4;vec2 a=applySampleFacet(vec2(getScaled_x(),getScaled_y()))*uViewportSize;vec2 b=applySampleFacet(vec2(getScaled_x2(),getScaled_y2()))*uViewportSize;if(uShape<=SHAPE_DOME){if(uShape==SHAPE_DOME){vec2 height=vec2(0.0);if(uOrient==ORIENT_VERTICAL){p1=vec2(min(a.x,b.x),b.y);p4=vec2(max(a.x,b.x),b.y);height=vec2(0.0,a.y-b.y);if(uClampApex){if(p4.x>0.0){p1.x=max(p1.x,-p4.x);}if(p1.x<uViewportSize.x){p4.x=min(p4.x,2.0*uViewportSize.x-p1.x);}}}else{p1=vec2(b.x,min(a.y,b.y));p4=vec2(b.x,max(a.y,b.y));height=vec2(a.x-b.x,0.0);if(uClampApex){if(p4.y>0.0){p1.y=max(p1.y,-p4.y);}if(p1.y<uViewportSize.y){p4.y=min(p4.y,2.0*uViewportSize.y-p1.y);}}}vec2 controlOffset=height/0.75;p2=p1+controlOffset;p3=p4+controlOffset;}if(uShape==SHAPE_ARC){p1=a;p4=b;vec2 chordVector=p4-p1;vec2 unitChordVector=normalize(chordVector);vec2 chordNormal=vec2(-unitChordVector.y,unitChordVector.x);float chordLength=length(chordVector);if(chordLength>uMaxChordLength){if(isInsideViewport(p1,2.0)){chordLength=uMaxChordLength;p4=p1+unitChordVector*uMaxChordLength;}else if(isInsideViewport(p4,2.0)){chordLength=uMaxChordLength;p1=p4-unitChordVector*uMaxChordLength;}}float height=max(chordLength/2.0*uArcHeightFactor,uMinArcHeight);vec2 controlOffset=chordNormal*height/0.75;p2=p1+controlOffset;p3=p4+controlOffset;}}else if(uShape==SHAPE_DIAGONAL){if(uOrient==ORIENT_VERTICAL){p1=a;p2=vec2(a.x,(a.y+b.y)/2.0);p3=vec2(b.x,(a.y+b.y)/2.0);p4=b;}else{p1=a;p2=vec2((a.x+b.x)/2.0,a.y);p3=vec2((a.x+b.x)/2.0,b.y);p4=b;}}else if(uShape==SHAPE_LINE){p1=a;p2=(a+b)/2.0;p3=p2;p4=b;}vec2 strip=vec2(float(gl_VertexID/2)/float(uSegmentBreaks),float(gl_VertexID % 2)-0.5);float t=smoothstep(0.0,1.0,strip.x);vec2 C1=p4-3.0*p3+3.0*p2-p1;vec2 C2=3.0*p3-6.0*p2+3.0*p1;vec2 C3=3.0*p2-3.0*p1;vec2 C4=p1;vec2 p;if(t==0.0){p=p1;}else if(t==1.0){p=p4;}else{p=C1*t*t*t+C2*t*t+C3*t+C4;}vec2 tangent=normalize(3.0*C1*t*t+2.0*C2*t+C3);vec2 normal=vec2(-tangent.y,tangent.x);float size=getScaled_size();if(size<pixelSize){opacity*=size/pixelSize;size=pixelSize;}float paddedSize=uPickingEnabled? max(size,uMinPickingSize): size+pixelSize;vNormalLengthInPixels=strip.y*paddedSize;if(uShape==SHAPE_ARC&&uArcFadingDistance[0]>0.0&&uArcFadingDistance[1]>0.0&&(!uNoFadingOnPointSelection||!isPointSelected())){float d=distanceFromLine(p1,p4,p);float distanceOpacity=smoothstep(uArcFadingDistance[1],uArcFadingDistance[0],d);opacity*=distanceOpacity;if(distanceOpacity<=0.0){vNormalLengthInPixels=0.0;}}p+=normal*vNormalLengthInPixels;gl_Position=pixelsToNdc(p);vec3 color=getScaled_color();vColor=vec4(color*opacity,opacity);vSize=paddedSize;setupPicking();}";
 export default shader;

package/dist/src/marks/mark.d.ts

@@ -20,8 +20,8 @@ export default class Mark {
      */
     constructor(unitView: import("../view/unitView.js").default);
     unitView: import("../view/unitView.js").default;
-    /** @type {Record<string, import("../types/encoder.js").Encoder>} */
-    encoders: Record<string, import("../types/encoder.js").Encoder>;
+    /** @type {Partial<Record<Channel, import("../types/encoder.js").Encoder>>} */
+    encoders: Partial<Record<import("../spec/channel.js").Channel, import("../types/encoder.js").Encoder>>;
     /**
      * @type {import("twgl.js").BufferInfo & { allocatedVertices?: number }}
      * @protected
@@ -85,9 +85,6 @@ export default class Mark {
     /**
      * Returns attribute info for WebGL attributes that match visual channels.
      *
-     * Note: attributes and channels do not necessarily match.
-     * For example, rectangles have x, y, x2, and y2 channels but only x and y as attributes.
-     *
      * @returns {string[]}
      */
     getAttributes(): string[];
@@ -98,14 +95,14 @@ export default class Mark {
     /**
      * @returns {Encoding}
      */
-    getDefaultEncoding(): import("../spec/channel.js").Encoding<string>;
+    getDefaultEncoding(): import("../spec/channel.js").Encoding;
     /**
      * Adds intelligent defaults etc to the encoding.
      *
      * @param {Encoding} encoding
      * @returns {Encoding}
      */
-    fixEncoding(encoding: import("../spec/channel.js").Encoding<string>): import("../spec/channel.js").Encoding<string>;
+    fixEncoding(encoding: import("../spec/channel.js").Encoding): import("../spec/channel.js").Encoding;
     /**
      * Handles dynamic properties that are not bound to uniforms but need
      * to trigger a graphics update, i.e., rebuild the vertex buffer.
@@ -119,7 +116,7 @@ export default class Mark {
      *
      * @returns {Encoding}
      */
-    get encoding(): import("../spec/channel.js").Encoding<string>;
+    get encoding(): import("../spec/channel.js").Encoding;
     getContext(): import("../types/viewContext.js").default;
     getType(): import("../spec/mark.js").MarkType;
     initializeData(): void;
@@ -136,7 +133,7 @@ export default class Mark {
      * Update WebGL buffers from the data
      */
     updateGraphicsData(): void;
-    getSampleFacetMode(): "SAMPLE_FACET_TEXTURE" | "SAMPLE_FACET_UNIFORM";
+    getSampleFacetMode(): "SAMPLE_FACET_UNIFORM" | "SAMPLE_FACET_TEXTURE";
     /**
      *
      * @param {string} vertexShader

package/dist/src/marks/mark.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mark.d.ts","sourceRoot":"","sources":["../../../src/marks/mark.js"],"names":[],"mappings":"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"}
+{"version":3,"file":"mark.d.ts","sourceRoot":"","sources":["../../../src/marks/mark.js"],"names":[],"mappings":";AAoDA,0DAA2D;AAC3D,0DAA2D;AAE3D;;;;;;;;;;;;GAYG;AACH;IAgBI;;OAEG;IACH,sBAFW,OAAO,qBAAqB,EAAE,OAAO,EAuG/C;IApGG,gDAAwB;IAExB,8EAA8E;IAC9E,uGAAyB;IAIzB;;;OAGG;IACH,sBAHU,OAAO,SAAS,EAAE,UAAU,GAAG;QAAE,iBAAiB,CAAC,EAAE,MAAM,CAAA;KAAE,CAG5C;IAE3B;;;;;;;OAOG;IACH,2BAHU,IAAI,MAAM,EAAE,MAAM,CAAC,CAGG;IAEhC;;;OAGG;IACH,uBAHU,OAAO,SAAS,EAAE,WAAW,CAGX;IAE5B;;;OAGG;IACH,2BAHU,OAAO,SAAS,EAAE,eAAe,CAGX;IAEhC;;;OAGG;IACH,2BAHU,OAAO,SAAS,EAAE,gBAAgB,CAGZ;IAEhC;;;;;OAKG;IACH,2BAHU,OAAO,SAAS,EAAE,gBAAgB,CAGZ;IAEhC;;;;;OAKG;IACH,uCAA+B;IAE/B,kFAAkF;IAClF,UADW,SAAS,GAAG,CAAC,CACM;IAG9B,wBAAwB;IACxB,uDAqBC;IAED;;;;;;;;OAQG;IACH,kEAKC;IAGL,sBAEC;IAED;;;;OAIG;IACH,iBAFa,MAAM,EAAE,CAKpB;IAED;;OAEG;IACH,+DAWC;IAED;;OAEG;IACH,4DAcC;IAED;;;;;OAKG;IACH,oGAEC;IAED;;;;;;OAMG;IACH,yGAkCC;IAED;;;;OAIG;IACH,sDAiDC;IAED,wDAEC;IAED,8CAEC;IAED,uBAEC;IAED;;;OAGG;IACH,2BAEC;IAED;;OAEG;IACH,oCAEC;IAED;;OAEG;IACH,2BAEC;IAED,sEAeC;IAED;;;;;;OAMG;IAEH,6CANW,MAAM,kBACN,MAAM,iBACN,MAAM,EAAE,QA8UlB;IALG;;;;;;MAIC;IAGL;;;;;;OAMG;IACH,uCA6CC;IAED;;;;;;OAMG;IACH,+CAHW,MAAM,UACK,GAAG,KAAE,IAAI,CAe9B;IAED;;;;;;;;;;OAUG;IACH,mDAJW,MAAM,sFAEsB,GAAG,QA6BzC;IAED;;OAEG;IACH,2BAwBC;IAED;;;OAGG;IACH,6BAFW,GAAG,QAyCb;IAED,yBAAyB;IACzB,uDAEC;IAED,yBAAyB;IACzB,iCAEC;IAED,gCAEC;IAED,+BAEC;IAED,yCAEC;IAED;;;;;OAKG;IACH,gCAcC;IAED;;OAEG;IACH,4CAOC;IAED;;;;;;;;OAQG;IAEH,uBAJW,OAAO,uBAAuB,EAAE,sBAAsB,GACpD,CAAC,MAAM,IAAI,CAAC,EAAE,CAsF1B;IAED;;;;;;OAMG;IACH,qCAJW,oBAAoB,GAClB,OAAO,CAqCnB;IAED;;;;;;;OAOG;IACH,gBAJW,oBAAoB,SACP,IAAI,CAM3B;IAED;;;OAGG;IACH,2BAHW,YAAY,WACZ,OAAO,WAAW,EAAE,oBAAoB,cAiElD;IAED;;;;;;OAMG;IACH,oBAJW,OAAO,6BAA6B,EAAE,OAAO,aAC7C,OAAO,6BAA6B,EAAE,OAAO,GAC3C,OAAO,CAuHnB;IAED;;;;;;;;;OASG;IACH,qBAJW,MAAM,KACN,OAAO,oBAAoB,EAAE,MAAM,GACjC,GAAG,CAIf;;CACJ;+BAvwCY,OAAO,uBAAuB,EAAE,gBAAgB;;;;;;wBAEnD,OAAO;;mCAEJ,gBAAgB,GAAG,qBAAqB;oCAG1C,MAAM,SACN,MAAM;AAiwCjB;;;GAGG;AACH;IACI,cAEC;IAkBD;;;OAGG;IACH,2BAFW,IAAI,CAAC,EAAE,OAAO,yBAAyB,EAAE,UAAU,CAAC,QAiB9D;CACJ;0BAj0CyB,WAAW"}