@pirireis/webglobeplugins 0.6.31-a → 0.6.34

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.
@@ -18,32 +18,12 @@ const constraintFloat = (x, lowerBound, upperBound) => {
18
18
  if (lowerBound > x || x > upperBound) throw new Error(`input must be between ${lowerBound} - ${upperBound}`)
19
19
  }
20
20
 
21
- /**
22
- * partial ring angle should be different on globe and mercator.
23
- *
24
- */
25
21
 
26
-
27
- /**
28
- * @typedef {Object}textContextInjection
29
- * @property {string} id
30
- * @property {function} coordsAdaptor
31
- * @property {function} textAdaptor
32
- * @property {ContextTextWriter3} writer
33
- *
34
- */
35
-
36
- // TODO UPDATE TO ContextTextWriter3
37
-
38
-
39
- export default class Plugin {
22
+ export default class BearingLinePlugin {
40
23
  /**
41
- *
42
24
  * @param {*} id
43
25
  * @param {Map<[key, ContextTextWriter3]>} textWritersMap
44
- *
45
26
  */
46
-
47
27
  constructor(id,
48
28
  {
49
29
  opacity = 1,
@@ -64,27 +44,27 @@ export default class Plugin {
64
44
  this.drawVRM = drawVRM;
65
45
  this.drawBearingLine = drawBearingLine;
66
46
  this.drawAngleRing = drawAngleRing;
67
-
68
47
  this._textDataPreAdaptor = textDataPreAdaptor;
69
- this._memoryForText = new Map();
70
-
71
48
  this.drawText = drawText;
72
-
73
- this.circleFlatEdgeCount = circleFlatEdgeCount + 2; //circleFlatEdgeCount;
49
+ this._memoryForText = new Map();
50
+ this.circleFlatEdgeCount = circleFlatEdgeCount + 2;
74
51
  }
75
52
 
53
+
76
54
  setDoDrawVRM(bool) {
77
55
  if (bool === this.drawVRM) return;
78
56
  this.drawVRM = bool;
79
57
  this.globe.DrawRender();
80
58
  }
81
59
 
60
+
82
61
  setDoDrawText(bool) {
83
62
  if (bool === this.drawText) return;
84
63
  this.drawText = bool;
85
64
  this.globe.DrawRender();
86
65
  }
87
66
 
67
+
88
68
  setDoDrawText(bool) {
89
69
  if (bool === this.drawText) return;
90
70
  this.drawText = bool;
@@ -92,7 +72,6 @@ export default class Plugin {
92
72
  }
93
73
 
94
74
 
95
-
96
75
  setDoDrawAngleRing(bool) {
97
76
  if (bool === this.drawAngleRing) return;
98
77
  this.drawAngleRing = bool;
@@ -108,179 +87,6 @@ export default class Plugin {
108
87
  }
109
88
 
110
89
 
111
- init(globe, gl) {
112
- this.gl = gl;
113
- this.globe = globe;
114
- this.lineProgram = LineOnGlobeCache.get(globe);
115
- this.ringProgram = pieceOfPieProgramCache.get(globe);
116
- this.circleProgram = CircleCache.get(globe);
117
- this.circle3DProgram = Circle3DCache.get(globe);
118
- const circleFlatEdgeCount = this.circleFlatEdgeCount
119
- {
120
- // createBuffers
121
- const bufferType = "DYNAMIC_DRAW";
122
- const initialCapacity = this.bufferOrchestrator.capacity;
123
- this.bufferManagersCompMap = new Map(
124
- [
125
-
126
- ["centerCoords2d", {
127
- 'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
128
- 'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.long, item.lat)),
129
- }],
130
- ["centerCoords2dflat", {
131
- 'bufferManager': new BufferManager(gl, circleFlatEdgeCount * 2, { bufferType, initialCapacity }),
132
- 'adaptor': (item) => item.centerCoords2dflat,
133
- }],
134
- ["centerCoords3d", {
135
- 'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
136
- 'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.long, item.lat, 0, 0)),
137
- }],
138
- ["targetCoords2d", {
139
- 'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
140
- 'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.endLong, item.endLat))
141
- }],
142
- ["targetCoords3d", {
143
- 'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
144
- 'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.endLong, item.endLat, 0, 0))
145
- }],
146
- ["bearingTargetCoords2d", {
147
- 'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
148
- 'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.bearingLong, item.bearingLat))
149
- }],
150
- ["bearingTargetCoords3d", {
151
- 'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
152
- 'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.bearingLong, item.bearingLat, 0, 0))
153
- }],
154
-
155
- ["startAngle2d", {
156
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
157
- 'adaptor': (item) => new Float32Array([item.startAngle2d])
158
- }],
159
- ["tailAngle2d", {
160
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
161
- 'adaptor': (item) => new Float32Array([item.tailAngle2d])
162
- }],
163
- ["startAngle3d", {
164
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
165
- 'adaptor': (item) => new Float32Array([item.startAngle3d])
166
- }],
167
- ["tailAngle3d", {
168
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
169
- 'adaptor': (item) => new Float32Array([item.tailAngle3d])
170
- }],
171
- ["bearingDashRatio", {
172
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
173
- 'adaptor': (item) => new Float32Array([0])
174
- }],
175
- ["rgba", {
176
- 'bufferManager': new BufferManager(gl, 4, { bufferType, initialCapacity }),
177
- 'adaptor': (item) => new Float32Array(item.rgba)
178
- }],
179
- ["radius", {
180
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
181
- 'adaptor': (item) => new Float32Array([item.radius])
182
- }],
183
- ["rgbaMode", {
184
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
185
- 'adaptor': (item) => new Float32Array([item.rgbaMode])
186
- }],
187
- ["dashRatio", {
188
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
189
- 'adaptor': (item) => new Float32Array([item.dashRatio])
190
- }],
191
-
192
- ["bigRadius", {
193
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
194
- 'adaptor': (item) => new Float32Array([item.bigRadius])
195
- }],
196
- ["dashOpacity", {
197
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
198
- 'adaptor': (item) => new Float32Array([item.dashOpacity]),
199
- }],
200
-
201
- // normal circle
202
- ["circleDashAngle", {
203
- 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
204
- 'adaptor': (item) => new Float32Array([item.circleDashAngle / 360]),
205
- }],
206
- // CIRCLE Mercator
207
- ["rgbaMercator", {
208
- 'bufferManager': new BufferManager(gl, 4 * circleFlatEdgeCount, { bufferType, initialCapacity }),
209
- 'adaptor': (item) => populateFloat32Array.fillWithListData(circleFlatEdgeCount, item.rgba),
210
- }],
211
- ["circleDashAngleMercator", {
212
- 'bufferManager': new BufferManager(gl, circleFlatEdgeCount, { bufferType, initialCapacity }),
213
- 'adaptor': (item) => populateFloat32Array.fillFloat32Array(circleFlatEdgeCount, item.circleDashAngle / 360),
214
- }],
215
- ["dashOpacityMercator", {
216
- 'bufferManager': new BufferManager(gl, circleFlatEdgeCount, { bufferType, initialCapacity }),
217
- 'adaptor': (item) => populateFloat32Array.fillFloat32Array(circleFlatEdgeCount, item.dashOpacity),
218
- }],
219
-
220
- ]
221
- );
222
- }
223
-
224
-
225
- const obj = function (bufferManagerComp, divisor = 1) {
226
- return { 'buffer': bufferManagerComp.bufferManager.buffer, 'stride': 0, 'offset': 0, divisor }
227
-
228
- };
229
-
230
- this.lineVao = this.lineProgram.createVAO(
231
- ...['centerCoords2d', 'centerCoords3d', 'targetCoords2d', 'targetCoords3d', 'dashRatio', 'dashOpacity', 'rgba'].map(key => obj(this.bufferManagersCompMap.get(key))));
232
- this.ringVao = this.ringProgram.createVAO(
233
- ...['centerCoords2d', 'centerCoords3d',
234
- 'startAngle2d',
235
- 'tailAngle2d',
236
- 'startAngle3d',
237
- 'tailAngle3d',
238
- 'rgba',
239
- 'radius',
240
- 'rgbaMode'].map(key => obj(this.bufferManagersCompMap.get(key))));
241
- {
242
- this.bearingLineVAO = this.lineProgram.createVAO(
243
- ...['centerCoords2d', 'centerCoords3d', 'bearingTargetCoords2d', 'bearingTargetCoords3d', 'bearingDashRatio', 'dashOpacity', 'rgba'].map(key => obj(this.bufferManagersCompMap.get(key))));
244
- }
245
- // centerObj, startAngleObj, radiusObj, colorObj, dashRatioObj, dashOpacityObj
246
- this.circleVao = this.circleProgram.createVAO(
247
- ...["centerCoords2dflat", "rgbaMercator", "circleDashAngleMercator", "dashOpacityMercator"].map(key => obj(this.bufferManagersCompMap.get(key)))
248
- );
249
- this.circle3DVao = this.circle3DProgram.createVAO(
250
- ...["centerCoords3d", "bigRadius", "rgba", "circleDashAngle", "dashOpacity"].map(key => obj(this.bufferManagersCompMap.get(key)))
251
- );
252
-
253
-
254
- }
255
-
256
-
257
-
258
- draw3D() {
259
- const { gl } = this;
260
- gl.disable(gl.DEPTH_TEST);
261
- const is3D = this.globe.api_GetCurrentGeometry() === 0;
262
- this.lineProgram.draw(this.lineVao, this.bufferOrchestrator.length, this._opacity);
263
- if (this.drawAngleRing) {
264
- this.ringProgram.draw(this.bufferOrchestrator.length, this.ringVao, 360, this._opacity * 0.8, RINGPARTIAL_DRAW_MODE.TRIANGLE_FAN);
265
- this.ringProgram.draw(this.bufferOrchestrator.length, this.ringVao, 360, this._opacity, RINGPARTIAL_DRAW_MODE.LINE_STRIP);
266
- }
267
- if (this.drawBearingLine) {
268
- this.lineProgram.draw(this.bearingLineVAO, this.bufferOrchestrator.length, this._opacity * 0.8);
269
- }
270
- if (this.drawVRM) {
271
- if (is3D) {
272
- this.circle3DProgram.draw(this.circle3DVao, this.bufferOrchestrator.length, this._opacity);
273
- } else {
274
- this.circleProgram.draw(this.circleVao, this.bufferOrchestrator.length, this.circleFlatEdgeCount, this._opacity);
275
- }
276
- }
277
- if (this.drawText) {
278
- this._textWritersMap.forEach((writer) => writer.draw());
279
- }
280
- gl.enable(gl.DEPTH_TEST);
281
- }
282
-
283
-
284
90
  /**
285
91
  * @typedef {{key, long, lat, endLong, endLat, bearingAngle, radius, rgba:[4numbers], rgbaMode, bigRadius, dashRatio, dashOpacity, circleDashAngle}} item
286
92
  * @property {string} key
@@ -320,6 +126,7 @@ export default class Plugin {
320
126
  this.globe.DrawRender();
321
127
  }
322
128
 
129
+
323
130
  deleteBulk(keys) {
324
131
  this.bufferOrchestrator.deleteBulk(keys, this.bufferManagersCompMap);
325
132
  for (const key of keys) {
@@ -330,7 +137,7 @@ export default class Plugin {
330
137
  }
331
138
 
332
139
 
333
- defrag() {
140
+ defrag() {// use with caution
334
141
  this.bufferOrchestrator.defrag(this.bufferManagersCompMap);
335
142
  }
336
143
 
@@ -371,6 +178,7 @@ export default class Plugin {
371
178
  this.globe.DrawRender();
372
179
  }
373
180
 
181
+ // Private methods
374
182
 
375
183
  _checkTextContextWriterInjectionMap(textContextWriterInjectionMap) {
376
184
  if (!(textContextWriterInjectionMap instanceof Map)) throw new Error("textContextWriterInjectionMap is not an instance of Map");
@@ -391,6 +199,7 @@ export default class Plugin {
391
199
  }
392
200
  }
393
201
 
202
+
394
203
  __insertAdaptor(item) {
395
204
  const rgba = item.rgba !== undefined ? item.rgba : [0, 0, 0, 0];
396
205
  const rgbaMode = item.rgbaMode !== undefined ? item.rgbaMode : 0;
@@ -466,7 +275,168 @@ export default class Plugin {
466
275
  return result;
467
276
  }
468
277
 
469
- //TODO free
278
+ // Globe API
279
+
280
+ init(globe, gl) {
281
+ this.gl = gl;
282
+ this.globe = globe;
283
+ this.lineProgram = LineOnGlobeCache.get(globe);
284
+ this.ringProgram = pieceOfPieProgramCache.get(globe);
285
+ this.circleProgram = CircleCache.get(globe);
286
+ this.circle3DProgram = Circle3DCache.get(globe);
287
+ const circleFlatEdgeCount = this.circleFlatEdgeCount
288
+ {
289
+ // createBuffers
290
+ const bufferType = "DYNAMIC_DRAW";
291
+ const initialCapacity = this.bufferOrchestrator.capacity;
292
+ this.bufferManagersCompMap = new Map(
293
+ [
294
+ ["centerCoords2d", {
295
+ 'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
296
+ 'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.long, item.lat)),
297
+ }],
298
+ ["centerCoords2dflat", {
299
+ 'bufferManager': new BufferManager(gl, circleFlatEdgeCount * 2, { bufferType, initialCapacity }),
300
+ 'adaptor': (item) => item.centerCoords2dflat,
301
+ }],
302
+ ["centerCoords3d", {
303
+ 'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
304
+ 'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.long, item.lat, 0, 0)),
305
+ }],
306
+ ["targetCoords2d", {
307
+ 'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
308
+ 'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.endLong, item.endLat))
309
+ }],
310
+ ["targetCoords3d", {
311
+ 'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
312
+ 'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.endLong, item.endLat, 0, 0))
313
+ }],
314
+ ["bearingTargetCoords2d", {
315
+ 'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
316
+ 'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.bearingLong, item.bearingLat))
317
+ }],
318
+ ["bearingTargetCoords3d", {
319
+ 'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
320
+ 'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.bearingLong, item.bearingLat, 0, 0))
321
+ }],
322
+ ["startAngle2d", {
323
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
324
+ 'adaptor': (item) => new Float32Array([item.startAngle2d])
325
+ }],
326
+ ["tailAngle2d", {
327
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
328
+ 'adaptor': (item) => new Float32Array([item.tailAngle2d])
329
+ }],
330
+ ["startAngle3d", {
331
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
332
+ 'adaptor': (item) => new Float32Array([item.startAngle3d])
333
+ }],
334
+ ["tailAngle3d", {
335
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
336
+ 'adaptor': (item) => new Float32Array([item.tailAngle3d])
337
+ }],
338
+ ["bearingDashRatio", {
339
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
340
+ 'adaptor': (item) => new Float32Array([0])
341
+ }],
342
+ ["rgba", {
343
+ 'bufferManager': new BufferManager(gl, 4, { bufferType, initialCapacity }),
344
+ 'adaptor': (item) => new Float32Array(item.rgba)
345
+ }],
346
+ ["radius", {
347
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
348
+ 'adaptor': (item) => new Float32Array([item.radius])
349
+ }],
350
+ ["rgbaMode", {
351
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
352
+ 'adaptor': (item) => new Float32Array([item.rgbaMode])
353
+ }],
354
+ ["dashRatio", {
355
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
356
+ 'adaptor': (item) => new Float32Array([item.dashRatio])
357
+ }],
358
+
359
+ ["bigRadius", {
360
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
361
+ 'adaptor': (item) => new Float32Array([item.bigRadius])
362
+ }],
363
+ ["dashOpacity", {
364
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
365
+ 'adaptor': (item) => new Float32Array([item.dashOpacity]),
366
+ }],
367
+ ["circleDashAngle", {
368
+ 'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
369
+ 'adaptor': (item) => new Float32Array([item.circleDashAngle / 360]),
370
+ }],
371
+ // Mercator circle properties are duplicated for the sake of performance.
372
+ ["rgbaMercator", {
373
+ 'bufferManager': new BufferManager(gl, 4 * circleFlatEdgeCount, { bufferType, initialCapacity }),
374
+ 'adaptor': (item) => populateFloat32Array.fillWithListData(circleFlatEdgeCount, item.rgba),
375
+ }],
376
+ ["circleDashAngleMercator", {
377
+ 'bufferManager': new BufferManager(gl, circleFlatEdgeCount, { bufferType, initialCapacity }),
378
+ 'adaptor': (item) => populateFloat32Array.fillFloat32Array(circleFlatEdgeCount, item.circleDashAngle / 360),
379
+ }],
380
+ ["dashOpacityMercator", {
381
+ 'bufferManager': new BufferManager(gl, circleFlatEdgeCount, { bufferType, initialCapacity }),
382
+ 'adaptor': (item) => populateFloat32Array.fillFloat32Array(circleFlatEdgeCount, item.dashOpacity),
383
+ }],
384
+ ]
385
+ );
386
+ }
387
+ const obj = function (bufferManagerComp, divisor = 1) {
388
+ return { 'buffer': bufferManagerComp.bufferManager.buffer, 'stride': 0, 'offset': 0, divisor }
389
+ };
390
+ this.lineVao = this.lineProgram.createVAO(
391
+ ...['centerCoords2d', 'centerCoords3d', 'targetCoords2d', 'targetCoords3d', 'dashRatio', 'dashOpacity', 'rgba'].map(key => obj(this.bufferManagersCompMap.get(key))));
392
+ this.ringVao = this.ringProgram.createVAO(
393
+ ...['centerCoords2d', 'centerCoords3d',
394
+ 'startAngle2d',
395
+ 'tailAngle2d',
396
+ 'startAngle3d',
397
+ 'tailAngle3d',
398
+ 'rgba',
399
+ 'radius',
400
+ 'rgbaMode'].map(key => obj(this.bufferManagersCompMap.get(key))));
401
+ {
402
+ this.bearingLineVAO = this.lineProgram.createVAO(
403
+ ...['centerCoords2d', 'centerCoords3d', 'bearingTargetCoords2d', 'bearingTargetCoords3d', 'bearingDashRatio', 'dashOpacity', 'rgba'].map(key => obj(this.bufferManagersCompMap.get(key))));
404
+ }
405
+ this.circleVao = this.circleProgram.createVAO(
406
+ ...["centerCoords2dflat", "rgbaMercator", "circleDashAngleMercator", "dashOpacityMercator"].map(key => obj(this.bufferManagersCompMap.get(key)))
407
+ );
408
+ this.circle3DVao = this.circle3DProgram.createVAO(
409
+ ...["centerCoords3d", "bigRadius", "rgba", "circleDashAngle", "dashOpacity"].map(key => obj(this.bufferManagersCompMap.get(key)))
410
+ );
411
+ }
412
+
413
+
414
+ draw3D() {
415
+ const { gl } = this;
416
+ gl.disable(gl.DEPTH_TEST);
417
+ const is3D = this.globe.api_GetCurrentGeometry() === 0;
418
+ this.lineProgram.draw(this.lineVao, this.bufferOrchestrator.length, this._opacity);
419
+ if (this.drawAngleRing) {
420
+ this.ringProgram.draw(this.bufferOrchestrator.length, this.ringVao, 360, this._opacity * 0.8, RINGPARTIAL_DRAW_MODE.TRIANGLE_FAN);
421
+ this.ringProgram.draw(this.bufferOrchestrator.length, this.ringVao, 360, this._opacity, RINGPARTIAL_DRAW_MODE.LINE_STRIP);
422
+ }
423
+ if (this.drawBearingLine) {
424
+ this.lineProgram.draw(this.bearingLineVAO, this.bufferOrchestrator.length, this._opacity * 0.8);
425
+ }
426
+ if (this.drawVRM) {
427
+ if (is3D) {
428
+ this.circle3DProgram.draw(this.circle3DVao, this.bufferOrchestrator.length, this._opacity);
429
+ } else {
430
+ this.circleProgram.draw(this.circleVao, this.bufferOrchestrator.length, this.circleFlatEdgeCount, this._opacity);
431
+ }
432
+ }
433
+ if (this.drawText) {
434
+ this._textWritersMap.forEach((writer) => writer.draw());
435
+ }
436
+ gl.enable(gl.DEPTH_TEST);
437
+ }
438
+
439
+
470
440
  free() {
471
441
  if (this.isFreed) return;
472
442
  this.bufferManagersCompMap.forEach(({ bufferManager, adaptor }) => {
@@ -486,16 +456,11 @@ export default class Plugin {
486
456
  }
487
457
 
488
458
 
489
-
490
-
491
459
  _deleteTexts(keys) {
492
460
  this._textWritersMap.forEach((writer) => {
493
461
  writer.deleteTextBulk(keys);
494
462
  });
495
463
  }
496
-
497
-
498
-
499
464
  }
500
465
 
501
466