@genome-spy/core 0.36.1 → 0.37.0

package/dist/src/gl/dataToVertices.js

@@ -0,0 +1,639 @@
+import { InternMap } from "internmap";
+import { format } from "d3-format";
+import { isString } from "vega-util";
+import ArrayBuilder from "./arrayBuilder";
+import { SDF_PADDING } from "../fonts/bmFontMetrics";
+import { createBinningRangeIndexer } from "../utils/binnedIndex";
+import { isValueDef } from "../encoder/encoder";
+import {
+    isHighPrecisionScale,
+    splitHighPrecision,
+} from "../scale/glslScaleGenerator";
+import { isContinuous } from "vega-scale";
+
+/**
+ * @typedef {object} RangeEntry Represents a location of a vertex subset
+ * @prop {number} offset in vertices
+ * @prop {number} count in vertices
+ * @prop {import("../utils/binnedIndex").Lookup} xIndex
+ */
+export class GeometryBuilder {
+    /**
+     * @typedef {import("./arrayBuilder").ConverterMetadata} Converter
+     * @typedef {import("../types/encoder").Encoder} Encoder
+     */
+
+    /**
+     * @param {object} object
+     * @param {Record<string, Encoder>} object.encoders
+     * @param {string[]} [object.attributes]
+     * @param {number} [object.numVertices] If the number of data items is known, a
+     *      preallocated TypedArray is used
+     */
+    constructor({ encoders, numVertices = undefined, attributes = [] }) {
+        this.encoders = encoders;
+
+        // Encoders for variable channels
+        this.variableEncoders = Object.fromEntries(
+            Object.entries(encoders).filter(
+                ([channel, e]) =>
+                    attributes.includes(channel) && e && e.scale && !e.constant
+            )
+        );
+
+        this.allocatedVertices = numVertices;
+
+        this.variableBuilder = new ArrayBuilder(numVertices);
+
+        // Create converters and updaters for all variable channels.
+        // TODO: If more than one channels use the same field with the same data type, convert the field only once.
+
+        for (const [channel, ce] of Object.entries(this.variableEncoders)) {
+            const accessor = ce.accessor;
+
+            const doubleArray = [0, 0];
+            const hp = isHighPrecisionScale(ce.scale.type);
+
+            const indexer = ce.indexer;
+
+            /**
+             * Discrete variables both numeric and strings must be "indexed",
+             * 64 bit floats must be converted to vec2.
+             * 32 bit continuous variables go to GPU as is.
+             *
+             * @type {function(any):(number | number[])}
+             */
+            const f = indexer
+                ? (d) => indexer(accessor(d))
+                : hp
+                ? (d) => splitHighPrecision(accessor(d), doubleArray)
+                : accessor;
+
+            this.variableBuilder.addConverter(channel, {
+                f,
+                numComponents: hp ? 2 : 1,
+                arrayReference: hp ? doubleArray : undefined,
+            });
+        }
+
+        this.lastOffset = 0;
+
+        /** @type {Map<any, RangeEntry>} keep track of facet locations within the vertex array */
+        this.rangeMap = new InternMap([], JSON.stringify);
+    }
+
+    /**
+     * Must be called at the end of `addBatch`
+     *
+     * @param {any} key
+     */
+    registerBatch(key) {
+        const offset = this.lastOffset;
+        const index = this.variableBuilder.vertexCount;
+        const size = index - offset;
+        if (size) {
+            this.rangeMap.set(key, {
+                offset,
+                count: size,
+                xIndex: this.xIndexer?.getIndex(),
+            });
+        }
+        this.lastOffset = index;
+    }
+
+    /**
+     * @param {Map<any, object[]>} batches
+     */
+    addBatches(batches) {
+        for (const [key, data] of batches) {
+            this.addBatch(key, data);
+        }
+    }
+
+    /**
+     * @param {any} key The facet id, for example
+     * @param {object[]} data
+     */
+    addBatch(key, data, lo = 0, hi = data.length) {
+        this.prepareXIndexer(data, lo, hi);
+
+        for (let i = lo; i < hi; i++) {
+            const d = data[i];
+            this.variableBuilder.pushFromDatum(d);
+            this.addToXIndex(d);
+        }
+
+        this.registerBatch(key);
+    }
+
+    /**
+     * @param {import("../data/flowNode").Data} data Domain, but specified using datums
+     * @param {number} [lo]
+     * @param {number} [hi]
+     */
+    prepareXIndexer(data, lo = 0, hi = lo + data.length) {
+        const disable = () => {
+            /**
+             * @param {import("../data/flowNode").Datum} datum
+             */
+            this.addToXIndex = (datum) => {
+                // nop
+            };
+            this.xIndexer = undefined;
+        };
+
+        if (!data.length || hi - lo < 0) {
+            disable();
+            return;
+        }
+
+        /** @param {Encoder} encoder */
+        const getContinuousEncoder = (encoder) =>
+            encoder && isContinuous(encoder.scale?.type) && encoder;
+
+        const xe = getContinuousEncoder(this.variableEncoders.x);
+        const x2e = getContinuousEncoder(this.variableEncoders.x2);
+
+        if (xe) {
+            const xa = xe.accessor;
+            const x2a = x2e ? x2e.accessor : xa;
+
+            /** @type {[number, number]} */
+            const dataDomain = [xa(data[lo]), x2a(data[hi - 1])];
+
+            // No indexer for point domains that have zero extent
+            if (dataDomain[1] > dataDomain[0]) {
+                this.xIndexer = createBinningRangeIndexer(
+                    50,
+                    dataDomain,
+                    xa,
+                    x2a
+                );
+
+                let lastVertexCount = this.variableBuilder.vertexCount;
+
+                /**
+                 * @param {any} datum
+                 */
+                this.addToXIndex = (datum) => {
+                    let currentVertexCount = this.variableBuilder.vertexCount;
+                    this.xIndexer(datum, lastVertexCount, currentVertexCount);
+                    lastVertexCount = currentVertexCount;
+                };
+            } else {
+                disable();
+            }
+        } else {
+            disable();
+        }
+    }
+
+    /**
+     * Add the datum to an index, which allows for efficient rendering of ranges
+     * on the x axis. Must be called after a datum has been pushed to the ArrayBuilder.
+     *
+     * @param {import("../data/flowNode").Datum} datum
+     */
+    addToXIndex(datum) {
+        //
+    }
+
+    toArrays() {
+        return {
+            /** @type {Record<string, {data: number[] | Float32Array, numComponents: number, divisor?: number}>} */
+            arrays: this.variableBuilder.arrays,
+            /** Number of vertices used */
+            vertexCount: this.variableBuilder.vertexCount,
+            /** Number of vertices allocated in buffers */
+            allocatedVertices: this.allocatedVertices,
+            rangeMap: this.rangeMap,
+        };
+    }
+}
+
+export class RectVertexBuilder extends GeometryBuilder {
+    /**
+     *
+     * @param {Object} object
+     * @param {Record<string, Encoder>} object.encoders
+     * @param {string[]} object.attributes
+     * @param {number} [object.tessellationThreshold]
+     *     If the rect is wider than the threshold, tessellate it into pieces
+     * @param {number[]} [object.visibleRange]
+     * @param {number} [object.numItems] Number of data items
+     */
+    constructor({
+        encoders,
+        attributes,
+        tessellationThreshold = Infinity,
+        visibleRange = [-Infinity, Infinity],
+        numItems,
+    }) {
+        super({
+            encoders,
+            attributes,
+            numVertices:
+                tessellationThreshold == Infinity ? numItems * 6 : undefined,
+        });
+
+        this.visibleRange = visibleRange;
+
+        this.tessellationThreshold = tessellationThreshold || Infinity;
+
+        this.updateFrac = this.variableBuilder.createUpdater("frac", 2);
+    }
+
+    /**
+     *
+     * @param {any} key
+     * @param {object[]} data
+     */
+    addBatch(key, data, lo = 0, hi = data.length) {
+        if (hi <= lo) {
+            return;
+        }
+
+        const e =
+            /** @type {Object.<string, import("../types/encoder").NumberEncoder>} */ (
+                this.encoders
+            );
+        const [lower, upper] = this.visibleRange;
+
+        /**
+         * @param {import("../types/encoder").Encoder} encoder
+         */
+        const a = (encoder) => encoder.accessor || ((x) => 0);
+
+        const xAccessor = a(e.x);
+        const x2Accessor = a(e.x2);
+
+        this.prepareXIndexer(data, lo, hi);
+
+        const frac = [0, 0];
+        this.updateFrac(frac);
+
+        for (let i = lo; i < hi; i++) {
+            const d = data[i];
+
+            let x = xAccessor(d),
+                x2 = x2Accessor(d);
+
+            if (x > x2) {
+                [x, x2] = [x2, x];
+            }
+
+            // Skip rects that fall outside the visible range. TODO: Optimize by using binary search / interval tree
+            if (x2 < lower || x > upper) {
+                continue;
+            }
+
+            // Truncate to prevent tessellation of parts that are outside the viewport
+            if (x < lower) x = lower;
+            if (x2 > upper) x2 = upper;
+
+            // Start a new segment.
+            this.variableBuilder.updateFromDatum(d);
+
+            frac[0] = 0;
+            frac[1] = 0;
+
+            // Tessellate segments
+            const tileCount = 1;
+            //    width < Infinity
+            //        ? Math.ceil(width / this.tessellationThreshold)
+            //        : 1;
+
+            // Duplicate the first vertex to produce degenerate triangles
+            this.variableBuilder.pushAll();
+
+            for (let i = 0; i <= tileCount; i++) {
+                frac[0] = i / tileCount;
+                frac[1] = 0;
+                this.variableBuilder.pushAll();
+                frac[1] = 1;
+                this.variableBuilder.pushAll();
+            }
+
+            // Duplicate the last vertex to produce a degenerate triangle between the segments
+            this.variableBuilder.pushAll();
+            this.addToXIndex(d);
+        }
+
+        this.registerBatch(key);
+    }
+}
+
+export class RuleVertexBuilder extends GeometryBuilder {
+    /**
+     *
+     * @param {Object} object
+     * @param {Record<string, Encoder>} object.encoders
+     * @param {string[]} object.attributes
+     * @param {number} [object.tessellationThreshold]
+     *     If the rule is wider than the threshold, tessellate it into pieces
+     * @param {number[]} [object.visibleRange]
+     * @param {number} [object.numItems] Number of data items
+     */
+    constructor({
+        encoders,
+        attributes,
+        tessellationThreshold = Infinity,
+        visibleRange = [-Infinity, Infinity],
+        numItems,
+    }) {
+        super({
+            encoders,
+            attributes,
+            numVertices:
+                tessellationThreshold == Infinity ? numItems * 6 : undefined,
+        });
+
+        this.visibleRange = visibleRange;
+
+        this.tessellationThreshold = tessellationThreshold || Infinity;
+
+        this.updateSide = this.variableBuilder.createUpdater("side", 1);
+        this.updatePos = this.variableBuilder.createUpdater("pos", 1);
+    }
+
+    /* eslint-disable complexity */
+    /**
+     *
+     * @param {any} key
+     * @param {object[]} data
+     */
+    addBatch(key, data, lo = 0, hi = data.length) {
+        //const [lower, upper] = this.visibleRange; // TODO
+
+        this.prepareXIndexer(data, lo, hi);
+
+        for (let i = lo; i < hi; i++) {
+            const d = data[i];
+
+            // Start a new rule. Duplicate the first vertex to produce degenerate triangles
+            this.variableBuilder.updateFromDatum(d);
+            this.updateSide(-0.5);
+            this.updatePos(0);
+            this.variableBuilder.pushAll();
+
+            // Tesselate segments
+            const tileCount = 1;
+            //    width < Infinity
+            //        ? Math.ceil(width / this.tessellationThreshold)
+            //        : 1;
+            for (let i = 0; i <= tileCount; i++) {
+                this.updatePos(i / tileCount);
+                this.updateSide(-0.5);
+                this.variableBuilder.pushAll();
+                this.updateSide(0.5);
+                this.variableBuilder.pushAll();
+            }
+
+            // Duplicate the last vertex to produce a degenerate triangle between the rules
+            this.variableBuilder.pushAll();
+            this.addToXIndex(d);
+        }
+
+        this.registerBatch(key);
+    }
+}
+
+export class PointVertexBuilder extends GeometryBuilder {
+    /**
+     *
+     * @param {object} object
+     * @param {Record<string, Encoder>} object.encoders
+     * @param {string[]} object.attributes
+     * @param {number} [object.numItems] Number of points if known, uses TypedArray
+     */
+    constructor({ encoders, attributes, numItems = undefined }) {
+        super({
+            encoders,
+            attributes,
+            numVertices: numItems,
+        });
+    }
+}
+
+export class ConnectionVertexBuilder extends GeometryBuilder {
+    /**
+     * @param {object} object
+     * @param {Record<string, Encoder>} object.encoders
+     * @param {string[]} object.attributes
+     * @param {number} [object.numItems ] Number of points if known, uses TypedArray
+     */
+    constructor({ encoders, attributes, numItems = undefined }) {
+        super({
+            encoders,
+            attributes,
+            numVertices: numItems,
+        });
+    }
+
+    toArrays() {
+        const arrays = this.variableBuilder.arrays;
+
+        // Prepare for instanced rendering
+        for (let a of Object.values(arrays)) {
+            a.divisor = 1;
+        }
+
+        return super.toArrays();
+    }
+}
+
+export class TextVertexBuilder extends GeometryBuilder {
+    /**
+     *
+     * @param {object} object
+     * @param {Record<string, Encoder>} object.encoders
+     * @param {string[]} object.attributes
+     * @param {import("../fonts/bmFontMetrics").BMFontMetrics} object.fontMetrics
+     * @param {Record<string, any>} object.properties
+     * @param {number} [object.numCharacters] number of characters
+     * @param {boolean} [object.logoLetters]
+     */
+    constructor({
+        encoders,
+        attributes,
+        fontMetrics,
+        properties,
+        numCharacters = undefined,
+    }) {
+        super({
+            encoders,
+            attributes,
+            numVertices: numCharacters * 6, // six vertices per quad (character)
+        });
+
+        this.metadata = fontMetrics;
+        this.metrics = fontMetrics;
+
+        this.properties = properties;
+
+        const e = encoders;
+
+        const channelDef =
+            /** @type {import("../spec/channel").TextDef<string>} */ (
+                e.text.channelDef
+            );
+        /** @type {(value: any) => string} */
+        this.numberFormat =
+            !isValueDef(channelDef) &&
+            "format" in channelDef &&
+            channelDef.format
+                ? format(channelDef.format)
+                : (d) => d;
+
+        this.updateVertexCoord = this.variableBuilder.createUpdater(
+            "vertexCoord",
+            2
+        );
+        this.updateTextureCoord = this.variableBuilder.createUpdater(
+            "textureCoord",
+            2
+        );
+
+        this.updateWidth = this.variableBuilder.createUpdater("width", 1);
+    }
+
+    /**
+     *
+     * @param {any} key
+     * @param {object[]} data
+     */
+    addBatch(key, data, lo = 0, hi = data.length) {
+        const align = this.properties.align || "left";
+        const logoLetters = this.properties.logoLetters ?? false;
+
+        const base = this.metadata.common.base;
+        const scale = this.metadata.common.scaleH; // Assume square textures
+
+        let baseline = -SDF_PADDING;
+        switch (this.properties.baseline) {
+            case "top":
+                baseline += this.metrics.capHeight;
+                break;
+            case "middle":
+                baseline += this.metrics.capHeight / 2;
+                break;
+            case "bottom":
+                baseline -= this.metrics.descent;
+                break;
+            default:
+            // alphabetic
+        }
+
+        const accessor = this.encoders.text.accessor || this.encoders.text; // accessor or constant value
+
+        const vertexCoord = [0, 0];
+        this.updateVertexCoord(vertexCoord);
+        const textureCoord = [0, 0];
+        this.updateTextureCoord(textureCoord);
+
+        this.prepareXIndexer(data, lo, hi);
+
+        for (let i = lo; i < hi; i++) {
+            const d = data[i];
+
+            const value = this.numberFormat(accessor(d));
+            const str = isString(value)
+                ? value
+                : value === null
+                ? ""
+                : "" + value;
+            if (str.length == 0) continue;
+
+            this.variableBuilder.updateFromDatum(d);
+
+            const textWidth = logoLetters
+                ? str.length
+                : this.metrics.measureWidth(str);
+
+            this.updateWidth(textWidth); // TODO: Check if one letter space should be reduced
+
+            let x =
+                align == "right"
+                    ? -textWidth
+                    : align == "center"
+                    ? -textWidth / 2
+                    : 0;
+
+            if (!logoLetters) {
+                const firstChar = this.metrics.getCharByCode(str.charCodeAt(0));
+                x -= (firstChar.width - firstChar.xadvance) / base / 2; // TODO: Fix, this is a bit off..
+            }
+
+            let bottom = -0.5,
+                height = 1,
+                normalWidth = 1;
+
+            for (let i = 0; i < str.length; i++) {
+                const c = this.metrics.getCharByCode(str.charCodeAt(i));
+
+                const advance = logoLetters ? 1 : c.xadvance / base;
+
+                if (c.id == 32) {
+                    x += advance;
+                    continue;
+                }
+
+                if (!logoLetters) {
+                    height = c.height / base;
+                    bottom = -(c.height + c.yoffset + baseline) / base;
+                    normalWidth = c.width / base;
+                } else {
+                    normalWidth = (c.width + SDF_PADDING * 2) / c.width;
+                    x = -normalWidth / 2;
+                    height = (c.height + SDF_PADDING * 2) / c.height;
+                    bottom = -0.5 - SDF_PADDING / c.height;
+                }
+
+                const tx = c.x;
+                const ty = c.y;
+
+                vertexCoord[0] = x;
+                vertexCoord[1] = bottom + height;
+                textureCoord[0] = tx / scale;
+                textureCoord[1] = ty / scale;
+                this.variableBuilder.pushAll();
+
+                vertexCoord[0] = x + normalWidth;
+                vertexCoord[1] = bottom + height;
+                textureCoord[0] = (tx + c.width) / scale;
+                textureCoord[1] = ty / scale;
+                this.variableBuilder.pushAll();
+
+                vertexCoord[0] = x;
+                vertexCoord[1] = bottom;
+                textureCoord[0] = tx / scale;
+                textureCoord[1] = (ty + c.height) / scale;
+                this.variableBuilder.pushAll();
+
+                vertexCoord[0] = x + normalWidth;
+                vertexCoord[1] = bottom + height;
+                textureCoord[0] = (tx + c.width) / scale;
+                textureCoord[1] = ty / scale;
+                this.variableBuilder.pushAll();
+
+                vertexCoord[0] = x;
+                vertexCoord[1] = bottom;
+                textureCoord[0] = tx / scale;
+                textureCoord[1] = (ty + c.height) / scale;
+                this.variableBuilder.pushAll();
+
+                vertexCoord[0] = x + normalWidth;
+                vertexCoord[1] = bottom;
+                textureCoord[0] = (tx + c.width) / scale;
+                textureCoord[1] = (ty + c.height) / scale;
+                this.variableBuilder.pushAll();
+
+                x += advance;
+            }
+
+            this.addToXIndex(d);
+        }
+
+        this.registerBatch(key);
+    }
+}

package/dist/src/gl/includes/common.glsl.js

@@ -0,0 +1,2 @@
+const shader = "#define PI 3.141593\nuniform View{mediump vec2 uViewOffset;mediump vec2 uViewScale;mediump vec2 uViewportSize;lowp float uDevicePixelRatio;lowp float uViewOpacity;bool uPickingEnabled;};/***Maps a coordinate on the unit scale to a normalized device coordinate.*(0,0)is at the bottom left corner.*/vec4 unitToNdc(vec2 coord){return vec4((coord*uViewScale+uViewOffset)*2.0-1.0,0.0,1.0);}vec4 unitToNdc(float x,float y){return unitToNdc(vec2(x,y));}vec4 pixelsToNdc(vec2 coord){return unitToNdc(coord/uViewportSize);}vec4 pixelsToNdc(float x,float y){return pixelsToNdc(vec2(x,y));}float linearstep(float edge0,float edge1,float x){return clamp((x-edge0)/(edge1-edge0),0.0,1.0);}/***Specialized linearstep for doing antialiasing*/float distanceToRatio(float d){return clamp(d*uDevicePixelRatio+0.5,0.0,1.0);}vec4 distanceToColor(float d,vec4 fill,vec4 stroke,float halfStrokeWidth){if(halfStrokeWidth>0.0){float sd=abs(d)-halfStrokeWidth;return mix(stroke,d<=0.0 ? fill : vec4(0.0),distanceToRatio(sd));}else{return fill*distanceToRatio(-d);}}";
+export default shader;

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

@@ -0,0 +1,2 @@
+const shader = "in highp vec4 vPickingColor;";
+export default shader;

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

@@ -0,0 +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;}";
+export default shader;

package/dist/src/gl/includes/sampleFacet.glsl.js

@@ -0,0 +1,2 @@
+const shader = "/***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;\n#if !defined(SAMPLE_FACET_UNIFORM) && !defined(SAMPLE_FACET_TEXTURE)\nSampleFacetPosition getSampleFacetPos(){return SampleFacetPosition(0.0,1.0,0.0,1.0);}\n#elif defined(SAMPLE_FACET_UNIFORM)\n/***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);}\n#elif defined(SAMPLE_FACET_TEXTURE)\nuniform 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);}\n#endif\nbool 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;}}";
+export default shader;

package/dist/src/gl/includes/scales.glsl.js

@@ -0,0 +1,2 @@
+const shader = "const float inf=1.0/0.0;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]));}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){return scaleLinear(log(value)/log(base),log(domain)/log(base),range);}float symlog(float value,float constant){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){return scaleLinear(pow(abs(value),exponent)*sign(value),pow(abs(domain),vec2(exponent))*sign(domain),range);}float scaleBand(float value,vec2 domainExtent,vec2 range,float paddingInner,float paddingOuter,float align,float band){float start=range[0];float stop=range[1];float rangeSpan=stop-start;float n=domainExtent[1]-domainExtent[0];paddingInner=int(n)>1 ? paddingInner : 0.0;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;}float scaleBandHp(vec2 value,vec3 domainExtent,vec2 range,float paddingInner,float paddingOuter,float align,float band){float start=range[0];float stop=range[1];float rangeSpan=stop-start;vec2 domainStart=domainExtent.xy;float n=domainExtent[2];float step=rangeSpan/max(1.0,n-paddingInner+paddingOuter*2.0);start+=(rangeSpan-step*(n-paddingInner))*align;float bandwidth=step*(1.0-paddingInner);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));}";
+export default shader;

package/dist/src/gl/link.fragment.glsl.js

@@ -0,0 +1,2 @@
+const shader = "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;}}";
+export default shader;

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

@@ -0,0 +1,2 @@
+const shader = "uniform float uSagittaScaleFactor;uniform float uMinSagittaLength;in vec2 strip;out vec4 vColor;out float vSize;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){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;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);\n#ifdef size2_DEFINED\nfloat mixedSize=mix(getScaled_size(),getScaled_size2(),t);\n#else\nfloat mixedSize=getScaled_size();\n#endif\nif(mixedSize<pixelSize){opacity*=mixedSize/pixelSize;mixedSize=pixelSize;}float paddedSize=mixedSize+pixelSize;vNormalLengthInPixels=strip.y*paddedSize;p+=normal*vNormalLengthInPixels;gl_Position=pixelsToNdc(p);\n#ifdef color2_DEFINED\nvec3 color=mix(getScaled_color(),getScaled_color2(),t);\n#else\nvec3 color=getScaled_color();\n#endif\nvColor=vec4(color*opacity,opacity);vSize=paddedSize;setupPicking();}";
+export default shader;

package/dist/src/gl/point.fragment.glsl.js

@@ -0,0 +1,2 @@
+const shader = "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;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;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;vec2 p=vRotationMatrix*(2.0*gl_PointCoord-1.0)*vRadiusWithPadding;float r=vRadius;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;}}";
+export default shader;

package/dist/src/gl/point.vertex.glsl.js

@@ -0,0 +1,2 @@
+const shader = "/***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;uniform lowp float uMaxRelativePointDiameter;uniform float uScaleFactor;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(){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;}vec2 getDxDy(){\n#if defined(dx_DEFINED) || defined(dy_DEFINED)\nreturn vec2(getScaled_dx(),getScaled_dy())/uViewportSize;\n#else\nreturn vec2(0.0,0.0);\n#endif\n}void main(void){float semanticThresholdFactor=computeSemanticThresholdFactor();if(semanticThresholdFactor<=0.0){gl_PointSize=0.0;gl_Position=vec4(100.0,0.0,0.0,0.0);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);float opacity=uViewOpacity;if(strokeWidth<=0.0||uInwardStroke){float minDiameter=1.0/uDevicePixelRatio;if(diameter<minDiameter){opacity*=pow(diameter/minDiameter,2.5);diameter=minDiameter;}}float fillOpa=getScaled_fillOpacity()*opacity;float strokeOpa=getScaled_strokeOpacity()*opacity;vShape=getScaled_shape();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;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();}";
+export default shader;