gridviz 3.0.1 → 3.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "gridviz",
-    "version": "3.0.1",
+    "version": "3.0.2",
     "description": "Visualization tool for gridded statistics",
     "keywords": [
         "statistics",
@@ -40,7 +40,7 @@
         "start": "export NODE_OPTIONS=--openssl-legacy-provider && webpack --config webpack.config.dev.cjs",
         "start-dev": "webpack --config webpack.config.dev.cjs",
         "server": "webpack serve -c webpack.config.dev.cjs",
-        "doc": "./node_modules/.bin/jsdoc src/ src/dataset src/legend src/style -d docs/jsdoc",
+        "doc": "./node_modules/.bin/jsdoc -c docs/jsdoc/jsdoc.conf.json",
         "bp": "webpack --config webpack.config.prod.cjs",
         "test": "jest"
     },
@@ -55,7 +55,8 @@
         "d3-random": "^3.0.1",
         "d3-scale": "^4.0.2",
         "d3-selection": "^3.0.0",
-        "d3-zoom": "^3.0.0"
+        "d3-zoom": "^3.0.0",
+        "jsdoc": "^4.0.2"
     },
     "devDependencies": {
         "@babel/core": "^7.9.0",

package/src/button/Button.js

@@ -3,6 +3,7 @@ import { select } from 'd3-selection'
 /**
  * Parent class for button elements used to interact with the gridviz viewer.
  *
+ * @module button
  * @author Joseph Davies, Julien Gaffuri
  */
 export class Button {

package/src/button/FullscreenButton.js

@@ -3,6 +3,7 @@ import { Button } from './Button.js'
 /**
  * Button for toggling fullscreen mode
  *
+ * @module button
  * @author Joseph Davies, Julien Gaffuri
  */
 export class FullscreenButton extends Button {

package/src/button/ZoomButtons.js

@@ -3,6 +3,7 @@ import { Button } from './Button.js'
 /**
  * Button for toggling fullscreen mode
  *
+ * @module button
  * @author Joseph Davies, Julien Gaffuri
  */
 export class ZoomButtons extends Button {

package/src/core/Dataset.js

@@ -9,6 +9,7 @@
  * A dataset component, of grid cells.
  * @abstract
  *
+ * @module core
  * @author Joseph Davies, Julien Gaffuri
  */
 export class Dataset {

package/src/core/Drawable.js

@@ -5,6 +5,7 @@
  * This is an abstract class used to group elements shared between Layer and Style classes.
  * 
  * @abstract
+ * @module core
  * @author Joseph Davies, Julien Gaffuri
  */
 export class Drawable {

package/src/core/GeoCanvas.js

@@ -13,6 +13,7 @@ import { zoom as d3zoom, zoomIdentity } from 'd3-zoom'
 /**
  * A HTML canvas for geo data display, enhanced with zoom and pan capabilities.
  *
+ * @module core
  * @author Joseph Davies, Julien Gaffuri
  */
 export class GeoCanvas {

package/src/core/Layer.js

@@ -4,6 +4,7 @@
 import { Drawable } from "./Drawable.js"
 
 /**
+ * @module core
  * @abstract
  * @author Joseph Davies, Julien Gaffuri
  */

package/src/core/Legend.js

@@ -6,6 +6,7 @@ import { select } from 'd3-selection'
 /**
  * A legend container.
  *
+ * @module core
  * @author Joseph Davies, Julien Gaffuri
  */
 export class Legend {

package/src/core/Map.js

@@ -13,6 +13,7 @@ import { select } from 'd3-selection'
 /**
  * A gridviz application.
  *
+ * @module core
  * @author Joseph Davies, Julien Gaffuri
  */
 export class Map {

package/src/core/MultiResolutionDataset.js

@@ -7,6 +7,7 @@
  *
  * @abstract
  *
+ * @module core
  * @author Joseph Davies, Julien Gaffuri
  */
 export class MultiResolutionDataset {

package/src/core/Style.js

@@ -13,6 +13,7 @@ import { Drawable } from "./Drawable.js"
 /**
  * A style, to show a grid dataset.
  *
+ * @module core
  * @author Joseph Davies, Julien Gaffuri
  */
 export class Style extends Drawable {
@@ -73,7 +74,7 @@ export class Style extends Drawable {
         return this
     }
 
-    /** Hide all legend elements of the style, if any
+    /** Update legends of the style, if any
      * @param {object} opts
      * @returns {this} */
     updateLegends(opts) {
@@ -81,4 +82,12 @@ export class Style extends Drawable {
         return this
     }
 
+    /**
+     * @param {Array.<import("./Legend").Legend>} legends
+     * @returns {this} */
+    addLegends(legends) {
+        for (let legend of legends)
+            this.legends.push(legend)
+        return this
+    }
 }

package/src/core/Tooltip.js

@@ -7,6 +7,7 @@ import { select } from 'd3-selection'
 /**
  * A generic class to make a tooltip.
  * It is a div element, which can be moved under the mouse pointer and filled with some information in html.
+ * @module core
  */
 export class Tooltip {
     /**

package/src/dataset/COGeo.js

@@ -8,6 +8,7 @@ import { Dataset } from '../core/Dataset.js'
  * A dataset composed of a COGeo file.
  * @see https://www.cogeo.org/
  *
+ * @module dataset
  * @author Joseph Davies, Julien Gaffuri
  */
 export class COGeo extends Dataset {

package/src/dataset/CSVGrid.js

@@ -9,6 +9,7 @@ import { Dataset } from '../core/Dataset.js'
 /**
  * A dataset composed of a single CSV file (not tiled).
  *
+ * @module dataset
  * @author Joseph Davies, Julien Gaffuri
  */
 export class CSVGrid extends Dataset {

package/src/dataset/GeoTIFF.js

@@ -8,6 +8,7 @@ import { Dataset } from '../core/Dataset.js'
  * @todo
  * A dataset composed of a single GeoTiff file.
  *
+ * @module dataset
  * @author Joseph Davies, Julien Gaffuri
  */
 export class GeoTIFF extends Dataset {

package/src/dataset/JSGrid.js

@@ -6,6 +6,7 @@ import { Dataset } from '../core/Dataset.js'
 /**
  * A dataset composed of cells defined in javascript, or loaded outside of gridviz map.
  *
+ * @module dataset
  * @author Joseph Davies, Julien Gaffuri
  */
 export class JSGrid extends Dataset {

package/src/dataset/TiledGrid.js

@@ -13,6 +13,7 @@ import { json, csv } from 'd3-fetch'
 /**
  * A tiled dataset, composed of CSV tiles.
  *
+ * @module dataset
  * @author Joseph Davies, Julien Gaffuri
  */
 export class TiledGrid extends Dataset {

package/src/index.js

@@ -25,8 +25,8 @@ export { SideStyle } from './style/SideStyle.js'
 //export { ContourStyle } from './style/ContourStyle.js'
 export { SideCategoryStyle } from './style/SideCategoryStyle.js'
 export { DotDensityStyle } from './style/DotDensityStyle.js'
-//export { TanakaStyle } from './style/TanakaStyle.js'
-//export { LegoStyle } from './style/LegoStyle.js'
+export { TanakaStyle } from './style/TanakaStyle.js'
+export { LegoStyle } from './style/LegoStyle.js'
 export { SquareColorWebGLStyle } from './style/SquareColorWebGLStyle.js'
 export { SquareColorCategoryWebGLStyle } from './style/SquareColorCategoryWebGLStyle.js'
 export { MosaicStyle } from './style/MosaicStyle.js'

package/src/layer/BackgroundLayer.js

@@ -9,6 +9,7 @@ import { Layer } from '../core/Layer.js'
  * See https://wiki.openstreetmap.org/wiki/Slippy_map_tilenames
  * https://www.maptiler.com/google-maps-coordinates-tile-bounds-projection/#6/27.88/44.48
  * 
+ * @module layer
  * @author Julien Gaffuri
  */
 export class BackgroundLayer extends Layer {

package/src/layer/BackgroundLayerWMS.js

@@ -7,6 +7,7 @@ import { Layer } from '../core/Layer.js'
  *
  * A map WMS background layer.
  * 
+ * @module layer
  * @author Julien Gaffuri
  */
 export class BackgroundLayerWMS extends Layer {

package/src/layer/GeoJSONLayer.js

@@ -5,6 +5,7 @@ import { Layer } from '../core/Layer.js'
 import { json } from 'd3-fetch'
 
 /**
+ * @module layer
  * @author Joseph Davies, Julien Gaffuri
  */
 export class GeoJSONLayer extends Layer {

package/src/layer/GridLayer.js

@@ -6,6 +6,7 @@ import { Layer } from '../core/Layer.js'
 /**
  * A layer, which specifies a dataset to be shown with specified styles.
  *
+ * @module layer
  * @author Joseph Davies, Julien Gaffuri
  */
 export class GridLayer extends Layer {

package/src/layer/LabelLayer.js

@@ -13,6 +13,7 @@ import { csv } from 'd3-fetch'
  * If the label data is not in the expected format or in the same CRS as the grid, it can be corrected with the "preprocess" function.
  * The selection of the label, their style (font, weight, etc.) and color can be specified depending on their importance and the zoom level.
  *
+ * @module layer
  * @author Joseph Davies, Julien Gaffuri
  */
 export class LabelLayer extends Layer {

package/src/legend/ColorCategoryLegend.js

@@ -6,6 +6,7 @@ import { Legend } from '../core/Legend.js'
 /**
  * A legend element for color categrories.
  *
+ * @module legend
  * @author Joseph Davies, Julien Gaffuri
  */
 export class ColorCategoryLegend extends Legend {

package/src/legend/ColorDiscreteLegend.js

@@ -7,6 +7,7 @@ import { Legend } from '../core/Legend.js'
  * A legend element for discrete color style.
  * Inspiration: https://observablehq.com/@d3/color-legend
  *
+ * @module legend
  * @author Julien Gaffuri
  */
 export class ColorDiscreteLegend extends Legend {
@@ -43,6 +44,7 @@ export class ColorDiscreteLegend extends Legend {
         //get colors and breaks
         const colors = this.colors(opts.viewScale)
         const breaks = this.breaks(opts.viewScale)
+        if (!breaks) return
 
         //classes
         const nb = colors.length

package/src/legend/ColorLegend.js

@@ -7,6 +7,7 @@ import { Legend } from '../core/Legend.js'
  * A legend element for continuous color style.
  * Inspiration: https://observablehq.com/@d3/color-legend
  *
+ * @module legend
  * @author Joseph Davies, Julien Gaffuri
  */
 export class ColorLegend extends Legend {

package/src/legend/OrientationLegend.js

@@ -6,6 +6,7 @@ import { Legend } from '../core/Legend.js'
 /**
  * A legend element for segment orientation.
  *
+ * @module legend
  * @author Joseph Davies, Julien Gaffuri
  */
 export class OrientationLegend extends Legend {

package/src/legend/SizeLegend.js

@@ -8,6 +8,7 @@ import { max } from 'd3-array'
 /**
  * A legend element for proportional symbols.
  *
+ * @module legend
  * @author Joseph Davies, Julien Gaffuri
  */
 export class SizeLegend extends Legend {
@@ -198,10 +199,11 @@ export function sizeDiscreteViewScaleLegend(classNumber, opts = {}) {
     const f = opts.labelFormat || (x => x)
     const labelText = opts.labelText || defaultLabelText(f)
     const legends = []
+    const viewScaleFun = opts.viewScaleFun || (t => t) //TODO do it differently? At sizelegend level !
     for (let i = classNumber - 1; i >= 0; i--) {
         opts.title = i == classNumber - 1 ? opts.title : undefined
-        opts.size = (viewScale) => viewScale.values[i]
-        opts.label = (viewScale) => labelText(viewScale.breaks[i - 1], viewScale.breaks[i])
+        opts.size = (viewScale) => viewScaleFun(viewScale).values[i]
+        opts.label = (viewScale) => labelText(viewScaleFun(viewScale).breaks[i - 1], viewScaleFun(viewScale).breaks[i])
         legends.push(new SizeLegend(opts))
     }
     return legends

package/src/style/CompositionStyle.js

@@ -11,6 +11,7 @@ import { Style } from '../core/Style.js'
  * For a list of supported symbols, @see CompositionType
  * The symbol can be scaled depending on the cell importance.
  *
+ * @module style
  * @author Julien Gaffuri
  */
 export class CompositionStyle extends Style {

package/src/style/ContourStyle.js

@@ -7,6 +7,7 @@ import { SideStyle } from './SideStyle.js'
 
 /**
  *
+ * @module style
  * @author Julien Gaffuri
  */
 export class ContourStyle extends SideStyle {

package/src/style/DotDensityStyle.js

@@ -9,6 +9,7 @@ import { color } from 'd3-color'
 
 /**
  *
+ * @module style
  * @author Julien Gaffuri
  */
 export class DotDensityStyle extends Style {

package/src/style/IsoFenceStyle.js

@@ -7,6 +7,7 @@ import { SideStyle } from './SideStyle.js'
 /** @typedef {{x:number,y:number,or:"v"|"h",c1:import('../core/Dataset.js').Cell|undefined,c2:import('../core/Dataset.js').Cell|undefined}} Side */
 
 /**
+ * @module style
  * @author Julien Gaffuri
  */
 export class IsoFenceStyle extends Style {
@@ -77,57 +78,7 @@ export class IsoFenceStyle extends Style {
 
         //make sides
         /**  @type {Array.<Side>} */
-        const sides = SideStyle.buildSides(cells, resolution, this.angle % 180 != 90 && this.sVert, this.angle % 180 != 0 && this.sHor, true)
-
-
-
-        /*const sides = []
-
-        //make horizontal sides - except when angle%180=0
-        //sort cells by x and y
-        if (this.angle % 180 != 90 && this.sVert) {
-            cells.sort((c1, c2) => (c2.x == c1.x ? c1.y - c2.y : c1.x - c2.x))
-            let c1 = cells[0]
-            for (let i = 1; i < cells.length; i++) {
-                let c2 = cells[i]
-
-                if ((c1.y + resolution == c2.y) && (c1.x == c2.x))
-                    //cells in same column and touch along horizontal side
-                    //make shared side
-                    sides.push({ x: c1.x + r2, y: c2.y, or: 'h', c1: c1, c2: c2 })
-                else {
-                    //cells do not touch along horizontal side
-                    //make two sides: top one for c1, bottom for c2
-                    sides.push({ x: c1.x + r2, y: c1.y + resolution, or: 'h', c1: c1, c2: undefined })
-                    sides.push({ x: c2.x + r2, y: c2.y, or: 'h', c1: undefined, c2: c2 })
-                }
-
-                c1 = c2
-            }
-        }
-
-        //make vertical sides - except when angle%180=90
-        //sort cells by y and x
-        if (this.angle % 180 != 0 && this.sHor) {
-            cells.sort((c1, c2) => (c2.y == c1.y ? c1.x - c2.x : c1.y - c2.y))
-            let c1 = cells[0]
-            for (let i = 1; i < cells.length; i++) {
-                let c2 = cells[i]
-
-                if ((c1.x + resolution == c2.x) && (c1.y == c2.y))
-                    //cells in same row and touch along vertical side
-                    //make shared side
-                    sides.push({ x: c2.x, y: c1.y + r2, or: 'v', c1: c1, c2: c2 })
-                else {
-                    //cells do not touch along vertical side
-                    //make two sides: right one for c1, left for c2
-                    sides.push({ x: c1.x + resolution, y: c1.y + r2, or: 'v', c1: c1, c2: undefined })
-                    sides.push({ x: c2.x, y: c2.y + r2, or: 'v', c1: undefined, c2: c2 })
-                }
-
-                c1 = c2
-            }
-        }*/
+        const sides = SideStyle.buildSides(cells, resolution, this.angle % 180 != 90 && this.sVert, this.angle % 180 != 0 && this.sHor)
 
         //
         if (sides.length == 0) return
@@ -163,15 +114,16 @@ export class IsoFenceStyle extends Style {
 
         //draw sides
         geoCanvas.ctx.lineCap = "round";
-        for (let s of sides) {
+        for (let side of sides) {
+            const c1 = side.c1, c2 = side.c2, x = side.x, y = side.y
 
             //heights - in geo
-            const hG1 = s.c1 ? this.height(s.c1, resolution, z, viewScale) : 0,
-                hG2 = s.c2 ? this.height(s.c2, resolution, z, viewScale) : 0
+            const hG1 = c1 ? this.height(c1, resolution, z, viewScale) : 0,
+                hG2 = c2 ? this.height(c2, resolution, z, viewScale) : 0
 
             //compute totals for both cells
-            const total1 = computeTotal(s.c1, cats),
-                total2 = computeTotal(s.c2, cats)
+            const total1 = computeTotal(c1, cats),
+                total2 = computeTotal(c2, cats)
             if (total1 == 0 && total2 == 0) continue
 
             let cumul1 = 0, cumul2 = 0
@@ -179,8 +131,8 @@ export class IsoFenceStyle extends Style {
                 //draw stripe of side s and category column
 
                 //get values for both cells
-                let v1 = s.c1 ? +s.c1[column] : 0
-                let v2 = s.c2 ? +s.c2[column] : 0
+                let v1 = c1 ? +c1[column] : 0
+                let v2 = c2 ? +c2[column] : 0
                 if (v1 == 0 && v2 == 0) continue
 
                 //compute heights
@@ -191,26 +143,26 @@ export class IsoFenceStyle extends Style {
 
                 //make path
                 geoCanvas.ctx.beginPath()
-                if (s.or == "h") {
+                if (side.or == "h") {
                     //horizontal side - vertical section
                     //bottom left
-                    geoCanvas.ctx.moveTo(s.x + h1 * cos + dx, s.y - r2 + h1 * sin + dy)
+                    geoCanvas.ctx.moveTo(x + h1 * cos + dx, y - r2 + h1 * sin + dy)
                     //top left
-                    geoCanvas.ctx.lineTo(s.x + h2 * cos + dx, s.y + r2 + h2 * sin + dy)
+                    geoCanvas.ctx.lineTo(x + h2 * cos + dx, y + r2 + h2 * sin + dy)
                     //top right
-                    geoCanvas.ctx.lineTo(s.x + h2n * cos + dx, s.y + r2 + h2n * sin + dy)
+                    geoCanvas.ctx.lineTo(x + h2n * cos + dx, y + r2 + h2n * sin + dy)
                     //bottom right
-                    geoCanvas.ctx.lineTo(s.x + h1n * cos + dx, s.y - r2 + h1n * sin + dy)
+                    geoCanvas.ctx.lineTo(x + h1n * cos + dx, y - r2 + h1n * sin + dy)
                 } else {
                     //vertical side - horizontal section
                     //bottom left
-                    geoCanvas.ctx.moveTo(s.x - r2 + h1 * cos + dx, s.y + h1 * sin + dy)
+                    geoCanvas.ctx.moveTo(x - r2 + h1 * cos + dx, y + h1 * sin + dy)
                     //bottom right
-                    geoCanvas.ctx.lineTo(s.x + r2 + h2 * cos + dx, s.y + h2 * sin + dy)
+                    geoCanvas.ctx.lineTo(x + r2 + h2 * cos + dx, y + h2 * sin + dy)
                     //top right
-                    geoCanvas.ctx.lineTo(s.x + r2 + h2n * cos + dx, s.y + h2n * sin + dy)
+                    geoCanvas.ctx.lineTo(x + r2 + h2n * cos + dx, y + h2n * sin + dy)
                     //top left
-                    geoCanvas.ctx.lineTo(s.x - r2 + h1n * cos + dx, s.y + h1n * sin + dy)
+                    geoCanvas.ctx.lineTo(x - r2 + h1n * cos + dx, y + h1n * sin + dy)
                 }
                 //cg.ctx.closePath()
 
@@ -223,11 +175,11 @@ export class IsoFenceStyle extends Style {
 
                 //TODO draw only one line
                 //draw corner line
-                //if (s.or == "h") {
-                drawCornerLine(s.c1)
-                drawCornerLine(s.c2)
-                //if (this.angle > 0 && s.or == "h") drawCornerLine(s.c2)
-                //else drawCornerLine(s.c2)
+                //if (side.or == "h") {
+                drawCornerLine(c1)
+                drawCornerLine(c2)
+                //if (this.angle > 0 && side.or == "h") drawCornerLine(c2)
+                //else drawCornerLine(c2)
                 //}
             }
         }

package/src/style/JoyPlotStyle.js

@@ -4,7 +4,7 @@
 import { Style } from '../core/Style.js'
 
 /**
- *
+ * @module style
  * @author Julien Gaffuri
  */
 export class JoyPlotStyle extends Style {

package/src/style/LegoStyle.js

@@ -7,21 +7,18 @@ import { SquareColorCategoryWebGLStyle } from './SquareColorCategoryWebGLStyle.j
 import { Style } from '../core/Style.js'
 
 /**
+ * @module style
  * @author Julien Gaffuri
  */
 export class LegoStyle {
-    /**
-     * @param {string} col
-     * @param {object} opts
-     * @returns {Array.<Style>}
-     */
-    static get(col, opts) {
+
+    static get(value, breaks, colors, 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 || [
+        /*opts.colors = opts.colors || [
             '#00852b', //darker green
             '#afd246', //light green
             '#fac80a', //dark yellow
@@ -32,18 +29,18 @@ export class LegoStyle {
             '#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)
+        const ts = TanakaStyle.get(value, breaks, colors, opts)
         //style to show limits between pieces
         const sst = new StrokeStyle({
             strokeColor: () => '#666',
-            strokeWidth: (v, r, s, z) => 0.2 * z,
+            strokeWidth: (c, r, z) => 0.2 * z,
             filter: opts.filter,
         })
 
@@ -56,20 +53,21 @@ export class LegoStyle {
     }
 
     /**
-     * @param {function(string):string} col
+     * @param {function(import('../core/Dataset.js').Cell):string} code
+     * @param {object} color
      * @param {object} opts
      * @returns {Array.<Style>}
      */
-    static getCat(col, opts) {
+    static getCategory(code, color, opts) {
         opts = opts || {}
 
         opts.colDark = opts.colDark || '#333'
         opts.colBright = opts.colBright || '#aaa'
 
         //
-        const s = new SquareColorCategoryWebGLStyle({ colorCol: col, color: opts.color })
+        const s = new SquareColorCategoryWebGLStyle({ code: code, color: color })
         //style to show limits between pieces
-        const sst = new StrokeStyle({ strokeColor: () => '#666', strokeWidth: (v, r, s, z) => 0.2 * z })
+        const sst = new StrokeStyle({ strokeColor: () => '#666', strokeWidth: (c, r, z) => 0.2 * z })
 
         return [s, sst, new LegoTopStyle({ colDark: opts.colDark, colBright: opts.colBright })]
     }
@@ -87,26 +85,26 @@ class LegoTopStyle extends Style {
         this.colBright = opts.colBright || '#aaa'
     }
 
-    draw(cells, r, cg) {
+    draw(cells, geoCanvas, r) {
         //filter
         if (this.filter) cells = cells.filter(this.filter)
 
-        cg.ctx.lineWidth = 0.6 * cg.view.z
+        geoCanvas.ctx.lineWidth = 0.6 * geoCanvas.view.z
 
         //dark part
-        cg.ctx.strokeStyle = this.colDark
+        geoCanvas.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()
+            geoCanvas.ctx.beginPath()
+            geoCanvas.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)
+            geoCanvas.ctx.stroke()
         }
 
         //bright part
-        cg.ctx.strokeStyle = this.colBright
+        geoCanvas.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()
+            geoCanvas.ctx.beginPath()
+            geoCanvas.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)
+            geoCanvas.ctx.stroke()
         }
     }
 }

package/src/style/MosaicStyle.js

@@ -4,6 +4,7 @@
 import { Style } from '../core/Style.js'
 
 /**
+ * @module style
  * @author Julien Gaffuri
  */
 export class MosaicStyle extends Style {

package/src/style/NinjaStarStyle.js

@@ -4,7 +4,7 @@
 import { Style } from '../core/Style.js'
 
 /**
- *
+ * @module style
  * @author Joseph Davies, Julien Gaffuri
  */
 export class NinjaStarStyle extends Style {

package/src/style/PillarStyle.js

@@ -4,6 +4,7 @@
 import { Style } from '../core/Style.js'
 
 /**
+ * @module style
  * @author Julien Gaffuri
  */
 export class PillarStyle extends Style {