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
@@ -1,131 +1,131 @@
1
- //@ts-check
2
- 'use strict'
3
-
4
- /**
5
- * Some function [0,1]->[0,1] to stretch range of values.
6
- * @see https://github.com/eurostat/gridviz/blob/master/docs/reference.md#stretching
7
- * @see https://observablehq.com/@jgaffuri/stretching
8
- */
9
-
10
- /**
11
- * Function [0,1]->[0,1] to stretch range of values.
12
- * Polynomial
13
- *
14
- * @param {number} t The value to stretch, within [0,1]
15
- * @param {number} alpha 1: no stretching. <1: show low values. >1: show high values.
16
- * @returns {number} The stretched value, within [0,1]
17
- */
18
- export const sPow = (t, alpha = 3) => Math.pow(t, alpha)
19
-
20
- /**
21
- * Function [0,1]->[0,1] to stretch range of values.
22
- * Polynomial (reverse)
23
- *
24
- * @param {number} t The value to stretch, within [0,1]
25
- * @param {number} alpha 1: no stretching. <1: show low values. >1: show high values.
26
- * @returns {number} The stretched value, within [0,1]
27
- */
28
- export const sPowRev = (t, alpha = 3) => 1 - Math.pow(1 - t, 1 / alpha)
29
-
30
- /**
31
- * Function [0,1]->[0,1] to stretch range of values.
32
- * Exponential
33
- *
34
- * @param {number} t The value to stretch, within [0,1]
35
- * @param {number} alpha 0: no stretching. -Inf: show low values. Inf: show high values.
36
- * @returns {number} The stretched value, within [0,1]
37
- */
38
- export const sExp = (t, alpha = 3) => (alpha == 0 ? t : (Math.exp(t * alpha) - 1) / (Math.exp(alpha) - 1))
39
-
40
- /**
41
- * Function [0,1]->[0,1] to stretch range of values.
42
- * Exponential (reverse)
43
- *
44
- * @param {number} t The value to stretch, within [0,1]
45
- * @param {number} alpha 0: no stretching. -Inf: show low values. Inf: show high values.
46
- * @returns {number} The stretched value, within [0,1]
47
- */
48
- export const sExpRev = (t, alpha = 3) =>
49
- alpha == 0 ? t : 1 - (1 / alpha) * Math.log(Math.exp(alpha) * (1 - t) + t)
50
-
51
- /**
52
- * Function [0,1]->[0,1] to stretch range of values.
53
- * Circle, show low values
54
- * NB: sCircleHigh and sCircleLow are inverse functions of each other.
55
- *
56
- * @param {number} t The value to stretch, within [0,1]
57
- * @param {number} alpha 0: no stretching. 1: perfect circle section
58
- * @returns {number} The stretched value, within [0,1]
59
- */
60
- export const sCircleLow = (t, alpha = 0.8) => {
61
- if (alpha == 0) return t
62
- if (alpha == 1) return Math.sqrt(t * (2 - t))
63
- const a = alpha / (1 - alpha)
64
- return Math.sqrt(1 / (a * a) + t * (2 / a + 2 - t)) - 1 / a
65
- }
66
-
67
- /**
68
- * Function [0,1]->[0,1] to stretch range of values.
69
- * Circle, show high values
70
- * NB: sCircleHigh and sCircleLow are inverse functions of each other.
71
- *
72
- * @param {number} t The value to stretch, within [0,1]
73
- * @param {number} alpha 0: no stretching. 1: perfect circle section
74
- * @returns {number} The stretched value, within [0,1]
75
- */
76
- export const sCircleHigh = (t, alpha = 0.8) => 1 - sCircleLow(1 - t, alpha)
77
-
78
- /**
79
- * Inverse functions
80
- */
81
-
82
- /**
83
- * Inverse function of sExp
84
- * @param {number} y
85
- * @param {number} alpha
86
- * @returns {number}
87
- */
88
- export const sExpInverse = (y, alpha = 3) =>
89
- alpha == 0 ? y : (1 / alpha) * Math.log(1 - y + y * Math.exp(alpha))
90
-
91
- /**
92
- * Inverse function of sExpRev
93
- * @param {number} y
94
- * @param {number} alpha
95
- * @returns {number}
96
- */
97
- export const sExpRevInverse = (y, alpha = 3) => (Math.exp(-alpha * y) - 1) / (Math.exp(-alpha) - 1)
98
-
99
- /**
100
- * Inverse function of sPow
101
- * @param {number} y
102
- * @param {number} alpha
103
- * @returns {number}
104
- */
105
-
106
- export const sPowInverse = (y, alpha = 3) => Math.pow(y, 1 / alpha)
107
-
108
- /**
109
- * Inverse function of sPowRev
110
- * @param {number} y
111
- * @param {number} alpha
112
- * @returns {number}
113
- */
114
- export const sPowRevInverse = (y, alpha = 3) => 1 - Math.pow(1 - y, alpha)
115
-
116
- //test code
117
- /*
118
- for (let i = 0; i <= 1; i += 0.001) {
119
- //const v = gviz.sExp(gviz.sExpInverse(i));
120
- //const v = gviz.sExpInverse(gviz.sExp(i));
121
- //const v = gviz.sExpRev(gviz.sExpRevInverse(i));
122
- //const v = gviz.sExpRevInverse(gviz.sExpRev(i));
123
- //const v = gviz.sPow(gviz.sPowInverse(i));
124
- //const v = gviz.sPowInverse(gviz.sPow(i));
125
- //const v = gviz.sPowRev(gviz.sPowRevInverse(i));
126
- //const v = gviz.sPowRevInverse(gviz.sPowRev(i));
127
- //const v = gviz.sCircleLow(gviz.sCircleHigh(i));
128
- //const v = gviz.sCircleHigh(gviz.sCircleLow(i));
129
- console.log(i - v)
130
- }
131
- */
1
+ //@ts-check
2
+ 'use strict'
3
+
4
+ /**
5
+ * Some function [0,1]->[0,1] to stretch range of values.
6
+ * @see https://github.com/eurostat/gridviz/blob/master/docs/reference.md#stretching
7
+ * @see https://observablehq.com/@jgaffuri/stretching
8
+ */
9
+
10
+ /**
11
+ * Function [0,1]->[0,1] to stretch range of values.
12
+ * Polynomial
13
+ *
14
+ * @param {number} t The value to stretch, within [0,1]
15
+ * @param {number} alpha 1: no stretching. <1: show low values. >1: show high values.
16
+ * @returns {number} The stretched value, within [0,1]
17
+ */
18
+ export const sPow = (t, alpha = 3) => Math.pow(t, alpha)
19
+
20
+ /**
21
+ * Function [0,1]->[0,1] to stretch range of values.
22
+ * Polynomial (reverse)
23
+ *
24
+ * @param {number} t The value to stretch, within [0,1]
25
+ * @param {number} alpha 1: no stretching. <1: show low values. >1: show high values.
26
+ * @returns {number} The stretched value, within [0,1]
27
+ */
28
+ export const sPowRev = (t, alpha = 3) => 1 - Math.pow(1 - t, 1 / alpha)
29
+
30
+ /**
31
+ * Function [0,1]->[0,1] to stretch range of values.
32
+ * Exponential
33
+ *
34
+ * @param {number} t The value to stretch, within [0,1]
35
+ * @param {number} alpha 0: no stretching. -Inf: show low values. Inf: show high values.
36
+ * @returns {number} The stretched value, within [0,1]
37
+ */
38
+ export const sExp = (t, alpha = 3) => (alpha == 0 ? t : (Math.exp(t * alpha) - 1) / (Math.exp(alpha) - 1))
39
+
40
+ /**
41
+ * Function [0,1]->[0,1] to stretch range of values.
42
+ * Exponential (reverse)
43
+ *
44
+ * @param {number} t The value to stretch, within [0,1]
45
+ * @param {number} alpha 0: no stretching. -Inf: show low values. Inf: show high values.
46
+ * @returns {number} The stretched value, within [0,1]
47
+ */
48
+ export const sExpRev = (t, alpha = 3) =>
49
+ alpha == 0 ? t : 1 - (1 / alpha) * Math.log(Math.exp(alpha) * (1 - t) + t)
50
+
51
+ /**
52
+ * Function [0,1]->[0,1] to stretch range of values.
53
+ * Circle, show low values
54
+ * NB: sCircleHigh and sCircleLow are inverse functions of each other.
55
+ *
56
+ * @param {number} t The value to stretch, within [0,1]
57
+ * @param {number} alpha 0: no stretching. 1: perfect circle section
58
+ * @returns {number} The stretched value, within [0,1]
59
+ */
60
+ export const sCircleLow = (t, alpha = 0.8) => {
61
+ if (alpha == 0) return t
62
+ if (alpha == 1) return Math.sqrt(t * (2 - t))
63
+ const a = alpha / (1 - alpha)
64
+ return Math.sqrt(1 / (a * a) + t * (2 / a + 2 - t)) - 1 / a
65
+ }
66
+
67
+ /**
68
+ * Function [0,1]->[0,1] to stretch range of values.
69
+ * Circle, show high values
70
+ * NB: sCircleHigh and sCircleLow are inverse functions of each other.
71
+ *
72
+ * @param {number} t The value to stretch, within [0,1]
73
+ * @param {number} alpha 0: no stretching. 1: perfect circle section
74
+ * @returns {number} The stretched value, within [0,1]
75
+ */
76
+ export const sCircleHigh = (t, alpha = 0.8) => 1 - sCircleLow(1 - t, alpha)
77
+
78
+ /**
79
+ * Inverse functions
80
+ */
81
+
82
+ /**
83
+ * Inverse function of sExp
84
+ * @param {number} y
85
+ * @param {number} alpha
86
+ * @returns {number}
87
+ */
88
+ export const sExpInverse = (y, alpha = 3) =>
89
+ alpha == 0 ? y : (1 / alpha) * Math.log(1 - y + y * Math.exp(alpha))
90
+
91
+ /**
92
+ * Inverse function of sExpRev
93
+ * @param {number} y
94
+ * @param {number} alpha
95
+ * @returns {number}
96
+ */
97
+ export const sExpRevInverse = (y, alpha = 3) => (Math.exp(-alpha * y) - 1) / (Math.exp(-alpha) - 1)
98
+
99
+ /**
100
+ * Inverse function of sPow
101
+ * @param {number} y
102
+ * @param {number} alpha
103
+ * @returns {number}
104
+ */
105
+
106
+ export const sPowInverse = (y, alpha = 3) => Math.pow(y, 1 / alpha)
107
+
108
+ /**
109
+ * Inverse function of sPowRev
110
+ * @param {number} y
111
+ * @param {number} alpha
112
+ * @returns {number}
113
+ */
114
+ export const sPowRevInverse = (y, alpha = 3) => 1 - Math.pow(1 - y, alpha)
115
+
116
+ //test code
117
+ /*
118
+ for (let i = 0; i <= 1; i += 0.001) {
119
+ //const v = gviz.sExp(gviz.sExpInverse(i));
120
+ //const v = gviz.sExpInverse(gviz.sExp(i));
121
+ //const v = gviz.sExpRev(gviz.sExpRevInverse(i));
122
+ //const v = gviz.sExpRevInverse(gviz.sExpRev(i));
123
+ //const v = gviz.sPow(gviz.sPowInverse(i));
124
+ //const v = gviz.sPowInverse(gviz.sPow(i));
125
+ //const v = gviz.sPowRev(gviz.sPowRevInverse(i));
126
+ //const v = gviz.sPowRevInverse(gviz.sPowRev(i));
127
+ //const v = gviz.sCircleLow(gviz.sCircleHigh(i));
128
+ //const v = gviz.sCircleHigh(gviz.sCircleLow(i));
129
+ console.log(i - v)
130
+ }
131
+ */
@@ -1,71 +1,71 @@
1
- //@ts-check
2
- 'use strict'
3
-
4
- /**
5
- * @param {string} width
6
- * @param {string} height
7
- * @param {object} opts
8
- * @returns {{canvas:HTMLCanvasElement, gl:WebGLRenderingContext}}
9
- */
10
- export function makeWebGLCanvas(width, height, opts) {
11
- const canvas = document.createElement('canvas')
12
- canvas.setAttribute('width', width)
13
- canvas.setAttribute('height', height)
14
- const gl = canvas.getContext('webgl', opts)
15
- if (!gl) {
16
- throw new Error('Unable to initialize WebGL. Your browser or machine may not support it.')
17
- }
18
- return { canvas: canvas, gl: gl }
19
- }
20
-
21
- /**
22
- * Initialize a shader program, so WebGL knows how to draw our data
23
- *
24
- * @param {WebGLRenderingContext} gl
25
- * @param {...WebGLShader} shaders
26
- * @returns {WebGLProgram}
27
- */
28
- export function initShaderProgram(gl, ...shaders) {
29
- /** @type {WebGLProgram|null} */
30
- const program = gl.createProgram()
31
- if (program == null) throw new Error('Cannot create webGL program')
32
- for (const shader of shaders) gl.attachShader(program, shader)
33
- gl.linkProgram(program)
34
- if (gl.getProgramParameter(program, gl.LINK_STATUS)) return program
35
- throw new Error(gl.getProgramInfoLog(program) || 'Cannot create webGL program (2)')
36
- }
37
-
38
- /**
39
- * Creates a shader of the given type, uploads the source and compiles it.
40
- *
41
- * @param {WebGLRenderingContext} gl
42
- * @param {number} type
43
- * @param {...string} sources
44
- * @returns {WebGLShader}
45
- */
46
- export function createShader(gl, type, ...sources) {
47
- /** @type {WebGLShader|null} */
48
- const shader = gl.createShader(type)
49
- if (shader == null) throw new Error('Cannot create webGL shader')
50
- gl.shaderSource(shader, sources.join('\n'))
51
- gl.compileShader(shader)
52
- if (gl.getShaderParameter(shader, gl.COMPILE_STATUS)) return shader
53
- throw new Error(gl.getShaderInfoLog(shader) || 'Cannot create webGL shader (2)')
54
- }
55
-
56
- /**
57
- * Check if webGL is supported
58
- *
59
- * @returns {boolean}
60
- */
61
- export function checkWebGLSupport() {
62
- try {
63
- const canvas = document.createElement('canvas')
64
- return !!window.WebGLRenderingContext &&
65
- (canvas.getContext('webgl') || canvas.getContext('experimental-webgl'))
66
- ? true
67
- : false
68
- } catch (err) {
69
- return false
70
- }
71
- }
1
+ //@ts-check
2
+ 'use strict'
3
+
4
+ /**
5
+ * @param {string} width
6
+ * @param {string} height
7
+ * @param {object} opts
8
+ * @returns {{canvas:HTMLCanvasElement, gl:WebGLRenderingContext}}
9
+ */
10
+ export function makeWebGLCanvas(width, height, opts) {
11
+ const canvas = document.createElement('canvas')
12
+ canvas.setAttribute('width', width)
13
+ canvas.setAttribute('height', height)
14
+ const gl = canvas.getContext('webgl', opts)
15
+ if (!gl) {
16
+ throw new Error('Unable to initialize WebGL. Your browser or machine may not support it.')
17
+ }
18
+ return { canvas: canvas, gl: gl }
19
+ }
20
+
21
+ /**
22
+ * Initialize a shader program, so WebGL knows how to draw our data
23
+ *
24
+ * @param {WebGLRenderingContext} gl
25
+ * @param {...WebGLShader} shaders
26
+ * @returns {WebGLProgram}
27
+ */
28
+ export function initShaderProgram(gl, ...shaders) {
29
+ /** @type {WebGLProgram|null} */
30
+ const program = gl.createProgram()
31
+ if (program == null) throw new Error('Cannot create webGL program')
32
+ for (const shader of shaders) gl.attachShader(program, shader)
33
+ gl.linkProgram(program)
34
+ if (gl.getProgramParameter(program, gl.LINK_STATUS)) return program
35
+ throw new Error(gl.getProgramInfoLog(program) || 'Cannot create webGL program (2)')
36
+ }
37
+
38
+ /**
39
+ * Creates a shader of the given type, uploads the source and compiles it.
40
+ *
41
+ * @param {WebGLRenderingContext} gl
42
+ * @param {number} type
43
+ * @param {...string} sources
44
+ * @returns {WebGLShader}
45
+ */
46
+ export function createShader(gl, type, ...sources) {
47
+ /** @type {WebGLShader|null} */
48
+ const shader = gl.createShader(type)
49
+ if (shader == null) throw new Error('Cannot create webGL shader')
50
+ gl.shaderSource(shader, sources.join('\n'))
51
+ gl.compileShader(shader)
52
+ if (gl.getShaderParameter(shader, gl.COMPILE_STATUS)) return shader
53
+ throw new Error(gl.getShaderInfoLog(shader) || 'Cannot create webGL shader (2)')
54
+ }
55
+
56
+ /**
57
+ * Check if webGL is supported
58
+ *
59
+ * @returns {boolean}
60
+ */
61
+ export function checkWebGLSupport() {
62
+ try {
63
+ const canvas = document.createElement('canvas')
64
+ return !!window.WebGLRenderingContext &&
65
+ (canvas.getContext('webgl') || canvas.getContext('experimental-webgl'))
66
+ ? true
67
+ : false
68
+ } catch (err) {
69
+ return false
70
+ }
71
+ }