gridviz 3.0.18 → 3.0.20

package/src/utils/ternary.js

@@ -1,203 +1,208 @@
-//@ts-check
-'use strict'
-
-import { interpolateLab } from 'd3-interpolate'
-
-export const ternaryClassifier = (properties, totalFunction, opts = {}) => {
-    //the three properties
-    const p0 = properties[0],
-        p1 = properties[1],
-        p2 = properties[2]
-
-    //the classifier center point. sum must be equal to 1
-    const [c0, c1, c2] = opts.center || [1 / 3, 1 / 3, 1 / 3]
-
-    //parameter to decide wether to use mixed classes m0, m1, m2.
-    const withMixedClasses = opts.withMixedClasses != undefined ? opts.withMixedClasses : true
-
-    //paramerter decide wether to use a central class, and the size of this central class.
-    //set to 0 or undefined for not showing any central class. Set to 1 for a central class that contains the mix classes
-    const cc = opts.centerCoefficient ? 1 - opts.centerCoefficient : undefined
-
-    //the output classifier method
-    const fun = (c) => {
-        //get total
-        const tot = totalFunction(c)
-        if (!tot) return undefined
-        //compute shares
-        const [s0, s1, s2] = [+c[p0] / tot, +c[p1] / tot, +c[p2] / tot]
-
-        //class 0
-        if (s0 >= c0 && s1 <= c1 && s2 <= c2) {
-            //central class near class 0
-            if (cc != undefined && (s2 - c2) * (c1 - cc * c1) >= (s1 - cc * c1) * (cc * c2 - c2))
-                return 'center'
-            return '0'
-        }
-        //class 1
-        if (s0 <= c0 && s1 >= c1 && s2 <= c2) {
-            //central class near class 1
-            if (cc != undefined && (s2 - c2) * (c0 - cc * c0) >= (s0 - cc * c0) * (cc * c2 - c2))
-                return 'center'
-            return '1'
-        }
-        //class 2
-        if (s0 <= c0 && s1 <= c1 && s2 >= c2) {
-            //central class near class 2
-            if (cc != undefined && (s1 - c1) * (c0 - cc * c0) >= (s0 - cc * c0) * (cc * c1 - c1))
-                return 'center'
-            return '2'
-        }
-        //middle class 0 - intersection class 1 and 2
-        if (s0 <= c0 && s1 >= c1 && s2 >= c2) {
-            //central class
-            if (cc != undefined && s0 > cc * c0) return 'center'
-            if (withMixedClasses) return 'm12'
-            return s1 > s2 ? '1' : '2'
-        }
-        //middle class 1 - intersection class 0 and 1
-        if (s0 >= c0 && s1 <= c1 && s2 >= c2) {
-            //central class
-            if (cc != undefined && s1 > cc * c1) return 'center'
-            if (withMixedClasses) return 'm02'
-            return s0 > s2 ? '0' : '2'
-        }
-        //middle class 2 - intersection class 0 and 1
-        if (s0 >= c0 && s1 >= c1 && s2 <= c2) {
-            //central class
-            if (cc != undefined && s2 > cc * c2) return 'center'
-            if (withMixedClasses) return 'm01'
-            return s1 > s0 ? '1' : '0'
-        }
-        //should not happen
-        return 'unknown'
-    }
-
-    //attach information to output function
-    fun.center = [c0, c1, c2]
-    fun.centerCoefficient = opts.centerCoefficient
-
-    return fun
-}
-
-export const ternaryColorClassifier = (properties, totalFunction, colors, opts = {}) => {
-    //the three colors
-    const [color0, color1, color2] = colors || ['red', 'green', 'blue']
-
-    //the color interpolation function
-    const colorInterpolation = opts.colorInterpolation || interpolateLab
-
-    //parameter to decide wether to use mixed classes.
-    const withMixedClasses = opts.withMixedClasses != undefined ? opts.withMixedClasses : true
-    //https://d3js.org/d3-interpolate/color
-    const mixColorFunction = (color1, color2) => colorInterpolation(color1, color2)(0.5)
-    //the colors corresponding to the mixed classes
-    const [mixColor0, mixColor1, mixColor2] =
-        opts.mixedColors || withMixedClasses
-            ? [
-                  mixColorFunction(color1, color2),
-                  mixColorFunction(color0, color2),
-                  mixColorFunction(color0, color1),
-              ]
-            : []
-
-    //the central color, used for the central class, if any. The central class is the class of relatively balanced values, around the center point
-    const centerColor =
-        opts.centerColor || colorInterpolation(mixColorFunction(color0, color1), color2)(0.333)
-
-    //make classifier
-    const classifier = ternaryClassifier(properties, totalFunction, opts)
-
-    //the output color classifier method
-    const fun = (c) => {
-        const cla = classifier(c)
-        if (cla == '0') return color0
-        if (cla == '1') return color1
-        if (cla == '2') return color2
-        if (cla == 'm12') return mixColor0
-        if (cla == 'm02') return mixColor1
-        if (cla == 'm01') return mixColor2
-        if (cla == 'center') return centerColor
-        return opts.defaultColor || 'black'
-    }
-    fun.center = classifier.center
-    fun.centerCoefficient = opts.centerCoefficient
-    fun.colors = [color0, color1, color2]
-    fun.mixColors = [mixColor0, mixColor1, mixColor2]
-    fun.centerColor = centerColor
-    fun.classifier = classifier
-
-    return fun
-}
-
-/*
-const orderedIndexesDec = arr => [...arr.keys()].sort((a, b) => arr[b] - arr[a]);
-const orderedIndexesInc = arr => [...arr.keys()].sort((a, b) => arr[a] - arr[b]);
-
-export const ternaryClassifier = (properties, totalFunction, opts = {}) => {
-    const lowThreshold = opts.lowThreshold || [1 / 3, 1 / 3, 1 / 3]
-    const highThreshold = opts.highThreshold || [2 / 3, 2 / 3, 2 / 3]
-    const colors = opts.colors || ["red", "green", "blue"]
-    const colorInterpolation = opts.colorInterpolation || interpolateLab
-
-    //https://d3js.org/d3-interpolate/color
-    const middleColorFunction = (color1, color2) => colorInterpolation(color1, color2)(0.5)
-    const middleColors = opts.middleColors || [middleColorFunction(colors[1], colors[2]), middleColorFunction(colors[0], colors[2]), middleColorFunction(colors[0], colors[1])]
-    const centerColor = opts.centerColor || colorInterpolation(middleColors[2], colors[2])(0.333)
-
-    const high_ = orderedIndexesDec(highThreshold)
-    const low_ = orderedIndexesInc(lowThreshold)
-
-    const p0 = properties[0], p1 = properties[1], p2 = properties[2]
-    const fun = c => {
-        //get total
-        const tot = totalFunction(c)
-        if (!tot) return undefined
-        //compute shares
-        const shares = [+c[p0] / tot, +c[p1] / tot, +c[p2] / tot]
-        //return colors
-        //start first with the extreme high (triangles): from the larger value (small triangle) to the lower value (large triangle)
-        for (let i of high_) if (shares[i] > highThreshold[i]) return colors[i]
-        //then draw the extreme low (trapeziums): from the lower value (small trapeziums) to the larger values (large trapezium)
-        for (let i of low_) if (shares[i] < lowThreshold[i]) return middleColors[i]
-        //else central color
-        return centerColor
-    }
-    fun.lowThreshold = lowThreshold
-    fun.highThreshold = highThreshold
-    fun.colors = colors
-    fun.middleColors = middleColors
-    fun.centerColor = centerColor
-    fun.lowIndex = low_
-    fun.highIndex = high_
-    return fun
-}
-*/
-
-/*
-export const ternaryClassifier3 = (properties, totalFunction, opts = {}) => {
-    const [a01, a12, a20] = opts.thresholds || [1/3, 1/3, 1/3]
-    const [c0, c1, c2] = opts.colors || ["red", "green", "blue"]
-    const centerColor = opts.centerColor || "gray"
-
-    const fff = a => a == 1 ? Infinity : a / (1 - a)
-    const c01 = fff(a01), c12 = fff(a12), c20 = fff(a20)
-
-    const p0 = properties[0], p1 = properties[1], p2 = properties[2]
-    const fun = c => {
-        //get total
-        const tot = totalFunction(c)
-        if (!tot) return undefined
-        //compute shares
-        const [s0, s1, s2] = [+c[p0] / tot, +c[p1] / tot, +c[p2] / tot]
-        //return colors
-        if (s0 * c01 > s1 && s0 > s2 * c20) return c0
-        else if (s1 > s0 * c01 && s1 * c12 > s2) return c1
-        else if (s2 * c20 > s0 && s2 > s1 * c12) return c2
-        else return centerColor
-    }
-    fun.colors = [c0, c1, c2]
-    fun.centerColor = centerColor
-    return fun
-}
-*/
+//@ts-check
+'use strict'
+
+import { interpolateLab } from 'd3-interpolate'
+
+export const ternaryClassifier = (properties, totalFunction, opts = {}) => {
+    //the three properties
+    const p0 = properties[0],
+        p1 = properties[1],
+        p2 = properties[2]
+
+    //the classifier center point. sum must be equal to 1
+    const [c0, c1, c2] = opts.center || [1 / 3, 1 / 3, 1 / 3]
+
+    //parameter to decide wether to use mixed classes m0, m1, m2.
+    const withMixedClasses = opts.withMixedClasses != undefined ? opts.withMixedClasses : true
+
+    //parameter to decide wether to use a central class, and the size of this central class.
+    //set to 0 or undefined for not showing any central class. Set to 1 for a central class that contains the mix classes
+    const cc = opts.centerCoefficient ? 1 - opts.centerCoefficient : undefined
+
+    //the output classifier method
+    const fun = (c) => {
+        //get total
+        const tot = totalFunction(c)
+        if (!tot) return undefined
+        //compute shares
+        const [s0, s1, s2] = [+c[p0] / tot, +c[p1] / tot, +c[p2] / tot]
+
+        //class 0
+        if (s0 >= c0 && s1 <= c1 && s2 <= c2) {
+            //central class near class 0
+            if (cc != undefined && (s2 - c2) * (c1 - cc * c1) >= (s1 - cc * c1) * (cc * c2 - c2))
+                return 'center'
+            return '0'
+        }
+        //class 1
+        if (s0 <= c0 && s1 >= c1 && s2 <= c2) {
+            //central class near class 1
+            if (cc != undefined && (s2 - c2) * (c0 - cc * c0) >= (s0 - cc * c0) * (cc * c2 - c2))
+                return 'center'
+            return '1'
+        }
+        //class 2
+        if (s0 <= c0 && s1 <= c1 && s2 >= c2) {
+            //central class near class 2
+            if (cc != undefined && (s1 - c1) * (c0 - cc * c0) >= (s0 - cc * c0) * (cc * c1 - c1))
+                return 'center'
+            return '2'
+        }
+        //middle class 0 - intersection class 1 and 2
+        if (s0 <= c0 && s1 >= c1 && s2 >= c2) {
+            //central class
+            if (cc != undefined && s0 > cc * c0) return 'center'
+            if (withMixedClasses) return 'm12'
+            return s1 > s2 ? '1' : '2'
+        }
+        //middle class 1 - intersection class 0 and 1
+        if (s0 >= c0 && s1 <= c1 && s2 >= c2) {
+            //central class
+            if (cc != undefined && s1 > cc * c1) return 'center'
+            if (withMixedClasses) return 'm02'
+            return s0 > s2 ? '0' : '2'
+        }
+        //middle class 2 - intersection class 0 and 1
+        if (s0 >= c0 && s1 >= c1 && s2 <= c2) {
+            //central class
+            if (cc != undefined && s2 > cc * c2) return 'center'
+            if (withMixedClasses) return 'm01'
+            return s1 > s0 ? '1' : '0'
+        }
+        //should not happen
+        return 'unknown'
+    }
+
+    //attach information to output function
+    fun.center = [c0, c1, c2]
+    fun.centerCoefficient = opts.centerCoefficient
+
+    return fun
+}
+
+export const ternaryColorClassifier = (properties, totalFunction, colors, opts = {}) => {
+    //the three colors
+    const [color0, color1, color2] = colors || ['red', 'green', 'blue']
+
+    //the color interpolation function
+    const colorInterpolation = opts.colorInterpolation || interpolateLab
+
+    //parameter to decide wether to use mixed classes.
+    const withMixedClasses = opts.withMixedClasses != undefined ? opts.withMixedClasses : true
+    //https://d3js.org/d3-interpolate/color
+    const mixColorFunction = (color1, color2) => colorInterpolation(color1, color2)(0.5)
+    //the colors corresponding to the mixed classes
+    const [mixColor0, mixColor1, mixColor2] =
+        opts.mixedColors || withMixedClasses
+            ? [
+                  mixColorFunction(color1, color2),
+                  mixColorFunction(color0, color2),
+                  mixColorFunction(color0, color1),
+              ]
+            : []
+
+    //the central color, used for the central class, if any. The central class is the class of relatively balanced values, around the center point
+    const centerColor =
+        opts.centerColor || colorInterpolation(mixColorFunction(color0, color1), color2)(0.333)
+
+    //make classifier
+    const classifier = ternaryClassifier(properties, totalFunction, opts)
+
+    //the output color classifier method
+    const fun = (c) => {
+        const cla = classifier(c)
+        if (cla == '0') return color0
+        if (cla == '1') return color1
+        if (cla == '2') return color2
+        if (cla == 'm12') return mixColor0
+        if (cla == 'm02') return mixColor1
+        if (cla == 'm01') return mixColor2
+        if (cla == 'center') return centerColor
+        return opts.defaultColor || 'black'
+    }
+    fun.center = classifier.center
+    fun.centerCoefficient = opts.centerCoefficient
+    fun.colors = [color0, color1, color2]
+    fun.mixColors = [mixColor0, mixColor1, mixColor2]
+    fun.centerColor = centerColor
+    fun.classifier = classifier
+
+    return fun
+}
+
+
+
+
+// OLD VERSIONS
+
+/*
+const orderedIndexesDec = arr => [...arr.keys()].sort((a, b) => arr[b] - arr[a]);
+const orderedIndexesInc = arr => [...arr.keys()].sort((a, b) => arr[a] - arr[b]);
+
+export const ternaryClassifier = (properties, totalFunction, opts = {}) => {
+    const lowThreshold = opts.lowThreshold || [1 / 3, 1 / 3, 1 / 3]
+    const highThreshold = opts.highThreshold || [2 / 3, 2 / 3, 2 / 3]
+    const colors = opts.colors || ["red", "green", "blue"]
+    const colorInterpolation = opts.colorInterpolation || interpolateLab
+
+    //https://d3js.org/d3-interpolate/color
+    const middleColorFunction = (color1, color2) => colorInterpolation(color1, color2)(0.5)
+    const middleColors = opts.middleColors || [middleColorFunction(colors[1], colors[2]), middleColorFunction(colors[0], colors[2]), middleColorFunction(colors[0], colors[1])]
+    const centerColor = opts.centerColor || colorInterpolation(middleColors[2], colors[2])(0.333)
+
+    const high_ = orderedIndexesDec(highThreshold)
+    const low_ = orderedIndexesInc(lowThreshold)
+
+    const p0 = properties[0], p1 = properties[1], p2 = properties[2]
+    const fun = c => {
+        //get total
+        const tot = totalFunction(c)
+        if (!tot) return undefined
+        //compute shares
+        const shares = [+c[p0] / tot, +c[p1] / tot, +c[p2] / tot]
+        //return colors
+        //start first with the extreme high (triangles): from the larger value (small triangle) to the lower value (large triangle)
+        for (let i of high_) if (shares[i] > highThreshold[i]) return colors[i]
+        //then draw the extreme low (trapeziums): from the lower value (small trapeziums) to the larger values (large trapezium)
+        for (let i of low_) if (shares[i] < lowThreshold[i]) return middleColors[i]
+        //else central color
+        return centerColor
+    }
+    fun.lowThreshold = lowThreshold
+    fun.highThreshold = highThreshold
+    fun.colors = colors
+    fun.middleColors = middleColors
+    fun.centerColor = centerColor
+    fun.lowIndex = low_
+    fun.highIndex = high_
+    return fun
+}
+*/
+
+/*
+export const ternaryClassifier3 = (properties, totalFunction, opts = {}) => {
+    const [a01, a12, a20] = opts.thresholds || [1/3, 1/3, 1/3]
+    const [c0, c1, c2] = opts.colors || ["red", "green", "blue"]
+    const centerColor = opts.centerColor || "gray"
+
+    const fff = a => a == 1 ? Infinity : a / (1 - a)
+    const c01 = fff(a01), c12 = fff(a12), c20 = fff(a20)
+
+    const p0 = properties[0], p1 = properties[1], p2 = properties[2]
+    const fun = c => {
+        //get total
+        const tot = totalFunction(c)
+        if (!tot) return undefined
+        //compute shares
+        const [s0, s1, s2] = [+c[p0] / tot, +c[p1] / tot, +c[p2] / tot]
+        //return colors
+        if (s0 * c01 > s1 && s0 > s2 * c20) return c0
+        else if (s1 > s0 * c01 && s1 * c12 > s2) return c1
+        else if (s2 * c20 > s0 && s2 > s1 * c12) return c2
+        else return centerColor
+    }
+    fun.colors = [c0, c1, c2]
+    fun.centerColor = centerColor
+    return fun
+}
+*/

package/src/utils/utils.js

@@ -1,58 +1,58 @@
-//@ts-check
-'use strict'
-
-/**
- * Get the class id from a value and class break values
- *
- * @param {number} v the value
- * @param {Array.<number>} breaks the breaks
- * @returns The class id, from 0 to breaks.length
- * @deprecated use getClassifier instead.
- */
-export function getClass(v, breaks) {
-    if (!breaks) return
-    if (breaks.length == 0) return 0
-    if (v <= breaks[0]) return 0
-    for (let i = 1; i < breaks.length; i++) if (breaks[i - 1] < v && v <= breaks[i]) return i
-    return breaks.length
-}
-
-//take 'nice' value (power of ten, or multiple)
-export function nice(v, multiples = [8, 6, 5, 4, 2.5, 2]) {
-    //compute bigger power of ten below
-    const v_ = Math.pow(10, Math.floor(Math.log10(v)))
-    for (let multiple of multiples) if (v_ * multiple <= v) return v_ * multiple
-    return v_
-}
-
-/*
-//no longer used
-export function loadImage(src) {
-    return new Promise((resolve, reject) => {
-        const img = new Image();
-        img.onload = function () { resolve(img); };
-        img.onerror = function () { reject(new Error('Error loading image')); };
-        img.src = src;
-    });
-}
-*/
-
-/*
-export let monitor = false
-
-let previousDate
-export function monitorDuration(message) {
-    const nowDate = Date.now()
-
-    //first call
-    if (!previousDate) {
-        previousDate = nowDate
-        console.log(previousDate, message)
-        return
-    }
-
-    const d = nowDate - previousDate
-    previousDate = nowDate
-    console.log(d, message)
-}
-*/
+//@ts-check
+'use strict'
+
+/**
+ * Get the class id from a value and class break values
+ *
+ * @param {number} v the value
+ * @param {Array.<number>} breaks the breaks
+ * @returns The class id, from 0 to breaks.length
+ * @deprecated use getClassifier instead.
+ */
+export function getClass(v, breaks) {
+    if (!breaks) return
+    if (breaks.length == 0) return 0
+    if (v <= breaks[0]) return 0
+    for (let i = 1; i < breaks.length; i++) if (breaks[i - 1] < v && v <= breaks[i]) return i
+    return breaks.length
+}
+
+//take 'nice' value (power of ten, or multiple)
+export function nice(v, multiples = [8, 6, 5, 4, 2.5, 2]) {
+    //compute bigger power of ten below
+    const v_ = Math.pow(10, Math.floor(Math.log10(v)))
+    for (let multiple of multiples) if (v_ * multiple <= v) return v_ * multiple
+    return v_
+}
+
+/*
+//no longer used
+export function loadImage(src) {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.onload = function () { resolve(img); };
+        img.onerror = function () { reject(new Error('Error loading image')); };
+        img.src = src;
+    });
+}
+*/
+
+/*
+export let monitor = false
+
+let previousDate
+export function monitorDuration(message) {
+    const nowDate = Date.now()
+
+    //first call
+    if (!previousDate) {
+        previousDate = nowDate
+        console.log(previousDate, message)
+        return
+    }
+
+    const d = nowDate - previousDate
+    previousDate = nowDate
+    console.log(d, message)
+}
+*/