@pirireis/webglobeplugins 0.5.8 → 0.5.10
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.
|
@@ -95,22 +95,28 @@ export class ChainListMap {
|
|
|
95
95
|
}
|
|
96
96
|
|
|
97
97
|
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
98
|
+
updateNodesProperties(chainKey, nodes) {
|
|
99
|
+
nodes.forEach((node) => {
|
|
100
|
+
|
|
101
|
+
const index = this.getIndexOfNode(chainKey, node.key)
|
|
102
|
+
const chainNode = this._chainMap.get(chainKey)[index];
|
|
103
|
+
if (node.circleProperties) {
|
|
104
|
+
if (chainNode.circleProperties === undefined) chainNode.circleProperties = {}
|
|
105
|
+
node.circleProperties.forEach((value, key, container) => chainNode.circleProperties[key] = value);
|
|
106
|
+
}
|
|
107
|
+
if (node.lineProperties) {
|
|
108
|
+
if (chainNode.lineProperties === undefined) chainNode.lineProperties = {}
|
|
109
|
+
node.lineProperties.forEach((value, key, container) => chainNode.lineProperties[key] = value);
|
|
110
|
+
}
|
|
111
|
+
});
|
|
112
|
+
|
|
107
113
|
}
|
|
108
114
|
|
|
109
115
|
updateCoordsinatesOfNode(node, chainKey) {
|
|
110
116
|
const index = this.getIndexOfNode(chainKey, node.key)
|
|
111
117
|
const chain = this._chainMap.get(chainKey);
|
|
112
118
|
chain[index].long = node.long;
|
|
113
|
-
chain[index].
|
|
119
|
+
chain[index].lat = node.lat;
|
|
114
120
|
|
|
115
121
|
}
|
|
116
122
|
|
|
@@ -179,13 +185,12 @@ export class ChainListMap {
|
|
|
179
185
|
getIndexOfNode(chainKey, nodeKey) {
|
|
180
186
|
const key = this.keyMethod(chainKey, nodeKey);
|
|
181
187
|
if (this._indexMap.has(key)) return this._indexMap.get(key);
|
|
182
|
-
|
|
183
188
|
const chain = this._chainMap.get(chainKey);
|
|
184
189
|
for (let i = 0; i < chain.length; i++) {
|
|
185
190
|
const node = chain[i];
|
|
186
191
|
this._indexMap.set(key, i);
|
|
187
192
|
if (node.key === nodeKey) {
|
|
188
|
-
return i
|
|
193
|
+
return i;
|
|
189
194
|
}
|
|
190
195
|
}
|
|
191
196
|
}
|
|
@@ -161,12 +161,12 @@ export class CircleLineChainPlugin {
|
|
|
161
161
|
/**
|
|
162
162
|
*
|
|
163
163
|
* @param {*} chainKey
|
|
164
|
-
* @param {Array<{nodeKey, Map[propertyName ,value]}} propertyMap
|
|
164
|
+
* @param {Array<{nodeKey, circleProperties:Map[propertyName ,value], lineProperties:Map[propertyName ,value] }} propertyMap
|
|
165
165
|
*/
|
|
166
|
-
|
|
167
|
-
this._chainListMap.
|
|
166
|
+
updateNodesProperties(chainKey, nodesAndPropertyMap, { textWriterIDs = [] } = {}) {
|
|
167
|
+
this._chainListMap.updateNodesProperties(chainKey, nodesAndPropertyMap)
|
|
168
168
|
this._reconstructChains([chainKey]);
|
|
169
|
-
this._updateTexts(chainKey, textWriterIDs);
|
|
169
|
+
this._updateTexts([chainKey], textWriterIDs);
|
|
170
170
|
this.globe.DrawRender();
|
|
171
171
|
}
|
|
172
172
|
|
|
@@ -231,7 +231,7 @@ export class CircleLineChainPlugin {
|
|
|
231
231
|
|
|
232
232
|
|
|
233
233
|
updateNodeCoordinates(node, chainKey, { textWriterIDs = [] } = {}) {
|
|
234
|
-
this._chainListMap.
|
|
234
|
+
this._chainListMap.updateCoordsinatesOfNode(node, chainKey);
|
|
235
235
|
if (textWriterIDs) this._updateTexts([chainKey], textWriterIDs);
|
|
236
236
|
this._reconstructChains([chainKey]);
|
|
237
237
|
this.globe.DrawRender();
|
|
@@ -273,17 +273,18 @@ export class CircleLineChainPlugin {
|
|
|
273
273
|
*
|
|
274
274
|
* @param {Array<{chainKey, nodeKeys:[]} keysAndNodes
|
|
275
275
|
*/
|
|
276
|
-
deleteNodes(keysAndNodes) {
|
|
276
|
+
deleteNodes(keysAndNodes, { textWriterIDs = [] } = {}) {
|
|
277
277
|
const bufferKeys = [];
|
|
278
278
|
const chainKeysToReconstuct = [];
|
|
279
279
|
keysAndNodes.forEach(({ chainKey, nodeKeys }) => {
|
|
280
280
|
bufferKeys.push(...this._chainListMap.deleteNodesBelongToAChain(chainKey, nodeKeys));
|
|
281
281
|
chainKeysToReconstuct.push(chainKey);
|
|
282
282
|
});
|
|
283
|
-
this._reconstructChains(chainKeysToReconstuct);
|
|
284
283
|
this._textContextWriterInjectionMap.forEach((writer) => writer.deleteTextBulk(bufferKeys));
|
|
285
284
|
// if (textWriterIDs) this._updateTexts(chainKeysToReconstuct, textWriterIDs)
|
|
286
285
|
this.bufferOrchestrator.deleteBulk(bufferKeys, this.bufferManagersCompMap);
|
|
286
|
+
this._reconstructChains(chainKeysToReconstuct);
|
|
287
|
+
this._updateTexts(chainKeysToReconstuct, textWriterIDs);
|
|
287
288
|
this.globe.DrawRender();
|
|
288
289
|
|
|
289
290
|
}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { PixelPaddingForFlatCompassCache } from "../programs/two-d/pixel-padding-for-compass";
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
export class PixelPaddingCompassPlugin {
|
|
6
|
+
constructor(id, { } = {}) {
|
|
7
|
+
this.id = id;
|
|
8
|
+
this.memory = new Map();
|
|
9
|
+
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
init(globe, gl) {
|
|
13
|
+
this.globe = globe;
|
|
14
|
+
this.gl = gl;
|
|
15
|
+
|
|
16
|
+
this._initOrchestrations()
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
_initOrchestrations() {
|
|
22
|
+
const { gl, globe } = this;
|
|
23
|
+
this.paddingProgram = PixelPaddingForFlatCompassCache.get(globe);
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
{
|
|
27
|
+
// createBuffers
|
|
28
|
+
const bufferType = "DYNAMIC_DRAW";
|
|
29
|
+
const initialCapacity = this.bufferOrchestrator.capacity;
|
|
30
|
+
this.bufferManagersCompMap = new Map(
|
|
31
|
+
[
|
|
32
|
+
["screenCoordinates", {
|
|
33
|
+
'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
|
|
34
|
+
'adaptor': (item) => {
|
|
35
|
+
const { x, y } = globe.api_GetScreenPointFromGeo(
|
|
36
|
+
{
|
|
37
|
+
long: item.long,
|
|
38
|
+
lat: item.lat,
|
|
39
|
+
z: 0,
|
|
40
|
+
});
|
|
41
|
+
return new Float32Array([x, y]);
|
|
42
|
+
}
|
|
43
|
+
}],
|
|
44
|
+
["pixelRadiusSmall", {
|
|
45
|
+
'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
|
|
46
|
+
'adaptor': (item) => new Float32Array([item.pixelRadiusSmall])
|
|
47
|
+
}],
|
|
48
|
+
["pixelRadiusBig", {
|
|
49
|
+
'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
|
|
50
|
+
'adaptor': (item) => new Float32Array([item.pixelRadiusBig])
|
|
51
|
+
}],
|
|
52
|
+
["rgba", {
|
|
53
|
+
'bufferManager': new BufferManager(gl, 4, { bufferType, initialCapacity }),
|
|
54
|
+
'adaptor': (item) => {
|
|
55
|
+
if (item.lineProperties?.rgba) return new Float32Array(item.lineProperties.rgba);
|
|
56
|
+
return new Float32Array(item.rgba);
|
|
57
|
+
}
|
|
58
|
+
}],
|
|
59
|
+
|
|
60
|
+
]
|
|
61
|
+
);
|
|
62
|
+
const obj = function (bufferManagerComp) {
|
|
63
|
+
return { 'buffer': bufferManagerComp.bufferManager.buffer, 'stride': 0, 'offset': 0 }
|
|
64
|
+
};
|
|
65
|
+
this.paddingVao = this.paddingProgram.createVAO(
|
|
66
|
+
...['screenCoordinates', 'pixelRadiusSmall', 'pixelRadiusBig', 'rgba'].map(key => obj(this.bufferManagersCompMap.get(key))));
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
|
|
75
|
+
function isOnTheScreen(globe, points) { }
|
|
76
|
+
|
package/package.json
CHANGED
|
@@ -0,0 +1,155 @@
|
|
|
1
|
+
import { createProgram } from "../../util";
|
|
2
|
+
import { CameraUniformBlockTotemCache, CameraUniformBlockString } from "../totems";
|
|
3
|
+
import { globeProgramCache } from "../programcache";
|
|
4
|
+
const vertexCount = 720;
|
|
5
|
+
const vertexShaderSource = `#version 300 es
|
|
6
|
+
${CameraUniformBlockString}
|
|
7
|
+
in vec2 screen_coordinate;
|
|
8
|
+
in float pixel_radius_small;
|
|
9
|
+
in float pixel_radius_big;
|
|
10
|
+
in vec4 rgba;
|
|
11
|
+
|
|
12
|
+
out vec4 v_rgba;
|
|
13
|
+
|
|
14
|
+
uniform float world_angle_radiance;
|
|
15
|
+
uniform float plugin_opacity;
|
|
16
|
+
|
|
17
|
+
vec2 coords(){
|
|
18
|
+
float radius;
|
|
19
|
+
float angle;
|
|
20
|
+
if( gl_VertexID % 2 == 0){
|
|
21
|
+
if ( gl_VertexID % 60 == 0){
|
|
22
|
+
radius = pixel_radius_small;
|
|
23
|
+
} else {
|
|
24
|
+
radius = (pixel_radius_big + pixel_radius_small) / 2.0;
|
|
25
|
+
}
|
|
26
|
+
angle = (float(gl_VertexID) / (${vertexCount}.0));
|
|
27
|
+
|
|
28
|
+
} else {
|
|
29
|
+
radius = pixel_radius_big;
|
|
30
|
+
angle = (float(gl_VertexID - 1) / (${vertexCount}.0));
|
|
31
|
+
}
|
|
32
|
+
angle *= ${Math.PI * 2.0} + world_angle_radiance;
|
|
33
|
+
return screen_coordinate + vec2( cos(angle), sin(angle)) * radius;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
void main(){
|
|
38
|
+
vec2 c = coords();
|
|
39
|
+
gl_Position = vec4( vec2(c.x / screenWH.x, c.y/ screenWH.y), 0.0,1.0);
|
|
40
|
+
v_rgba = rgba;
|
|
41
|
+
v_rgba.a *= plugin_opacity;
|
|
42
|
+
}
|
|
43
|
+
`
|
|
44
|
+
|
|
45
|
+
const fragmentShaderSource = `#version 300 es
|
|
46
|
+
precision highp float;
|
|
47
|
+
in vec4 v_rgba;
|
|
48
|
+
out vec4 color;
|
|
49
|
+
void main(){
|
|
50
|
+
color = v_rgba;
|
|
51
|
+
}
|
|
52
|
+
`
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
class Logic {
|
|
56
|
+
constructor(globe) {
|
|
57
|
+
this.globe = globe;
|
|
58
|
+
this.gl = globe.gl;
|
|
59
|
+
this._lastOpacity = 1;
|
|
60
|
+
this.program = createProgram(this.gl, vertexShaderSource, fragmentShaderSource);
|
|
61
|
+
const { gl, program } = this;
|
|
62
|
+
{ // assign attribute locations
|
|
63
|
+
gl.bindAttriblocation(program, 0, "screen_coordinate");
|
|
64
|
+
gl.bindAttriblocation(program, 1, "pixel_radius_small");
|
|
65
|
+
gl.bindAttriblocation(program, 2, "pixel_radius_big");
|
|
66
|
+
gl.bindAttriblocation(program, 3, "rgba");
|
|
67
|
+
}
|
|
68
|
+
{
|
|
69
|
+
this._opacityLocation = gl.getUniformLocation(program, "plugin_opacity");
|
|
70
|
+
const currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
|
|
71
|
+
gl.useProgram(program);
|
|
72
|
+
gl.uniform1f(this._opacityLocation, this._lastOpacity);
|
|
73
|
+
gl.useProgram(currentProgram);
|
|
74
|
+
}
|
|
75
|
+
{
|
|
76
|
+
this.cameraBlockBindingPoint = 0;
|
|
77
|
+
const cameraBlockIndex = gl.getUniformBlockIndex(program, "CameraUniformBlock");
|
|
78
|
+
this.cameraBlockTotem = CameraUniformBlockTotemCache.get(globe);
|
|
79
|
+
gl.uniformBlockBinding(program, cameraBlockIndex, this.cameraBlockBindingPoint);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
|
|
84
|
+
draw(vao, length, opacity) {
|
|
85
|
+
const { globe, gl, program, cameraBlockTotem, cameraBlockBindingPoint, _opacityLocation } = this;
|
|
86
|
+
if (globe.api_GetCurrentGeometry() === 0) return;
|
|
87
|
+
gl.useProgram(program);
|
|
88
|
+
cameraBlockTotem.bind(cameraBlockBindingPoint);
|
|
89
|
+
gl.bindVertexArray(vao);
|
|
90
|
+
if (opacity !== this._lastOpacity) {
|
|
91
|
+
this._lastOpacity = opacity;
|
|
92
|
+
gl.uniform1f(_opacityLocation, opacity);
|
|
93
|
+
}
|
|
94
|
+
gl.drawArraysInstanced(gl.LINES, 0, vertexCount, length);
|
|
95
|
+
gl.bindVertexArray(null);
|
|
96
|
+
cameraBlockTotem.unbind(cameraBlockBindingPoint);
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
createVAO(screenCoordsBufferObj, pixelRadiusSmallBufferObj, pixelRadiusBigBufferObj, rgbaBufferObj) {
|
|
100
|
+
const { gl } = this;
|
|
101
|
+
|
|
102
|
+
const vao = gl.createVertexArray();
|
|
103
|
+
gl.bindVertexArray(vao);
|
|
104
|
+
{
|
|
105
|
+
const { buffer, stride = 0, offset = 0 } = screenCoordsBufferObj;
|
|
106
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
|
|
107
|
+
gl.enableVertexAttribArray(0);
|
|
108
|
+
gl.vertexAttribPointer(0, 2, gl.FLOAT, false, stride, offset);
|
|
109
|
+
gl.vertexAttribDivisor(0, 1);
|
|
110
|
+
}
|
|
111
|
+
{
|
|
112
|
+
const { buffer, stride = 0, offset = 0 } = pixelRadiusSmallBufferObj;
|
|
113
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
|
|
114
|
+
gl.enableVertexAttribArray(0);
|
|
115
|
+
gl.vertexAttribPointer(1, 1, gl.FLOAT, false, stride, offset);
|
|
116
|
+
gl.vertexAttribDivisor(1, 1);
|
|
117
|
+
}
|
|
118
|
+
{
|
|
119
|
+
const { buffer, stride = 0, offset = 0 } = pixelRadiusBigBufferObj;
|
|
120
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
|
|
121
|
+
gl.enableVertexAttribArray(0);
|
|
122
|
+
gl.vertexAttribPointer(2, 1, gl.FLOAT, false, stride, offset);
|
|
123
|
+
gl.vertexAttribDivisor(2, 1);
|
|
124
|
+
}
|
|
125
|
+
{
|
|
126
|
+
const { buffer, stride = 0, offset = 0 } = rgbaBufferObj;
|
|
127
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
|
|
128
|
+
gl.enableVertexAttribArray(0);
|
|
129
|
+
gl.vertexAttribPointer(3, 4, gl.FLOAT, false, stride, offset);
|
|
130
|
+
gl.vertexAttribDivisor(3, 1);
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
gl.bindVertexArray(null);
|
|
134
|
+
return vao;
|
|
135
|
+
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
|
|
139
|
+
|
|
140
|
+
|
|
141
|
+
free() {
|
|
142
|
+
CameraUniformBlockTotemCache.release(globe);
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
|
|
147
|
+
|
|
148
|
+
export const PixelPaddingForFlatCompassCache = Object.freeze({
|
|
149
|
+
get: (globe) => {
|
|
150
|
+
globeProgramCache.getProgram(globe, Logic)
|
|
151
|
+
},
|
|
152
|
+
release: (globe) => {
|
|
153
|
+
globeProgramCache.releaseProgram(globe, Logic)
|
|
154
|
+
}
|
|
155
|
+
})
|
|
File without changes
|