gridviz 2.0.38 → 2.0.39

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/README.md +119 -119
  2. package/dist/gridviz.js +7488 -7530
  3. package/dist/gridviz.min.js +1 -1
  4. package/package.json +78 -78
  5. package/src/App.js +698 -698
  6. package/src/BackgroundLayer.js +182 -182
  7. package/src/BackgroundLayerWMS.js +131 -131
  8. package/src/Dataset.js +76 -76
  9. package/src/DatasetComponent.js +103 -103
  10. package/src/GeoCanvas.js +419 -419
  11. package/src/LabelLayer.js +190 -190
  12. package/src/Layer.js +92 -92
  13. package/src/Legend.js +86 -86
  14. package/src/LineLayer.js +150 -150
  15. package/src/Style.js +114 -114
  16. package/src/Tooltip.js +168 -168
  17. package/src/dataset/COGeo.js +24 -24
  18. package/src/dataset/CSVGrid.js +104 -104
  19. package/src/dataset/GeoTIFF.js +127 -127
  20. package/src/dataset/GridTile.js +41 -41
  21. package/src/dataset/ParquetGrid.js +122 -122
  22. package/src/dataset/TiledGrid.js +296 -296
  23. package/src/index.js +177 -177
  24. package/src/legend/ColorCategoryLegend.js +124 -124
  25. package/src/legend/ColorDiscreteLegend.js +105 -105
  26. package/src/legend/ColorLegend.js +125 -125
  27. package/src/legend/SegmentOrientationLegend.js +87 -87
  28. package/src/legend/SegmentWidthLegend.js +97 -97
  29. package/src/legend/SizeLegend.js +141 -141
  30. package/src/style/CompositionStyle.js +300 -300
  31. package/src/style/ContourStyle.js +54 -54
  32. package/src/style/DotDensityStyle.js +156 -156
  33. package/src/style/JoyPlotStyle.js +135 -135
  34. package/src/style/KernelSmoothingOldStyle.js +221 -221
  35. package/src/style/KernelSmoothingStyle.js +115 -115
  36. package/src/style/KernelSmoothingWGLStyle.js +130 -130
  37. package/src/style/LegoStyle.js +112 -112
  38. package/src/style/MosaicStyle.js +107 -107
  39. package/src/style/NinjaStarStyle.js +124 -124
  40. package/src/style/PillarStyle.js +230 -230
  41. package/src/style/SegmentStyle.js +142 -142
  42. package/src/style/ShapeColorSizeStyle.js +126 -126
  43. package/src/style/SideCatStyle.js +172 -172
  44. package/src/style/SideStyle.js +218 -218
  45. package/src/style/SquareColorCatWGLStyle.js +120 -120
  46. package/src/style/SquareColorWGLStyle.js +146 -146
  47. package/src/style/StrokeStyle.js +131 -131
  48. package/src/style/TanakaStyle.js +160 -160
  49. package/src/style/TextStyle.js +132 -132
  50. package/src/utils/Utils.js +35 -35
  51. package/src/utils/WebGLRectangleColoring.js +106 -106
  52. package/src/utils/WebGLSquareColoring.js +118 -118
  53. package/src/utils/WebGLSquareColoringAdvanced.js +230 -230
  54. package/src/utils/WebGLSquareColoringCatAdvanced.js +133 -133
  55. package/src/utils/WebGLSquareColoringKS.js +153 -153
  56. package/src/utils/stretching.js +131 -131
  57. package/src/utils/webGLUtils.js +71 -71
  58. package/src/utils/zoomUtils.js +142 -142
package/src/Legend.js CHANGED
@@ -1,86 +1,86 @@
1
- //@ts-check
2
- 'use strict'
3
-
4
- import { select } from 'd3-selection'
5
-
6
- /**
7
- * A legend container.
8
- *
9
- * @author Joseph Davies, Julien Gaffuri
10
- */
11
- export class Legend {
12
- /**
13
- * @param {Object} opts
14
- */
15
- constructor(opts) {
16
- opts = opts || {}
17
-
18
- /** @type {string} */
19
- this.id = opts.id
20
-
21
- //TODO stop using it. Use style method below instead.
22
-
23
- /** @type {number} @deprecated */
24
- this.top = opts.top
25
- /** @type {number} @deprecated */
26
- this.bottom = opts.bottom
27
- /** @type {number} @deprecated */
28
- this.left = opts.left
29
- /** @type {number} @deprecated */
30
- this.right = opts.right
31
- /** @type {string} @deprecated */
32
- this.background = opts.background || 'none'
33
- /** @type {string} @deprecated */
34
- this.padding = opts.padding || '5px'
35
- /** @type {string} @deprecated */
36
- this.border = opts.border || '0px'
37
- /** @type {string} @deprecated */
38
- this['border-radius'] = opts['border-radius'] || 'none'
39
- /** @type {string} @deprecated */
40
- this['box-shadow'] = opts['box-shadow'] || 'none'
41
- /** @type {string} @deprecated */
42
- this['font-family'] = opts['font-family'] || 'Helvetica, Arial, sans-serif'
43
- /** @type {string} @deprecated */
44
- this.width = opts.width
45
- /** @type {string} @deprecated */
46
- this.height = opts.height
47
-
48
- //the div element
49
- if (this.id) this.div = select('#' + this.id)
50
-
51
- if (!this.div || this.div.empty()) {
52
- this.div = select(document.createElement('div'))
53
- if (this.id) this.div.attr('id', this.id)
54
- }
55
-
56
- //set style
57
- this.div.style('background', this.background)
58
- this.div.style('padding', this.padding)
59
- this.div.style('border', this.border)
60
- this.div.style('border-radius', this['border-radius'])
61
- this.div.style('box-shadow', this['box-shadow'])
62
- this.div.style('font-family', this['font-family'])
63
-
64
- if (this.width) this.div.style('width', this.width)
65
- if (this.height) this.div.style('height', this.height)
66
- }
67
-
68
- /**
69
- * Apply a style to the legend div.
70
- * @param {string} k
71
- * @param {string} v
72
- * @returns {this}
73
- */
74
- style(k, v) {
75
- this.div.style(k, v)
76
- return this
77
- }
78
-
79
- /**
80
- * @param {Object} opts
81
- * @abstract
82
- */
83
- update(opts) {
84
- console.error('Legend update not implemented yet.')
85
- }
86
- }
1
+ //@ts-check
2
+ 'use strict'
3
+
4
+ import { select } from 'd3-selection'
5
+
6
+ /**
7
+ * A legend container.
8
+ *
9
+ * @author Joseph Davies, Julien Gaffuri
10
+ */
11
+ export class Legend {
12
+ /**
13
+ * @param {Object} opts
14
+ */
15
+ constructor(opts) {
16
+ opts = opts || {}
17
+
18
+ /** @type {string} */
19
+ this.id = opts.id
20
+
21
+ //TODO stop using it. Use style method below instead.
22
+
23
+ /** @type {number} @deprecated */
24
+ this.top = opts.top
25
+ /** @type {number} @deprecated */
26
+ this.bottom = opts.bottom
27
+ /** @type {number} @deprecated */
28
+ this.left = opts.left
29
+ /** @type {number} @deprecated */
30
+ this.right = opts.right
31
+ /** @type {string} @deprecated */
32
+ this.background = opts.background || 'none'
33
+ /** @type {string} @deprecated */
34
+ this.padding = opts.padding || '5px'
35
+ /** @type {string} @deprecated */
36
+ this.border = opts.border || '0px'
37
+ /** @type {string} @deprecated */
38
+ this['border-radius'] = opts['border-radius'] || 'none'
39
+ /** @type {string} @deprecated */
40
+ this['box-shadow'] = opts['box-shadow'] || 'none'
41
+ /** @type {string} @deprecated */
42
+ this['font-family'] = opts['font-family'] || 'Helvetica, Arial, sans-serif'
43
+ /** @type {string} @deprecated */
44
+ this.width = opts.width
45
+ /** @type {string} @deprecated */
46
+ this.height = opts.height
47
+
48
+ //the div element
49
+ if (this.id) this.div = select('#' + this.id)
50
+
51
+ if (!this.div || this.div.empty()) {
52
+ this.div = select(document.createElement('div'))
53
+ if (this.id) this.div.attr('id', this.id)
54
+ }
55
+
56
+ //set style
57
+ this.div.style('background', this.background)
58
+ this.div.style('padding', this.padding)
59
+ this.div.style('border', this.border)
60
+ this.div.style('border-radius', this['border-radius'])
61
+ this.div.style('box-shadow', this['box-shadow'])
62
+ this.div.style('font-family', this['font-family'])
63
+
64
+ if (this.width) this.div.style('width', this.width)
65
+ if (this.height) this.div.style('height', this.height)
66
+ }
67
+
68
+ /**
69
+ * Apply a style to the legend div.
70
+ * @param {string} k
71
+ * @param {string} v
72
+ * @returns {this}
73
+ */
74
+ style(k, v) {
75
+ this.div.style(k, v)
76
+ return this
77
+ }
78
+
79
+ /**
80
+ * @param {Object} opts
81
+ * @abstract
82
+ */
83
+ update(opts) {
84
+ console.error('Legend update not implemented yet.')
85
+ }
86
+ }
package/src/LineLayer.js CHANGED
@@ -1,150 +1,150 @@
1
- //@ts-check
2
- 'use strict'
3
-
4
- import { json } from 'd3-fetch'
5
-
6
- /**
7
- * @author Joseph Davies, Julien Gaffuri
8
- */
9
- export class LineLayer {
10
- /**
11
- * @param {object} opts
12
- */
13
- constructor(opts) {
14
- opts = opts || {}
15
-
16
- /**
17
- * @private
18
- * @type {string} */
19
- this.url = opts.url
20
-
21
- /**
22
- * A preprocess to run on each feature after loading.
23
- * It can be used to apply some specific treatment before, format the label data, project coordinates, etc.
24
- * Return false if the label should not be kept.
25
- * @private
26
- * @type {function(object):boolean} */
27
- this.preprocess = opts.preprocess
28
-
29
- /**
30
- * @private
31
- * @type {function(object,number):string} */
32
- this.color = opts.color || ((f, zf) => 'gray')
33
- /**
34
- * @private
35
- * @type {function(object,number):number} */
36
- this.width = opts.width || ((f, zf) => 2)
37
- /**
38
- * @private
39
- * @type {function(object,number):Array.<number>|undefined} */
40
- this.lineDash = opts.lineDash || ((f, zf) => undefined)
41
-
42
- /**
43
- * @private
44
- * @type {Array.<object> | undefined} */
45
- this.fs = undefined
46
-
47
- /**
48
- * @private
49
- * @type {string} */
50
- this.loadingStatus = 'notLoaded'
51
- }
52
-
53
- /**
54
- * Draw the layer.
55
- * @param {import("./GeoCanvas").GeoCanvas} cg The canvas where to draw the layer.
56
- * @returns {void}
57
- */
58
- draw(cg) {
59
- //load data, if not done yet.
60
- if (!this.fs) {
61
- this.load(cg.redraw)
62
- return
63
- }
64
-
65
- //TODO sort lines by width ?
66
-
67
- //zoom factor
68
- const zf = cg.getZf()
69
-
70
- //draw in geo coordinates
71
- cg.setCanvasTransform()
72
-
73
- for (const f of this.fs) {
74
- const cs = f.geometry.coordinates
75
- if (cs.length < 2) continue
76
-
77
- //set color
78
- const col = this.color(f, zf)
79
- if (!col || col == 'none') continue
80
- cg.ctx.strokeStyle = col
81
-
82
- //set linewidth
83
- const wP = this.width(f, zf)
84
- if (!wP || wP < 0) continue
85
- cg.ctx.lineWidth = wP * zf
86
-
87
- //set line dash
88
- const ldP = this.lineDash(f, zf)
89
- if (ldP) cg.ctx.setLineDash(ldP)
90
-
91
- //draw line
92
- cg.ctx.beginPath()
93
- cg.ctx.moveTo(cs[0][0], cs[0][1])
94
- for (let i = 1; i < cs.length; i++) cg.ctx.lineTo(cs[i][0], cs[i][1])
95
- cg.ctx.stroke()
96
- }
97
-
98
- //...
99
- cg.ctx.setLineDash([])
100
- }
101
-
102
- /**
103
- * Load data for labels, from URL this.url
104
- * @param {function():void} callback
105
- * @private
106
- */
107
- async load(callback) {
108
- if (!this.url) {
109
- console.log('Failed loading boundaries: No URL specified. ' + this.url)
110
- this.loadingStatus = 'failed'
111
- this.labels = []
112
- return
113
- }
114
-
115
- //check if data already loaded
116
- if (this.loadingStatus != 'notLoaded') return
117
-
118
- //load data
119
- this.loadingStatus = 'loading'
120
-
121
- try {
122
- const data_ = await json(this.url)
123
-
124
- /** @type { Array.<object> } */
125
- const data = data_.features
126
-
127
- //preprocess/filter
128
- if (this.preprocess) {
129
- this.fs = []
130
- for (const c of data) {
131
- const b = this.preprocess(c)
132
- if (b == false) continue
133
- this.fs.push(c)
134
- }
135
- } else {
136
- //store labels
137
- this.fs = data
138
- }
139
-
140
- this.loadingStatus = 'loaded'
141
-
142
- //redraw
143
- if (callback) callback()
144
- } catch (error) {
145
- console.log('Failed loading boundaries from ' + this.url)
146
- this.fs = []
147
- this.loadingStatus = 'failed'
148
- }
149
- }
150
- }
1
+ //@ts-check
2
+ 'use strict'
3
+
4
+ import { json } from 'd3-fetch'
5
+
6
+ /**
7
+ * @author Joseph Davies, Julien Gaffuri
8
+ */
9
+ export class LineLayer {
10
+ /**
11
+ * @param {object} opts
12
+ */
13
+ constructor(opts) {
14
+ opts = opts || {}
15
+
16
+ /**
17
+ * @private
18
+ * @type {string} */
19
+ this.url = opts.url
20
+
21
+ /**
22
+ * A preprocess to run on each feature after loading.
23
+ * It can be used to apply some specific treatment before, format the label data, project coordinates, etc.
24
+ * Return false if the label should not be kept.
25
+ * @private
26
+ * @type {function(object):boolean} */
27
+ this.preprocess = opts.preprocess
28
+
29
+ /**
30
+ * @private
31
+ * @type {function(object,number):string} */
32
+ this.color = opts.color || ((f, zf) => 'gray')
33
+ /**
34
+ * @private
35
+ * @type {function(object,number):number} */
36
+ this.width = opts.width || ((f, zf) => 2)
37
+ /**
38
+ * @private
39
+ * @type {function(object,number):Array.<number>|undefined} */
40
+ this.lineDash = opts.lineDash || ((f, zf) => undefined)
41
+
42
+ /**
43
+ * @private
44
+ * @type {Array.<object> | undefined} */
45
+ this.fs = undefined
46
+
47
+ /**
48
+ * @private
49
+ * @type {string} */
50
+ this.loadingStatus = 'notLoaded'
51
+ }
52
+
53
+ /**
54
+ * Draw the layer.
55
+ * @param {import("./GeoCanvas").GeoCanvas} cg The canvas where to draw the layer.
56
+ * @returns {void}
57
+ */
58
+ draw(cg) {
59
+ //load data, if not done yet.
60
+ if (!this.fs) {
61
+ this.load(cg.redraw)
62
+ return
63
+ }
64
+
65
+ //TODO sort lines by width ?
66
+
67
+ //zoom factor
68
+ const zf = cg.getZf()
69
+
70
+ //draw in geo coordinates
71
+ cg.setCanvasTransform()
72
+
73
+ for (const f of this.fs) {
74
+ const cs = f.geometry.coordinates
75
+ if (cs.length < 2) continue
76
+
77
+ //set color
78
+ const col = this.color(f, zf)
79
+ if (!col || col == 'none') continue
80
+ cg.ctx.strokeStyle = col
81
+
82
+ //set linewidth
83
+ const wP = this.width(f, zf)
84
+ if (!wP || wP < 0) continue
85
+ cg.ctx.lineWidth = wP * zf
86
+
87
+ //set line dash
88
+ const ldP = this.lineDash(f, zf)
89
+ if (ldP) cg.ctx.setLineDash(ldP)
90
+
91
+ //draw line
92
+ cg.ctx.beginPath()
93
+ cg.ctx.moveTo(cs[0][0], cs[0][1])
94
+ for (let i = 1; i < cs.length; i++) cg.ctx.lineTo(cs[i][0], cs[i][1])
95
+ cg.ctx.stroke()
96
+ }
97
+
98
+ //...
99
+ cg.ctx.setLineDash([])
100
+ }
101
+
102
+ /**
103
+ * Load data for labels, from URL this.url
104
+ * @param {function():void} callback
105
+ * @private
106
+ */
107
+ async load(callback) {
108
+ if (!this.url) {
109
+ console.log('Failed loading boundaries: No URL specified. ' + this.url)
110
+ this.loadingStatus = 'failed'
111
+ this.labels = []
112
+ return
113
+ }
114
+
115
+ //check if data already loaded
116
+ if (this.loadingStatus != 'notLoaded') return
117
+
118
+ //load data
119
+ this.loadingStatus = 'loading'
120
+
121
+ try {
122
+ const data_ = await json(this.url)
123
+
124
+ /** @type { Array.<object> } */
125
+ const data = data_.features
126
+
127
+ //preprocess/filter
128
+ if (this.preprocess) {
129
+ this.fs = []
130
+ for (const c of data) {
131
+ const b = this.preprocess(c)
132
+ if (b == false) continue
133
+ this.fs.push(c)
134
+ }
135
+ } else {
136
+ //store labels
137
+ this.fs = data
138
+ }
139
+
140
+ this.loadingStatus = 'loaded'
141
+
142
+ //redraw
143
+ if (callback) callback()
144
+ } catch (error) {
145
+ console.log('Failed loading boundaries from ' + this.url)
146
+ this.fs = []
147
+ this.loadingStatus = 'failed'
148
+ }
149
+ }
150
+ }