gridviz 2.1.12 → 2.1.13

package/src/style/JoyPlotStyle.js

@@ -1,135 +1,135 @@
-//@ts-check
-'use strict'
-
-import { Style } from '../Style.js'
-
-/**
- *
- * @author Julien Gaffuri
- */
-export class JoyPlotStyle extends Style {
-    /** @param {object} opts */
-    constructor(opts) {
-        super(opts)
-        opts = opts || {}
-
-        /** The cell column where to get the value to represent.
-         * @type {string} */
-        this.heightCol = opts.heightCol
-
-        /** A function returning the height of a cell.
-         * @type {function(number,number,import("../Style").Stat|undefined,number):number} */
-        this.height = opts.height || ((v) => Math.sqrt(v))
-
-        /**
-         * @type {function(number,{min:number, max:number},number,number):string} */
-        this.lineColor = opts.lineColor || ((y, ys, r, zf) => '#BBB')
-        /**
-         * @type {function(number,{min:number, max:number},number,number):number} */
-        this.lineWidth = opts.lineWidth || ((y, ys, r, zf) => zf)
-        /**
-         * @type {function(number,{min:number, max:number},number,number):string} */
-        this.fillColor = opts.fillColor || ((y, ys, r, zf) => '#c08c5968')
-    }
-
-    /**
-     * Draw cells as squares depending on their value.
-     *
-     * @param {Array.<import("../Dataset").Cell>} cells
-     * @param {number} r
-     * @param {import("../GeoCanvas").GeoCanvas} cg
-     * */
-    draw(cells, r, cg) {
-        //filter
-        if (this.filter) cells = cells.filter(this.filter)
-
-        cg.ctx.lineJoin = 'round'
-
-        //zoom factor
-        const zf = cg.getZf()
-
-        //compute statistics
-        const stat = Style.getStatistics(cells, (c) => c[this.heightCol], true)
-
-        //index cells by y and x
-        /**  @type {object} */
-        const ind = {}
-        for (const cell of cells) {
-            let row = ind[cell.y]
-            if (!row) {
-                row = {}
-                ind[cell.y] = row
-            }
-            row[cell.x] = this.height(cell[this.heightCol], r, stat, zf)
-        }
-
-        //compute extent
-        const e = cg.extGeo
-        if (!e) return
-        const xMin = Math.floor(e.xMin / r) * r
-        const xMax = Math.floor(e.xMax / r) * r
-        const yMin = Math.floor(e.yMin / r) * r
-        const yMax = Math.floor(e.yMax / r) * r
-
-        /**  @type {{min:number, max:number}} */
-        const ys = { min: yMin, max: yMax }
-
-        //draw in geo coordinates
-        cg.setCanvasTransform()
-
-        //draw lines, row by row, stating from the top
-        for (let y = yMax; y >= yMin; y -= r) {
-            //get row
-            const row = ind[y]
-
-            //no row
-            if (!row) continue
-
-            //place first point
-            cg.ctx.beginPath()
-            cg.ctx.moveTo(xMin - r / 2, y)
-
-            //store the previous height
-            /** @type {number|undefined} */
-            let hG_
-
-            //go through the line cells
-            for (let x = xMin; x <= xMax; x += r) {
-                //get column value
-                /** @type {number} */
-                let hG = row[x]
-                if (!hG) hG = 0
-
-                if (hG || hG_) {
-                    //draw line only when at least one of both values is non-null
-                    //TODO test bezierCurveTo
-                    cg.ctx.lineTo(x + r / 2, y + hG)
-                } else {
-                    //else move the point
-                    cg.ctx.moveTo(x + r / 2, y)
-                }
-                //store the previous value
-                hG_ = hG
-            }
-
-            //last point
-            if (hG_) cg.ctx.lineTo(xMax + r / 2, y)
-
-            //draw fill
-            const fc = this.fillColor(y, ys, r, zf)
-            if (fc && fc != 'none') {
-                cg.ctx.fillStyle = fc
-                cg.ctx.fill()
-            }
-
-            //draw line
-            const lc = this.lineColor(y, ys, r, zf)
-            const lw = this.lineWidth(y, ys, r, zf)
-            if (lc && lc != 'none' && lw > 0) {
-                cg.ctx.strokeStyle = lc
-                cg.ctx.lineWidth = lw
-                cg.ctx.stroke()
-            }
-        }
-    }
-}
+//@ts-check
+'use strict'
+
+import { Style } from '../Style.js'
+
+/**
+ *
+ * @author Julien Gaffuri
+ */
+export class JoyPlotStyle extends Style {
+    /** @param {object} opts */
+    constructor(opts) {
+        super(opts)
+        opts = opts || {}
+
+        /** The cell column where to get the value to represent.
+         * @type {string} */
+        this.heightCol = opts.heightCol
+
+        /** A function returning the height of a cell.
+         * @type {function(number,number,import("../Style").Stat|undefined,number):number} */
+        this.height = opts.height || ((v) => Math.sqrt(v))
+
+        /**
+         * @type {function(number,{min:number, max:number},number,number):string} */
+        this.lineColor = opts.lineColor || ((y, ys, r, zf) => '#BBB')
+        /**
+         * @type {function(number,{min:number, max:number},number,number):number} */
+        this.lineWidth = opts.lineWidth || ((y, ys, r, zf) => zf)
+        /**
+         * @type {function(number,{min:number, max:number},number,number):string} */
+        this.fillColor = opts.fillColor || ((y, ys, r, zf) => '#c08c5968')
+    }
+
+    /**
+     * Draw cells as squares depending on their value.
+     *
+     * @param {Array.<import("../Dataset").Cell>} cells
+     * @param {number} r
+     * @param {import("../GeoCanvas").GeoCanvas} cg
+     * */
+    draw(cells, r, cg) {
+        //filter
+        if (this.filter) cells = cells.filter(this.filter)
+
+        cg.ctx.lineJoin = 'round'
+
+        //zoom factor
+        const zf = cg.getZf()
+
+        //compute statistics
+        const stat = Style.getStatistics(cells, (c) => c[this.heightCol], true)
+
+        //index cells by y and x
+        /**  @type {object} */
+        const ind = {}
+        for (const cell of cells) {
+            let row = ind[cell.y]
+            if (!row) {
+                row = {}
+                ind[cell.y] = row
+            }
+            row[cell.x] = this.height(cell[this.heightCol], r, stat, zf)
+        }
+
+        //compute extent
+        const e = cg.extGeo
+        if (!e) return
+        const xMin = Math.floor(e.xMin / r) * r
+        const xMax = Math.floor(e.xMax / r) * r
+        const yMin = Math.floor(e.yMin / r) * r
+        const yMax = Math.floor(e.yMax / r) * r
+
+        /**  @type {{min:number, max:number}} */
+        const ys = { min: yMin, max: yMax }
+
+        //draw in geo coordinates
+        cg.setCanvasTransform()
+
+        //draw lines, row by row, stating from the top
+        for (let y = yMax; y >= yMin; y -= r) {
+            //get row
+            const row = ind[y]
+
+            //no row
+            if (!row) continue
+
+            //place first point
+            cg.ctx.beginPath()
+            cg.ctx.moveTo(xMin - r / 2, y)
+
+            //store the previous height
+            /** @type {number|undefined} */
+            let hG_
+
+            //go through the line cells
+            for (let x = xMin; x <= xMax; x += r) {
+                //get column value
+                /** @type {number} */
+                let hG = row[x]
+                if (!hG) hG = 0
+
+                if (hG || hG_) {
+                    //draw line only when at least one of both values is non-null
+                    //TODO test bezierCurveTo
+                    cg.ctx.lineTo(x + r / 2, y + hG)
+                } else {
+                    //else move the point
+                    cg.ctx.moveTo(x + r / 2, y)
+                }
+                //store the previous value
+                hG_ = hG
+            }
+
+            //last point
+            if (hG_) cg.ctx.lineTo(xMax + r / 2, y)
+
+            //draw fill
+            const fc = this.fillColor(y, ys, r, zf)
+            if (fc && fc != 'none') {
+                cg.ctx.fillStyle = fc
+                cg.ctx.fill()
+            }
+
+            //draw line
+            const lc = this.lineColor(y, ys, r, zf)
+            const lw = this.lineWidth(y, ys, r, zf)
+            if (lc && lc != 'none' && lw > 0) {
+                cg.ctx.strokeStyle = lc
+                cg.ctx.lineWidth = lw
+                cg.ctx.stroke()
+            }
+        }
+    }
+}

package/src/style/LegoStyle.js

@@ -1,112 +1,112 @@
-//@ts-check
-'use strict'
-
-import { TanakaStyle } from './TanakaStyle.js'
-import { StrokeStyle } from './StrokeStyle.js'
-import { SquareColorCatWGLStyle } from './SquareColorCatWGLStyle.js'
-import { Style } from '../Style.js'
-
-/**
- * @author Julien Gaffuri
- */
-export class LegoStyle {
-    /**
-     * @param {string} col
-     * @param {object} opts
-     * @returns {Array.<Style>}
-     */
-    static get(col, opts) {
-        opts = opts || {}
-
-        //the colors
-        //http://www.jennyscrayoncollection.com/2021/06/all-current-lego-colors.html
-        //https://leonawicz.github.io/legocolors/reference/figures/README-plot-1.png
-        opts.colors = opts.colors || [
-            '#00852b', //darker green
-            '#afd246', //light green
-            '#fac80a', //dark yellow
-            '#bb805a', //brown
-            '#d67923', //mostard
-            '#cb4e29', //redish
-            '#b40000', //red
-            '#720012', //dark red
-            //"purple",
-            //"#eee" //whithe
-        ]
-
-        opts.colDark = opts.colDark || '#333'
-        opts.colBright = opts.colBright || '#aaa'
-        opts.widthFactor = opts.widthFactor || 0.12
-
-        //reuse tanaka as basis
-        const ts = TanakaStyle.get(col, opts)
-        //style to show limits between pieces
-        const sst = new StrokeStyle({
-            strokeColor: () => '#666',
-            strokeWidth: (v, r, s, z) => 0.2 * z,
-            filter: opts.filter,
-        })
-
-        return [
-            ts[0],
-            sst,
-            ts[1],
-            new LegoTopStyle({ colDark: opts.colDark, colBright: opts.colBright, filter: opts.filter }),
-        ]
-    }
-
-    /**
-     * @param {function(string):string} col
-     * @param {object} opts
-     * @returns {Array.<Style>}
-     */
-    static getCat(col, opts) {
-        opts = opts || {}
-
-        opts.colDark = opts.colDark || '#333'
-        opts.colBright = opts.colBright || '#aaa'
-
-        //
-        const s = new SquareColorCatWGLStyle({ colorCol: col, color: opts.color })
-        //style to show limits between pieces
-        const sst = new StrokeStyle({ strokeColor: () => '#666', strokeWidth: (v, r, s, z) => 0.2 * z })
-
-        return [s, sst, new LegoTopStyle({ colDark: opts.colDark, colBright: opts.colBright })]
-    }
-}
-
-/**
- * A style to draw top circle of lego bricks.
- */
-class LegoTopStyle extends Style {
-    /** @param {object|undefined} opts */
-    constructor(opts) {
-        super(opts)
-        opts = opts || {}
-        this.colDark = opts.colDark || '#333'
-        this.colBright = opts.colBright || '#aaa'
-    }
-
-    draw(cells, r, cg) {
-        //filter
-        if (this.filter) cells = cells.filter(this.filter)
-
-        cg.ctx.lineWidth = 0.6 * cg.getZf()
-
-        //dark part
-        cg.ctx.strokeStyle = this.colDark
-        for (let c of cells) {
-            cg.ctx.beginPath()
-            cg.ctx.arc(c.x + r * 0.5, c.y + r * 0.5, r * 0.55 * 0.5, Math.PI / 4, -Math.PI * (3 / 4), true)
-            cg.ctx.stroke()
-        }
-
-        //bright part
-        cg.ctx.strokeStyle = this.colBright
-        for (let c of cells) {
-            cg.ctx.beginPath()
-            cg.ctx.arc(c.x + r * 0.5, c.y + r * 0.5, r * 0.55 * 0.5, Math.PI / 4, -Math.PI * (3 / 4), false)
-            cg.ctx.stroke()
-        }
-    }
-}
+//@ts-check
+'use strict'
+
+import { TanakaStyle } from './TanakaStyle.js'
+import { StrokeStyle } from './StrokeStyle.js'
+import { SquareColorCatWGLStyle } from './SquareColorCatWGLStyle.js'
+import { Style } from '../Style.js'
+
+/**
+ * @author Julien Gaffuri
+ */
+export class LegoStyle {
+    /**
+     * @param {string} col
+     * @param {object} opts
+     * @returns {Array.<Style>}
+     */
+    static get(col, opts) {
+        opts = opts || {}
+
+        //the colors
+        //http://www.jennyscrayoncollection.com/2021/06/all-current-lego-colors.html
+        //https://leonawicz.github.io/legocolors/reference/figures/README-plot-1.png
+        opts.colors = opts.colors || [
+            '#00852b', //darker green
+            '#afd246', //light green
+            '#fac80a', //dark yellow
+            '#bb805a', //brown
+            '#d67923', //mostard
+            '#cb4e29', //redish
+            '#b40000', //red
+            '#720012', //dark red
+            //"purple",
+            //"#eee" //whithe
+        ]
+
+        opts.colDark = opts.colDark || '#333'
+        opts.colBright = opts.colBright || '#aaa'
+        opts.widthFactor = opts.widthFactor || 0.12
+
+        //reuse tanaka as basis
+        const ts = TanakaStyle.get(col, opts)
+        //style to show limits between pieces
+        const sst = new StrokeStyle({
+            strokeColor: () => '#666',
+            strokeWidth: (v, r, s, z) => 0.2 * z,
+            filter: opts.filter,
+        })
+
+        return [
+            ts[0],
+            sst,
+            ts[1],
+            new LegoTopStyle({ colDark: opts.colDark, colBright: opts.colBright, filter: opts.filter }),
+        ]
+    }
+
+    /**
+     * @param {function(string):string} col
+     * @param {object} opts
+     * @returns {Array.<Style>}
+     */
+    static getCat(col, opts) {
+        opts = opts || {}
+
+        opts.colDark = opts.colDark || '#333'
+        opts.colBright = opts.colBright || '#aaa'
+
+        //
+        const s = new SquareColorCatWGLStyle({ colorCol: col, color: opts.color })
+        //style to show limits between pieces
+        const sst = new StrokeStyle({ strokeColor: () => '#666', strokeWidth: (v, r, s, z) => 0.2 * z })
+
+        return [s, sst, new LegoTopStyle({ colDark: opts.colDark, colBright: opts.colBright })]
+    }
+}
+
+/**
+ * A style to draw top circle of lego bricks.
+ */
+class LegoTopStyle extends Style {
+    /** @param {object|undefined} opts */
+    constructor(opts) {
+        super(opts)
+        opts = opts || {}
+        this.colDark = opts.colDark || '#333'
+        this.colBright = opts.colBright || '#aaa'
+    }
+
+    draw(cells, r, cg) {
+        //filter
+        if (this.filter) cells = cells.filter(this.filter)
+
+        cg.ctx.lineWidth = 0.6 * cg.getZf()
+
+        //dark part
+        cg.ctx.strokeStyle = this.colDark
+        for (let c of cells) {
+            cg.ctx.beginPath()
+            cg.ctx.arc(c.x + r * 0.5, c.y + r * 0.5, r * 0.55 * 0.5, Math.PI / 4, -Math.PI * (3 / 4), true)
+            cg.ctx.stroke()
+        }
+
+        //bright part
+        cg.ctx.strokeStyle = this.colBright
+        for (let c of cells) {
+            cg.ctx.beginPath()
+            cg.ctx.arc(c.x + r * 0.5, c.y + r * 0.5, r * 0.55 * 0.5, Math.PI / 4, -Math.PI * (3 / 4), false)
+            cg.ctx.stroke()
+        }
+    }
+}