@pirireis/webglobeplugins 0.6.11 → 0.6.14

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.
@@ -1,257 +0,0 @@
1
- import { getColorRampModed, DataManager, PointCoordinatesDataCalculator } from "../../util";
2
-
3
- import { GlobeShellWiggle, Float2LegendWithRatio } from "../../programs";
4
-
5
-
6
- /**
7
- * @param id : string
8
- * @param dataManager : DataManager
9
- * @param colorRampData : {values: string[], thresholds: number[], mode: string}
10
- * @param dataWidthHeight : {width: number, height: number}
11
- * @param options : {bbox: number[], minMaxEdges: {min: number, max: number}, escapeValue: number, resolution: number[], meshPartition: number[]}
12
- */
13
- export default class Plugin {
14
- constructor(id, dataManager, colorRampData, dataWidthHeight,
15
- {
16
- bbox = [-180, -90, 180, 90],
17
- minMaxEdges = { min: -99999, max: 99999 },
18
- escapeValue = 99999,
19
- resolution = [2056, 2056],
20
- } = {}) {
21
- this.id = id;
22
- this.dataManager = dataManager;
23
- this._dataWidthHeight = dataWidthHeight;
24
-
25
- this._isOn = true;
26
- this._bbox = bbox
27
- this._minMaxEdges = minMaxEdges;
28
- this._escapeValue = escapeValue
29
- this._resolution = resolution;
30
-
31
- this._colorRampData = colorRampData; // holds until init
32
-
33
- this._lastTexture0data = null;
34
- this._lastTexture1data = null;
35
-
36
- // output of heatProgram is written to ._coloredHeatTexture
37
- this._frameBuffer = null
38
- this._coloredHeatTexture = null;
39
-
40
- this.isAble = false;
41
- }
42
-
43
-
44
- setHeight(height) {
45
- this.globeShell.setHeight(height);
46
- }
47
-
48
-
49
- drawHeat() {
50
- const gl = this.gl;
51
- gl.bindFramebuffer(gl.FRAMEBUFFER, this._frameBuffer);
52
- gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this._coloredHeatTexture, 0);
53
- const currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
54
- const currentWidth = gl.canvas.width;
55
- const currentHeight = gl.canvas.height;
56
- gl.viewport(0, 0, ...this._resolution);
57
- this.heatProgram.draw()
58
- gl.viewport(0, 0, currentWidth, currentHeight);
59
- gl.bindFramebuffer(gl.FRAMEBUFFER, null);
60
- gl.useProgram(currentProgram);
61
- this.globe.DrawRender();
62
- }
63
-
64
-
65
- setEscapeValue(escapeValue) {
66
- this._escapeValue = escapeValue;
67
- this.heatProgram.setEscapeValue(escapeValue);
68
- }
69
-
70
-
71
- _createPointCoordinatesDataCalculator() {
72
- this.coordinatesDataCalculator = new PointCoordinatesDataCalculator(this._bbox, this._dataWidthHeight.width, this._dataWidthHeight.height);
73
- this.dataManager.register(this._coordinatesDataCalculatorID(), this.coordinatesDataCalculator.updateData.bind(this.coordinatesDataCalculator));
74
- }
75
-
76
-
77
- _coordinatesDataCalculatorID() {
78
- return this.id + "_coordinatesDataCalculator";
79
- }
80
-
81
-
82
- updateTime(time) {
83
- this.dataManager.updateTime(time);
84
- this.globe.DrawRender();
85
- }
86
-
87
- setWiggle({ wiggleInKm = null, wiggleSpeed = null } = {}) {
88
- this.globeShell.setWiggle({ wiggleInKm, wiggleSpeed });
89
- }
90
-
91
-
92
- setMinMaxEdges(min = null, max = null) {
93
- if (min) this._minMaxEdges.min = min;
94
- if (max) this._minMaxEdges.max = max;
95
- this.heatProgram.setMinMaxEdges(this._minMaxEdges.min, this._minMaxEdges.max);
96
- this.drawHeat();
97
- }
98
-
99
-
100
- setBBox(minLon, minLat, maxLon, maxLat) {
101
- this._bbox = [minLon, minLat, maxLon, maxLat];
102
- this.globeShell.setBBox({ minLon, minLat, maxLon, maxLat });
103
- this.drawHeat();
104
- }
105
-
106
-
107
- getPointCoordinatesDataCalculator() {
108
- if (!this.coordinatesDataCalculator) this._createPointCoordinatesDataCalculator();
109
- return this.coordinatesDataCalculator;
110
- }
111
-
112
-
113
- /**
114
- * @param {*} values n + 1 number of color hex values without alpha channel. Ex: ["#ff0000", "#00ff00", "#0000ff"]
115
- * @param {*} thresholds n number of thresholds. Ex: [0, 10, 20]
116
- * @param {*} mode "discrete" or "interpolated"
117
- *
118
- * There are maximum 256 pixels in the color ramp.
119
- * The first values array is minimum edge value which is the first pixel, the second comes one pixel after the first.
120
- */
121
- setColorRamp(values, thresholds, mode = "interpolated") {
122
- const lowest = thresholds[0];
123
- const highest = thresholds[thresholds.length - 1];
124
- const range = highest - lowest;
125
- const clampedThresholds = thresholds.map((t) => (t - lowest) / range);
126
- const colors = getColorRampModed(values, clampedThresholds, mode);
127
- this.heatProgram.setColorRampTextureData(colors, 256);
128
- this.heatProgram.setColorRampRange(lowest, highest);
129
- this.drawHeat();
130
- }
131
-
132
-
133
- off() {
134
- this._isOn = false;
135
- }
136
-
137
-
138
- on() {
139
- this._isOn = true;
140
- }
141
-
142
-
143
-
144
-
145
- _updateData(ratio, textureData0 = null, textureData1 = null) {
146
- if (!textureData0 || !textureData1) {
147
- this.isAble = false;
148
- return;
149
- };
150
- this.heatProgram.setBlendRatio(ratio);
151
- if (this._lastTexture0data !== textureData0 || this._lastTexture1data !== textureData1) {
152
- this.isAble = true;
153
- this._lastTexture0data = textureData0;
154
- this._lastTexture1data = textureData1;
155
- this.heatProgram.setFloatTextureData(textureData0, textureData1, this._dataWidthHeight.width, this._dataWidthHeight.height);
156
- }
157
- this.drawHeat();
158
- }
159
-
160
-
161
- setDataWidthHeight(width, height) {
162
- this._dataWidthHeight = { width, height };
163
- this.heatProgram.setDataWidthHeight(width, height);
164
- this.setGeometry();
165
- }
166
-
167
-
168
- draw3D() {
169
- if (!this._isOn) return;
170
- if (!this.isAble) return;
171
- this.gl.disable(this.gl.DEPTH_TEST);
172
- this.globeShell.draw();
173
- this.gl.enable(this.gl.DEPTH_TEST);
174
- }
175
-
176
-
177
- setOpacity(opacity) {
178
- this.globeShell.setOpacity(opacity);
179
- }
180
-
181
-
182
- _setAfterInit() {
183
- {
184
- const [minLon, minLat, maxLon, maxLat] = this._bbox;
185
- this.globeShell.setBBox({ minLon, minLat, maxLon, maxLat });
186
- }
187
- {
188
- this.setColorRamp(this._colorRampData.values, this._colorRampData.thresholds, this._colorRampData.mode);
189
- delete this._colorRampData;
190
- }
191
- this.setMinMaxEdges(this._minMaxEdges.min, this._minMaxEdges.max);
192
- this.setEscapeValue(this._escapeValue);
193
- }
194
-
195
-
196
- _init(globe, gl) {
197
- this.globeShell = new GlobeShellWiggle(gl, globe, {
198
- minLon: this._bbox[0],
199
- minLat: this._bbox[1],
200
- maxLon: this._bbox[2],
201
- maxLat: this._bbox[3],
202
- color: [1.0, 0.1, 0.4, 0.2],
203
- height: 0,
204
- wiggleInKM: 2,
205
- eastWestTied: false,
206
- displayMesh: false
207
- });
208
- this.heatProgram = new Float2LegendWithRatio(gl);
209
- this._frameBuffer = gl.createFramebuffer();
210
-
211
- this.dataManager.register(this.id, (ratio, t1, t2) => this._updateData(ratio, t1, t2));
212
- this.setResolution(this._resolution[0], this._resolution[1]);
213
- }
214
-
215
-
216
-
217
- init(globe, gl) {
218
- this.globe = globe;
219
- this.gl = gl;
220
- this._init(globe, gl);
221
- this._setAfterInit();
222
- }
223
-
224
- setGeometry() {
225
- // globeShell has an implicit program, registered and sets its own geometry.
226
- return;
227
- }
228
-
229
-
230
- // sets Density of middle texture which is used with framebuffers
231
- setResolution(width, height) {
232
- const gl = this.gl;
233
- this._resolution = [width, height];
234
- this._coloredHeatTexture = gl.createTexture();
235
- gl.bindTexture(gl.TEXTURE_2D, this._coloredHeatTexture);
236
- gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
237
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
238
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
239
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
240
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
241
- gl.bindTexture(gl.TEXTURE_2D, null);
242
- this.globeShell.setTexture(this._coloredHeatTexture);
243
- }
244
-
245
-
246
- free() {
247
- if (this.coordinatesDataCalculator) {
248
- this.dataManager.unregister(this._coordinatesDataCalculatorID());
249
- this.coordinatesDataCalculator = null;
250
- }
251
- this.dataManager.unregister(this.id);
252
- this.globeShell.free();
253
- this.heatProgram.free();
254
- }
255
-
256
-
257
- }