gridviz 3.0.14 → 3.0.16

package/src/style/MosaicStyle.js

@@ -1,99 +1,99 @@
-//@ts-check
-'use strict'
-
-import { Style } from '../core/Style.js'
-
-/**
- * @module style
- * @author Julien Gaffuri
- */
-export class MosaicStyle extends Style {
-    /** @param {object} opts */
-    constructor(opts) {
-        super(opts)
-        opts = opts || {}
-
-        /** A function returning the color of the cell.
-         * @type {function(import('../core/Dataset.js').Cell, number, number, object):string} */
-        this.color = opts.color || (() => "#EA6BAC") //(c,r,z,vs) => {}
-
-        /** The mosaic factor, within [0,0.5]. Set to 0 for no mosaic effect. Set to 0.5 for strong mosaic effect.
-         * @type {number} */
-        this.mosaicFactor = opts.mosaicFactor || 0.15
-
-        /** The mosaic shadow factor, within [0,0.5]. Set to 0 for no mosaic shadow. Set to 0.5 for strong mosaic shadow.
-         * @type {number} */
-        this.shadowFactor = opts.shadowFactor || 0.2
-
-        /** The mosaic shadow color.
-         * @type {string} */
-        this.shadowColor = opts.shadowColor || '#555'
-    }
-
-    /**
-     *
-     * @param {Array.<import("../core/Dataset").Cell>} cells
-     * @param {import("../core/GeoCanvas").GeoCanvas} geoCanvas
-     * @param {number} resolution
-     */
-    draw(cells, geoCanvas, resolution) {
-
-        //filter
-        if (this.filter) cells = cells.filter(this.filter)
-
-        //
-        const z = geoCanvas.view.z
-
-        //get view scale
-        const viewScale = this.viewScale ? this.viewScale(cells, resolution, z) : undefined
-
-        //set stroke style, for shadow
-        geoCanvas.ctx.strokeStyle = this.shadowColor
-        geoCanvas.ctx.lineWidth = this.shadowFactor * resolution
-        geoCanvas.ctx.lineJoin = 'round'
-        geoCanvas.ctx.lineCap = 'butt'
-
-        //function to compute position mosaic effect
-        const d = resolution * this.mosaicFactor
-        const mosaic = () => {
-            return { x: Math.random() * d, y: Math.random() * d }
-        }
-
-        for (let cell of cells) {
-            //set fill color
-            const col = this.color ? this.color(cell, resolution, z, viewScale) : undefined
-            if (!col || col === 'none') continue
-            geoCanvas.ctx.fillStyle = col
-
-            //get offset
-            const offset = this.offset(cell, resolution, z)
-
-            //compute position mosaic effect
-            const ll = mosaic(),
-                ul = mosaic(),
-                lr = mosaic(),
-                ur = mosaic()
-
-            //stroke
-            if (this.shadowFactor > 0) {
-                geoCanvas.ctx.beginPath()
-                geoCanvas.ctx.moveTo(cell.x + offset.dx + ll.x, cell.y + offset.dy + ll.y)
-                geoCanvas.ctx.lineTo(cell.x + offset.dx + resolution - lr.x, cell.y + offset.dy + lr.y)
-                geoCanvas.ctx.lineTo(cell.x + offset.dx + resolution - ur.x, cell.y + offset.dy + resolution - ur.y)
-                geoCanvas.ctx.stroke()
-            }
-
-            //fill
-
-            geoCanvas.ctx.beginPath()
-            geoCanvas.ctx.moveTo(cell.x + offset.dx + ll.x, cell.y + offset.dy + ll.y)
-            geoCanvas.ctx.lineTo(cell.x + offset.dx + resolution - lr.x, cell.y + offset.dy + lr.y)
-            geoCanvas.ctx.lineTo(cell.x + offset.dx + resolution - ur.x, cell.y + offset.dy + resolution - ur.y)
-            geoCanvas.ctx.lineTo(cell.x + offset.dx + ul.x, cell.y + offset.dy + resolution - ul.y)
-            geoCanvas.ctx.fill()
-        }
-
-        //update legends
-        this.updateLegends({ style: this, resolution: resolution, z: z, viewScale: viewScale })
-    }
-}
+//@ts-check
+'use strict'
+
+import { Style } from '../core/Style.js'
+
+/**
+ * @module style
+ * @author Julien Gaffuri
+ */
+export class MosaicStyle extends Style {
+    /** @param {object} opts */
+    constructor(opts) {
+        super(opts)
+        opts = opts || {}
+
+        /** A function returning the color of the cell.
+         * @type {function(import('../core/Dataset.js').Cell, number, number, object):string} */
+        this.color = opts.color || (() => '#EA6BAC') //(c,r,z,vs) => {}
+
+        /** The mosaic factor, within [0,0.5]. Set to 0 for no mosaic effect. Set to 0.5 for strong mosaic effect.
+         * @type {number} */
+        this.mosaicFactor = opts.mosaicFactor || 0.15
+
+        /** The mosaic shadow factor, within [0,0.5]. Set to 0 for no mosaic shadow. Set to 0.5 for strong mosaic shadow.
+         * @type {number} */
+        this.shadowFactor = opts.shadowFactor || 0.2
+
+        /** The mosaic shadow color.
+         * @type {string} */
+        this.shadowColor = opts.shadowColor || '#555'
+    }
+
+    /**
+     *
+     * @param {Array.<import("../core/Dataset").Cell>} cells
+     * @param {import("../core/GeoCanvas").GeoCanvas} geoCanvas
+     * @param {number} resolution
+     */
+    draw(cells, geoCanvas, resolution) {
+        //filter
+        if (this.filter) cells = cells.filter(this.filter)
+
+        //
+        const z = geoCanvas.view.z
+        const ctx = geoCanvas.offscreenCtx
+
+        //get view scale
+        const viewScale = this.viewScale ? this.viewScale(cells, resolution, z) : undefined
+
+        //set stroke style, for shadow
+        ctx.strokeStyle = this.shadowColor
+        ctx.lineWidth = this.shadowFactor * resolution
+        ctx.lineJoin = 'round'
+        ctx.lineCap = 'butt'
+
+        //function to compute position mosaic effect
+        const d = resolution * this.mosaicFactor
+        const mosaic = () => {
+            return { x: Math.random() * d, y: Math.random() * d }
+        }
+
+        for (let cell of cells) {
+            //set fill color
+            const col = this.color ? this.color(cell, resolution, z, viewScale) : undefined
+            if (!col || col === 'none') continue
+            ctx.fillStyle = col
+
+            //get offset
+            const offset = this.offset(cell, resolution, z)
+
+            //compute position mosaic effect
+            const ll = mosaic(),
+                ul = mosaic(),
+                lr = mosaic(),
+                ur = mosaic()
+
+            //stroke
+            if (this.shadowFactor > 0) {
+                ctx.beginPath()
+                ctx.moveTo(cell.x + offset.dx + ll.x, cell.y + offset.dy + ll.y)
+                ctx.lineTo(cell.x + offset.dx + resolution - lr.x, cell.y + offset.dy + lr.y)
+                ctx.lineTo(cell.x + offset.dx + resolution - ur.x, cell.y + offset.dy + resolution - ur.y)
+                ctx.stroke()
+            }
+
+            //fill
+
+            ctx.beginPath()
+            ctx.moveTo(cell.x + offset.dx + ll.x, cell.y + offset.dy + ll.y)
+            ctx.lineTo(cell.x + offset.dx + resolution - lr.x, cell.y + offset.dy + lr.y)
+            ctx.lineTo(cell.x + offset.dx + resolution - ur.x, cell.y + offset.dy + resolution - ur.y)
+            ctx.lineTo(cell.x + offset.dx + ul.x, cell.y + offset.dy + resolution - ul.y)
+            ctx.fill()
+        }
+
+        //update legends
+        this.updateLegends({ style: this, resolution: resolution, z: z, viewScale: viewScale })
+    }
+}

package/src/style/NinjaStarStyle.js

@@ -1,102 +1,102 @@
-//@ts-check
-'use strict'
-
-import { Style } from '../core/Style.js'
-
-/**
- * @module style
- * @author Joseph Davies, Julien Gaffuri
- */
-export class NinjaStarStyle extends Style {
-    /** @param {object} opts */
-    constructor(opts) {
-        super(opts)
-        opts = opts || {}
-
-        /** A function returning the color of the cell.
-         * @type {function(import('../core/Dataset.js').Cell, number, number, object):string} */
-        this.color = opts.color || (() => "#EA6BAC") //(c,r,z,vs) => {}
-
-        /** A function returning the size of a cell, within [0,1]:
-         *  - 0, nothing shown
-         *  - 1, entire square
-          * @type {function(import('../core/Dataset.js').Cell, number, number, object):number} */
-        this.size = opts.size || ((cell, resolution) => resolution) //(c,r,z,vs) => {}
-
-        /** A function returning the shape.
-         * @type {function(import("../core/Dataset").Cell):string} */
-        this.shape = opts.shape || (() => 'o')
-    }
-
-    /**
-     *
-     * @param {Array.<import('../core/Dataset.js').Cell>} cells
-     * @param {import("../core/GeoCanvas").GeoCanvas} geoCanvas
-     * @param {number} resolution
-     */
-    draw(cells, geoCanvas, resolution) {
-
-        //filter
-        if (this.filter) cells = cells.filter(this.filter)
-
-        //
-        const z = geoCanvas.view.z
-
-        //get view scale
-        const viewScale = this.viewScale ? this.viewScale(cells, resolution, z) : undefined
-
-        const r2 = resolution * 0.5
-        for (let cell of cells) {
-            //color
-            const col = this.color ? this.color(cell, resolution, z, viewScale) : undefined
-            if (!col || col === 'none') continue
-            geoCanvas.ctx.fillStyle = col
-
-            //size - in geo unit
-            let k = this.size(cell, resolution, z, viewScale)
-            k = k < 0 ? 0 : k > 1 ? 1 : k
-            const sG2 = k * r2
-
-            //shape
-            const shape = this.shape ? this.shape(cell) : 'o'
-            if (shape === 'none') continue
-
-            //get offset
-            //TODO use
-            //const offset = this.offset(cell, r, z)
-
-            //center position
-            const cx = cell.x + r2
-            const cy = cell.y + r2
-
-            if (shape === 'p') {
-                geoCanvas.ctx.beginPath()
-                geoCanvas.ctx.moveTo(cx, cy + r2)
-                geoCanvas.ctx.lineTo(cx + sG2, cy + sG2)
-                geoCanvas.ctx.lineTo(cx + r2, cy)
-                geoCanvas.ctx.lineTo(cx + sG2, cy - sG2)
-                geoCanvas.ctx.lineTo(cx, cy - r2)
-                geoCanvas.ctx.lineTo(cx - sG2, cy - sG2)
-                geoCanvas.ctx.lineTo(cx - r2, cy)
-                geoCanvas.ctx.lineTo(cx - sG2, cy + sG2)
-                geoCanvas.ctx.fill()
-            } else if (shape === 'o') {
-                geoCanvas.ctx.beginPath()
-                geoCanvas.ctx.moveTo(cx, cy + sG2)
-                geoCanvas.ctx.lineTo(cx + r2, cy + r2)
-                geoCanvas.ctx.lineTo(cx + sG2, cy)
-                geoCanvas.ctx.lineTo(cx + r2, cy - r2)
-                geoCanvas.ctx.lineTo(cx, cy - sG2)
-                geoCanvas.ctx.lineTo(cx - r2, cy - r2)
-                geoCanvas.ctx.lineTo(cx - sG2, cy)
-                geoCanvas.ctx.lineTo(cx - r2, cy + r2)
-                geoCanvas.ctx.fill()
-            } else {
-                throw new Error('Unexpected shape:' + shape)
-            }
-        }
-
-        //update legends
-        this.updateLegends({ style: this, resolution: resolution, z: z, viewScale: viewScale })
-    }
-}
+//@ts-check
+'use strict'
+
+import { Style } from '../core/Style.js'
+
+/**
+ * @module style
+ * @author Joseph Davies, Julien Gaffuri
+ */
+export class NinjaStarStyle extends Style {
+    /** @param {object} opts */
+    constructor(opts) {
+        super(opts)
+        opts = opts || {}
+
+        /** A function returning the color of the cell.
+         * @type {function(import('../core/Dataset.js').Cell, number, number, object):string} */
+        this.color = opts.color || (() => '#EA6BAC') //(c,r,z,vs) => {}
+
+        /** A function returning the size of a cell, within [0,1]:
+         *  - 0, nothing shown
+         *  - 1, entire square
+         * @type {function(import('../core/Dataset.js').Cell, number, number, object):number} */
+        this.size = opts.size || ((cell, resolution) => resolution) //(c,r,z,vs) => {}
+
+        /** A function returning the shape.
+         * @type {function(import("../core/Dataset").Cell):string} */
+        this.shape = opts.shape || (() => 'o')
+    }
+
+    /**
+     *
+     * @param {Array.<import('../core/Dataset.js').Cell>} cells
+     * @param {import("../core/GeoCanvas").GeoCanvas} geoCanvas
+     * @param {number} resolution
+     */
+    draw(cells, geoCanvas, resolution) {
+        //filter
+        if (this.filter) cells = cells.filter(this.filter)
+
+        //
+        const z = geoCanvas.view.z
+        const ctx = geoCanvas.offscreenCtx
+
+        //get view scale
+        const viewScale = this.viewScale ? this.viewScale(cells, resolution, z) : undefined
+
+        const r2 = resolution * 0.5
+        for (let cell of cells) {
+            //color
+            const col = this.color ? this.color(cell, resolution, z, viewScale) : undefined
+            if (!col || col === 'none') continue
+            ctx.fillStyle = col
+
+            //size - in geo unit
+            let k = this.size(cell, resolution, z, viewScale)
+            k = k < 0 ? 0 : k > 1 ? 1 : k
+            const sG2 = k * r2
+
+            //shape
+            const shape = this.shape ? this.shape(cell) : 'o'
+            if (shape === 'none') continue
+
+            //get offset
+            //TODO use
+            //const offset = this.offset(cell, r, z)
+
+            //center position
+            const cx = cell.x + r2
+            const cy = cell.y + r2
+
+            if (shape === 'p') {
+                ctx.beginPath()
+                ctx.moveTo(cx, cy + r2)
+                ctx.lineTo(cx + sG2, cy + sG2)
+                ctx.lineTo(cx + r2, cy)
+                ctx.lineTo(cx + sG2, cy - sG2)
+                ctx.lineTo(cx, cy - r2)
+                ctx.lineTo(cx - sG2, cy - sG2)
+                ctx.lineTo(cx - r2, cy)
+                ctx.lineTo(cx - sG2, cy + sG2)
+                ctx.fill()
+            } else if (shape === 'o') {
+                ctx.beginPath()
+                ctx.moveTo(cx, cy + sG2)
+                ctx.lineTo(cx + r2, cy + r2)
+                ctx.lineTo(cx + sG2, cy)
+                ctx.lineTo(cx + r2, cy - r2)
+                ctx.lineTo(cx, cy - sG2)
+                ctx.lineTo(cx - r2, cy - r2)
+                ctx.lineTo(cx - sG2, cy)
+                ctx.lineTo(cx - r2, cy + r2)
+                ctx.fill()
+            } else {
+                throw new Error('Unexpected shape:' + shape)
+            }
+        }
+
+        //update legends
+        this.updateLegends({ style: this, resolution: resolution, z: z, viewScale: viewScale })
+    }
+}