@genome-spy/core 0.29.0 → 0.30.2

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

@@ -1,27 +0,0 @@
-/*
- * Based on concepts presented at:
- * https://webglfundamentals.org/webgl/lessons/webgl-picking.html
- * https://deck.gl/docs/developer-guide/custom-layers/picking
- */
-
-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) {
-#ifdef uniqueId_DEFINED
-        int id = int(getScaled_uniqueId());
-        // TODO: Take the sign bit into account
-        vPickingColor = vec4(
-            ivec4(id >> 0, id >> 8, id >> 16, 0xFF) & 0xFF
-        ) / float(0xFF);
-#else
-        vPickingColor = vec4(1.0);
-#endif
-        return true;
-    }
-    return false;
-}

package/src/gl/includes/sampleFacet.glsl

@@ -1,107 +0,0 @@
-
-/**
- * Describes where a sample facet should be shown. Interpolating between the
- * current and target positions/heights allows for transitioning between facet
- * configurations.
- */
-struct SampleFacetPosition {
-    float pos;
-    float height;
-    float targetPos;
-    float targetHeight;
-};
-
-/**
- * Trasition fraction [0, 1] between the current and target configurations.
- */
-uniform float uTransitionOffset;
-
-
-// ----------------------------------------------------------------------------
-
-#if !defined(SAMPLE_FACET_UNIFORM) && !defined(SAMPLE_FACET_TEXTURE)
-
-SampleFacetPosition getSampleFacetPos() {
-    return SampleFacetPosition(0.0, 1.0, 0.0, 1.0);
-}
-
-#elif defined(SAMPLE_FACET_UNIFORM)
-
-/**
- * Location and height of the band on the Y axis on a normalized [0, 1] scale.
- * Elements: curr pos, curr height, target pos, target height
- */
-uniform vec4 uSampleFacet;
-
-SampleFacetPosition getSampleFacetPos() {
-    return SampleFacetPosition(
-        1.0 - uSampleFacet.x - uSampleFacet.y,
-        uSampleFacet.y,
-        1.0 - uSampleFacet.z - uSampleFacet.w,
-        uSampleFacet.w
-    );
-}
-
-#elif defined(SAMPLE_FACET_TEXTURE)
-
-uniform sampler2D uSampleFacetTexture;
-
-SampleFacetPosition getSampleFacetPos() {
-    vec4 texel = texelFetch(uSampleFacetTexture, ivec2(int(attr_facetIndex), 0), 0);
-    return SampleFacetPosition(
-        1.0 - texel.r - texel.g,
-        texel.g,
-        1.0 - texel.r - texel.g,
-        texel.g);
-}
-
-#endif
-
-// ----------------------------------------------------------------------------
-
-bool isFacetedSamples(SampleFacetPosition facetPos) {
-    return facetPos != SampleFacetPosition(0.0, 1.0, 0.0, 1.0);
-}
-
-bool isFacetedSamples() {
-    return isFacetedSamples(getSampleFacetPos());
-}
-
-bool isInTransit() {
-    return uTransitionOffset > 0.0;
-}
-
-float getTransitionFraction(float xPos) {
-    return smoothstep(0.0, 0.7 + uTransitionOffset, (xPos - uTransitionOffset) * 2.0);
-}
-
-vec2 applySampleFacet(vec2 pos) {
-    SampleFacetPosition facetPos = getSampleFacetPos();
-
-    if (!isFacetedSamples(facetPos)) {
-        return pos;
-    } else if (isInTransit()) {
-        vec2 interpolated = mix(
-            vec2(facetPos.pos, facetPos.height),
-            vec2(facetPos.targetPos, facetPos.targetHeight),
-            getTransitionFraction(pos.x));
-        return vec2(pos.x, interpolated[0] + pos.y * interpolated[1]);
-    } else {
-        return vec2(pos.x, facetPos.pos + pos.y * facetPos.height);
-    }
-}
-
-float getSampleFacetHeight(vec2 pos) {
-    SampleFacetPosition facetPos = getSampleFacetPos();
-
-    if (!isFacetedSamples(facetPos)) {
-        return 1.0;
-    } else if (isInTransit()) {
-        return mix(
-            facetPos.height,
-            facetPos.targetHeight,
-            getTransitionFraction(pos.x));
-    } else {
-        return facetPos.height;
-    }
-}

package/src/gl/includes/scales.glsl

@@ -1,112 +0,0 @@
-const float inf = 1.0 / 0.0;
-
-// Utils ------------
-
-vec3 getDiscreteColor(sampler2D s, int index) {
-    return texelFetch(s, ivec2(index % textureSize(s, 0).x, 0), 0).rgb;
-}
-
-vec3 getInterpolatedColor(sampler2D s, float unitValue) {
-    return texture(s, vec2(unitValue, 0.0)).rgb;
-}
-
-float clampToRange(float value, vec2 range) {
-    return clamp(value, min(range[0], range[1]), max(range[0], range[1]));
-}
-
-// Scales ------------
-// Based on d3 scales: https://github.com/d3/d3-scale
-
-float scaleIdentity(float value) {
-    return value;
-}
-
-float scaleLinear(float value, vec2 domain, vec2 range) {
-    float domainSpan = domain[1] - domain[0];
-    float rangeSpan = range[1] - range[0];
-    return (value - domain[0]) / domainSpan * rangeSpan + range[0];
-}
-
-float scaleLog(float value, vec2 domain, vec2 range, float base) {
-    // y = m log(x) + b 
-    // TODO: Perf optimization: precalculate log domain in js.
-    // TODO: Reversed domain, etc
-    return scaleLinear(log(value) / log(base), log(domain) / log(base), range);
-}
-
-float symlog(float value, float constant) {
-    // WARNING: emulating log1p with log(x + 1). Small numbers are likely to
-    // have significant precision problems.
-    return sign(value) * log(abs(value / constant) + 1.0);
-}
-
-float scaleSymlog(float value, vec2 domain, vec2 range, float constant) {
-    return scaleLinear(
-        symlog(value, constant),
-        vec2(symlog(domain[0], constant), symlog(domain[1], constant)),
-        range
-    );
-}
-
-float scalePow(float value, vec2 domain, vec2 range, float exponent) {
-    // y = mx^k + b
-    // TODO: Perf optimization: precalculate pow domain in js.
-    // TODO: Reversed domain, etc
-    return scaleLinear(
-        pow(abs(value), exponent) * sign(value),
-        pow(abs(domain), vec2(exponent)) * sign(domain),
-        range
-    );
-}
-
-// TODO: scaleThreshold
-// TODO: scaleQuantile (special case of threshold scale)
-
-float scaleBand(float value, vec2 domainExtent, vec2 range,
-                float paddingInner, float paddingOuter,
-                float align, float band) {
-
-    // TODO: reverse
-    float start = range[0];
-    float stop = range[1];
-    float rangeSpan = stop - start;
-
-    float n = domainExtent[1] - domainExtent[0];
-
-    // This fix departs from Vega and d3: https://github.com/vega/vega/issues/3357#issuecomment-1063253596
-    paddingInner = int(n) > 1 ? paddingInner : 0.0;
-
-    // Adapted from: https://github.com/d3/d3-scale/blob/master/src/band.js
-    float step = rangeSpan / max(1.0, n - paddingInner + paddingOuter * 2.0);
-    start += (rangeSpan - step * (n - paddingInner)) * align;
-    float bandwidth = step * (1.0 - paddingInner);
-
-    return start + (value - domainExtent[0]) * step + bandwidth * band;
-}
-
-// High precision variant of scaleBand for index/locus scales
-float scaleBandHp(vec2 value, vec3 domainExtent, vec2 range,
-                 float paddingInner, float paddingOuter,
-                 float align, float band) {
-
-    // TODO: reverse
-    float start = range[0];
-    float stop = range[1];
-    float rangeSpan = stop - start;
-
-    vec2 domainStart = domainExtent.xy;
-    float n = domainExtent[2];
-
-    // The following computation is identical for every vertex. Could be done on the JS side.
-    float step = rangeSpan / max(1.0, n - paddingInner + paddingOuter * 2.0);
-    start += (rangeSpan - step * (n - paddingInner)) * align;
-    float bandwidth = step * (1.0 - paddingInner);
-
-    // Using max to prevent the shader compiler from wrecking the precision.
-    // Othwewise the compiler could optimize the sum of the four terms into
-    // some equivalent form that does premature rounding.
-    float hi = max(value[0] - domainStart[0], -inf);
-    float lo = max(value[1] - domainStart[1], -inf);
-
-    return dot(vec4(start, hi, lo, bandwidth), vec4(1.0, step, step, band));
-}

package/src/gl/link.fragment.glsl

@@ -1,18 +0,0 @@
-in lowp vec4 vColor;
-in float vSize;
-in float vNormalLengthInPixels;
-
-out lowp vec4 fragColor;
-
-void main(void) {
-    float dpr = uDevicePixelRatio;
-
-    float distance = abs(vNormalLengthInPixels);
-    float opacity = clamp(((vSize / 2.0 - distance) * dpr), 0.0, 1.0);
-
-    fragColor = vColor * opacity;
-
-    if (uPickingEnabled) {
-        fragColor = vPickingColor;
-    }
-}

package/src/gl/link.vertex.glsl

@@ -1,111 +0,0 @@
-uniform float uSagittaScaleFactor;
-
-/** Make very small arcs visible */
-uniform float uMinSagittaLength;
-
-in vec2 strip;
-
-out vec4 vColor;
-
-/** Stroke width */
-out float vSize;
-
-/** The distance from the line center to the direction of normal in pixels */
-out float vNormalLengthInPixels;
-
-void main(void) {
-    float pixelSize = 1.0 / uDevicePixelRatio;
-    float opacity = getScaled_opacity() * uViewOpacity;
-
-    vec2 a = vec2(getScaled_x(), getScaled_y()) * uViewportSize;
-    vec2 b = vec2(getScaled_x2(), getScaled_y2()) * uViewportSize;
-    
-    vec2 chordVector = b - a;
-    vec2 unitChordVector = normalize(chordVector);
-    vec2 chordNormal = vec2(-unitChordVector.y, unitChordVector.x);
-
-    float sagitta = max(
-        length(chordVector) / 2.0 * uSagittaScaleFactor,
-        uMinSagittaLength
-    );
-
-    bool compress = false;
-    if (compress) {
-        // Work in progres...
-        float maxSagittaLen = length(chordNormal * uViewportSize);
-        float maxChordLen = length(unitChordVector * uViewportSize);
-
-        float threshold = maxSagittaLen * 0.5;
-        if (sagitta > threshold) {
-            float m = (maxSagittaLen - threshold) / (maxChordLen - threshold);
-            sagitta = (sagitta - threshold) * m + threshold;
-        }
-    }
-
-    vec2 controlOffset = chordNormal * sagitta / 0.75;
-
-    vec2 p1 = a;
-    vec2 p2 = a + controlOffset;
-    vec2 p3 = b + controlOffset;
-    vec2 p4 = b;
-
-    // Make segments shorter near the endpoints to make the tightly bent attachment points smoother
-    float t = smoothstep(0.0, 1.0, strip.x);
-
-    // https://stackoverflow.com/a/31317254/1547896
-    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;
-    // Skip computation at endpoints to maintain precision
-    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);
-
-    //p = applySampleFacet(p);
-
-#ifdef size2_DEFINED
-    float mixedSize = mix(getScaled_size(), getScaled_size2(), t);
-#else
-    float mixedSize = getScaled_size();
-#endif
-
-    // Avoid artifacts in very thin lines by clamping the size and adjusting opacity respectively
-    if (mixedSize < pixelSize) {
-        opacity *= mixedSize / pixelSize;
-        mixedSize = pixelSize;
-    }
-
-    // Add an extra pixel to stroke width to accommodate edge antialiasing
-    float paddedSize = mixedSize + pixelSize;
-
-    vNormalLengthInPixels = strip.y * paddedSize;
-    
-    // Extrude
-    p += normal * vNormalLengthInPixels;
-
-    gl_Position = pixelsToNdc(p);
-
-#ifdef color2_DEFINED
-    // Yuck, RGB interpolation in gamma space!
-    // TODO: linear space: https://unlimited3d.wordpress.com/2020/01/08/srgb-color-space-in-opengl/
-    vec3 color = mix(getScaled_color(), getScaled_color2(), t);
-#else 
-    vec3 color = getScaled_color();
-#endif
-
-    vColor = vec4(color * opacity, opacity);
-
-    vSize = paddedSize;
-
-    setupPicking();
-}

package/src/gl/point.fragment.glsl

@@ -1,123 +0,0 @@
-const lowp vec4 white = vec4(1.0);
-const lowp vec4 black = vec4(0.0, 0.0, 0.0, 1.0);
-
-uniform bool uInwardStroke;
-uniform float uGradientStrength;
-
-in float vRadius;
-in float vRadiusWithPadding;
-
-in lowp vec4 vFillColor;
-in lowp vec4 vStrokeColor;
-in lowp float vShape;
-in lowp float vHalfStrokeWidth;
-
-in mat2 vRotationMatrix;
-
-out lowp vec4 fragColor;
-
-const float CIRCLE = 0.0;
-const float SQUARE = 1.0;
-const float TRIANGLE_UP = 2.0;
-const float CROSS = 3.0;
-const float DIAMOND = 4.0;
-const float TRIANGLE_DOWN = 5.0;
-const float TRIANGLE_RIGHT = 6.0;
-const float TRIANGLE_LEFT = 7.0;
-
-
-// The distance functions are inspired by:
-// http://www.iquilezles.org/www/articles/distfunctions2d/distfunctions2d.htm
-// However, these are not true distance functions, because the corners need to be sharp.
-
-float circle(vec2 p, float r) {
-    return length(p) - r;
-}
-
-float square(vec2 p, float r) {
-    p = abs(p);
-    return max(p.x, p.y) - r;
-}
-
-float equilateralTriangle(vec2 p, float r, bool flip, bool swap) {
-    if (swap) {
-        p.xy = p.yx;
-    }
-    if (flip) {
-        p.y = -p.y;
-    }
-
-    float k = sqrt(3.0);
-    float kr = k * r;
-    //p.y -= kr * 2.0 / 3.0;
-    p.y -= kr / 2.0;
-    return max((abs(p.x) * k + p.y) / 2.0, -p.y - kr);
-}
-
-float crossShape(vec2 p, float r) {
-    p = abs(p);
-
-	vec2 b = vec2(0.4, 1.0) * r;
-    vec2 v = abs(p) - b.xy;
-    vec2 h = abs(p) - b.yx;
-    return min(max(v.x, v.y), max(h.x, h.y));
-}
-
-float diamond(vec2 p, float r) {
-    p = abs(p);
-    return (max(abs(p.x - p.y), abs(p.x + p.y)) - r) / sqrt(2.0);
-}
-
-void main() {
-    float d;
-
-	/** Normalized point coord */
-    vec2 p = vRotationMatrix * (2.0 * gl_PointCoord - 1.0) * vRadiusWithPadding;
-	float r = vRadius;
-
-    // We could also use textures here. Could even be faster, because we have plenty of branching here.
-    if (vShape == CIRCLE) {
-        d = circle(p, r);
-
-    } else if (vShape == SQUARE) {
-        d = square(p, r);
-
-    } else if (vShape == TRIANGLE_UP) {
-        d = equilateralTriangle(p, r, true, false);
-
-    } else if (vShape == CROSS) {
-        d = crossShape(p, r);
-
-    } else if (vShape == DIAMOND) {
-        d = diamond(p, r);
-
-    } else if (vShape == TRIANGLE_DOWN) {
-        d = equilateralTriangle(p, r, false, false);
-
-    } else if (vShape == TRIANGLE_RIGHT) {
-        d = equilateralTriangle(p, r, false, true);
-
-    } else if (vShape == TRIANGLE_LEFT) {
-        d = equilateralTriangle(p, r, true, true);
-
-    } else {
-        d = 0.0;
-    }
-
-	if (!uPickingEnabled) {
-		lowp vec4 fillColor = mix(vFillColor, white, -d * uGradientStrength / vRadius);
-
-		fragColor = distanceToColor(
-			d + (uInwardStroke ? vHalfStrokeWidth : 0.0),
-			fillColor,
-			vStrokeColor,
-			vHalfStrokeWidth);
-
-	} else if (d - vHalfStrokeWidth <= 0.0) {
-        fragColor = vPickingColor;
-
-	} else {
-		discard;
-    }
-}
-

package/src/gl/point.vertex.glsl

@@ -1,129 +0,0 @@
-/**
- * The stroke should only grow inwards, e.g, the diameter/outline is not affected by the stroke width.
- * Thus, a point that has a zero size has no visible stroke. This allows strokes to be used with
- * geometric zoom, etc.
- */
-uniform bool uInwardStroke;
-
-/** Maximum size of the largest point as the fraction of the height of the (faceted) view */
-uniform lowp float uMaxRelativePointDiameter;
-
-/** Scale factor for geometric zoom */
-uniform float uScaleFactor;
-
-/** The size of the largest point in the data */
-uniform float uMaxPointSize;
-
-uniform float uZoomLevel;
-uniform float uSemanticThreshold;
-
-out float vRadius;
-out float vRadiusWithPadding;
-out lowp vec4 vFillColor;
-out lowp vec4 vStrokeColor;
-out lowp float vShape;
-out lowp float vHalfStrokeWidth;
-out mat2 vRotationMatrix;
-
-
-float computeSemanticThresholdFactor() {
-    // TODO: add smooth transition
-    return getScaled_semanticScore() >= uSemanticThreshold ? 1.0 : 0.0;
-}
-
-/**
- * Computes a scaling factor for the points in a sample-faceted view.
- */
-float getDownscaleFactor(vec2 pos) {
-    if (!isFacetedSamples()) {
-        return 1.0;
-    }
-
-    float sampleFacetHeight = getSampleFacetHeight(pos);
-    float maxPointDiameter = sqrt(uMaxPointSize);
-
-    float factor = sampleFacetHeight *
-        uViewportSize.y *
-        uMaxRelativePointDiameter;
-
-    return clamp(0.0, maxPointDiameter, factor) / maxPointDiameter;
-}
-
-// TODO: Move this into common.glsl or something
-vec2 getDxDy() {
-#if defined(dx_DEFINED) || defined(dy_DEFINED)
-    return vec2(getScaled_dx(), getScaled_dy()) / uViewportSize;
-#else
-    return vec2(0.0, 0.0);
-#endif
-}
-
-void main(void) {
-
-    float semanticThresholdFactor = computeSemanticThresholdFactor();
-    if (semanticThresholdFactor <= 0.0) {
-        gl_PointSize = 0.0;
-        // Place the vertex outside the viewport. The default (0, 0) makes this super-slow
-        // on Apple Silicon. Probably related to the tile-based GPU architecture.
-        gl_Position = vec4(100.0, 0.0, 0.0, 0.0);
-        // Exit early. MAY prevent some unnecessary calculations.
-        return;
-    }
-
-    float size = getScaled_size();
-    vec2 pos = vec2(getScaled_x(), getScaled_y()) + getDxDy();
-
-    gl_Position = unitToNdc(applySampleFacet(pos));
-
-    float strokeWidth = getScaled_strokeWidth();
-
-    float diameter = sqrt(size) *
-        uScaleFactor *
-        semanticThresholdFactor *
-        getDownscaleFactor(pos);
-
-    // Clamp minimum size and adjust opacity instead. Yields more pleasing result,
-    // no flickering etc.
-    float opacity = uViewOpacity;
-	if (strokeWidth <= 0.0 || uInwardStroke) {
-		float minDiameter = 1.0 / uDevicePixelRatio;
-		if (diameter < minDiameter) {
-			// We do some "cheap" gamma correction here. It breaks on dark background, though.
-			// First we take a square of the size and then apply "gamma" of 1.5.
-			opacity *= pow(diameter / minDiameter, 2.5);
-			diameter = minDiameter;
-		}
-	}
-
-	float fillOpa = getScaled_fillOpacity() * opacity;
-	float strokeOpa = getScaled_strokeOpacity() * opacity;
-
-    vShape = getScaled_shape();
-
-	// Circle doesn't have sharp corners. Do some special optimizations to minimize the point size.
-	bool circle = vShape == 0.0;
-
-	float angleInDegrees = getScaled_angle();
-	float angle = -angleInDegrees * PI / 180.0;
-    float sinTheta = sin(angle);
-    float cosTheta = cos(angle);
-    vRotationMatrix = mat2(cosTheta, sinTheta, -sinTheta, cosTheta);
-	float roomForRotation = circle ? 1.0 : sin(mod(angle, PI / 2.0) + PI / 4.0) / sin(PI / 4.0);
-
-	float aaPadding = 1.0 / uDevicePixelRatio;
-	float rotationPadding = (diameter * roomForRotation) - diameter;
-	// sqrt(3.0) ensures that the angles of equilateral triangles have enough room
-	float strokePadding = uInwardStroke ? 0.0 : strokeWidth * (circle ? 1.0 : sqrt(3.0));
-	float padding = rotationPadding + strokePadding + aaPadding;
-    gl_PointSize = (diameter + padding) * uDevicePixelRatio;
-
-	vRadius = diameter / 2.0;
-	vRadiusWithPadding = vRadius + padding / 2.0;
-
-    vHalfStrokeWidth = strokeWidth / 2.0;
-
-    vFillColor = vec4(getScaled_fill() * fillOpa, fillOpa);
-    vStrokeColor = vec4(getScaled_stroke() * strokeOpa, strokeOpa);
-
-    setupPicking();
-}

package/src/gl/rect.fragment.glsl

@@ -1,51 +0,0 @@
-#if defined(ROUNDED_CORNERS) || defined(STROKED)
-in vec2 vPosInPixels;
-#endif
-
-in vec2 vHalfSizeInPixels;
-
-in lowp vec4 vFillColor;
-in lowp vec4 vStrokeColor;
-in float vHalfStrokeWidth;
-in vec4 vCornerRadii;
-
-out lowp vec4 fragColor;
-
-// Source: https://www.iquilezles.org/www/articles/distfunctions2d/distfunctions2d.htm
-float sdRoundedBox(vec2 p, vec2 b, vec4 r) {
-    r.xy = p.x > 0.0 ? r.xy : r.zw;
-    r.x  = p.y > 0.0 ? r.x  : r.y;
-    vec2 q = abs(p) - b + r.x;
-    return min(max(q.x, q.y), 0.0) + length(max(q, 0.0)) - r.x;
-}
-
-// Not a true SDF. Makes the corners of strokes sharp and is faster.
-float sdSharpBox(vec2 p, vec2 b) {
-    vec2 q = abs(p) - b;
-    return max(q.x, q.y);
-}
-
-void main(void) {
-
-#if defined(ROUNDED_CORNERS) || defined(STROKED)
-#ifdef ROUNDED_CORNERS
-    // Distance from rectangle's edge in pixels. Negative inside the rectangle.
-    float d = sdRoundedBox(vPosInPixels, vHalfSizeInPixels, vCornerRadii);
-#else
-    float d = sdSharpBox(vPosInPixels, vHalfSizeInPixels);
-#endif
-
-    fragColor = distanceToColor(d, vFillColor, vStrokeColor, vHalfStrokeWidth);
-
-    if (fragColor.a == 0.0) {
-        discard;
-    }
-#else
-    // The trivial, non-decorated case
-    fragColor = vFillColor;
-#endif
-
-    if (uPickingEnabled) {
-        fragColor = vPickingColor;
-    }
-}