@pirireis/webglobeplugins 0.6.23-a → 0.6.25-a
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.
- package/compass-rose/compass-text-writer.js +14 -5
- package/package.json +1 -1
- package/programs/line-on-globe/degree-padding-around-circle-3d.js +189 -0
- package/programs/line-on-globe/lines-color-instanced-flat.js +20 -13
- package/programs/line-on-globe/naive-accurate.js +1 -2
- package/programs/two-d/pixel-padding-for-compass.js +7 -7
- package/rangerings-2/plugin.js +209 -37
- package/rangerings-2/rangeringangletext.js +12 -15
- package/rangerings-2/ring-account.js +22 -3
- package/compassrose/compassrose-2d.js +0 -29
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
import { CSZMode, CSMeasureTextPositionTypes } from "@pirireis/webglobe";
|
|
2
2
|
|
|
3
3
|
// const defaultStyle = {
|
|
4
4
|
// textFont: {
|
|
@@ -49,16 +49,25 @@ export class PixelPaddingCompassTextWriter {
|
|
|
49
49
|
this.northFont = northFont;
|
|
50
50
|
this.doDraw = doDraw;
|
|
51
51
|
this.angle = angle;
|
|
52
|
-
|
|
52
|
+
console.log("CSMeasureTextPositionTypes", CSMeasureTextPositionTypes);
|
|
53
53
|
this.angles = []
|
|
54
54
|
this.texts = []
|
|
55
|
+
this.positions = []
|
|
55
56
|
let currentAngle = 0;
|
|
56
57
|
while (currentAngle < 360) {
|
|
58
|
+
if (currentAngle > 180) {
|
|
59
|
+
this.positions.push(CSMeasureTextPositionTypes.CENTER);
|
|
60
|
+
} else {
|
|
61
|
+
this.positions.push(null);
|
|
62
|
+
}
|
|
57
63
|
this.angles.push(currentAngle);
|
|
58
64
|
if (currentAngle == 0) {
|
|
59
65
|
this.texts.push("K");
|
|
60
66
|
} else {
|
|
61
|
-
|
|
67
|
+
// to string 3 chars fill left with 0
|
|
68
|
+
|
|
69
|
+
|
|
70
|
+
this.texts.push(currentAngle.toString().padStart(3, '0'));
|
|
62
71
|
}
|
|
63
72
|
currentAngle += this.angle;
|
|
64
73
|
}
|
|
@@ -92,7 +101,6 @@ export class PixelPaddingCompassTextWriter {
|
|
|
92
101
|
_checkSetOffsets() {
|
|
93
102
|
const { globe } = this;
|
|
94
103
|
const newAngle = globe.api_GetCurrentLookInfo()["NorthAng"] * (Math.PI / 180);;
|
|
95
|
-
console.log("n angle", newAngle);
|
|
96
104
|
if (newAngle !== this._lastNorthAngle) {
|
|
97
105
|
this._lastNorthAngle = newAngle;
|
|
98
106
|
this.offsets = this.__offset();
|
|
@@ -102,7 +110,7 @@ export class PixelPaddingCompassTextWriter {
|
|
|
102
110
|
|
|
103
111
|
draw() {
|
|
104
112
|
if (!this.doDraw) return;
|
|
105
|
-
const { globe, font, opacity: opacity_, northFont, itemMap, texts, angles } = this;
|
|
113
|
+
const { globe, font, opacity: opacity_, northFont, itemMap, texts, angles, positions } = this;
|
|
106
114
|
this._checkSetOffsets();// zMode: CSZMode.Z_GROUND_PERVERTEX,
|
|
107
115
|
const offsets = this.offsets;
|
|
108
116
|
for (const [key, { center, radius, opacity = null }] of itemMap) {
|
|
@@ -111,6 +119,7 @@ export class PixelPaddingCompassTextWriter {
|
|
|
111
119
|
offsets.forEach(({ offsetX, offsetY }, i) => {
|
|
112
120
|
const text = texts[i];
|
|
113
121
|
const angle = angles[i];
|
|
122
|
+
font.position = positions[i];
|
|
114
123
|
if (angle === 0) {
|
|
115
124
|
globe.api_DrawContextTextMultiLine(text, northFont, o, { x: center.x + offsetX * radius + xGapFit, y: center.y + offsetY * radius + yGapFit });
|
|
116
125
|
|
package/package.json
CHANGED
|
@@ -0,0 +1,189 @@
|
|
|
1
|
+
import { createProgram } from "../../util/webglobjectbuilders";
|
|
2
|
+
import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../totems/camerauniformblock";
|
|
3
|
+
import { noRegisterGlobeProgramCache } from "../programcache";
|
|
4
|
+
import { vaoAttributeLoader } from "../../util/account/util";
|
|
5
|
+
import {
|
|
6
|
+
longLatRadToMercator, longLatRadToCartesian3D, cartesian3DToGLPosition, mercatorXYToGLPosition, realDistanceOnSphereR1,
|
|
7
|
+
circleLimpFromLongLatRadCenterCartesian3D_accurate,
|
|
8
|
+
circleLimpFromLongLatRadCenterMercatorCompass_accurate,
|
|
9
|
+
circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate,
|
|
10
|
+
POLE
|
|
11
|
+
} from "../../util/shaderfunctions/geometrytransformations";
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* TODO:
|
|
16
|
+
* 1. integrate geometry functions for radius angle and center
|
|
17
|
+
* 2. integrate attributes
|
|
18
|
+
*
|
|
19
|
+
* TODO:
|
|
20
|
+
* center_position is too small or doenst loaded as expected.
|
|
21
|
+
*/
|
|
22
|
+
|
|
23
|
+
const INITIAL_EDGE_COUNT = 360;
|
|
24
|
+
|
|
25
|
+
const vertexShaderSource = `#version 300 es
|
|
26
|
+
precision highp float;
|
|
27
|
+
${CameraUniformBlockString}
|
|
28
|
+
${longLatRadToMercator}
|
|
29
|
+
${longLatRadToCartesian3D}
|
|
30
|
+
${cartesian3DToGLPosition}
|
|
31
|
+
${mercatorXYToGLPosition}
|
|
32
|
+
${realDistanceOnSphereR1}
|
|
33
|
+
${circleLimpFromLongLatRadCenterCartesian3D_accurate}
|
|
34
|
+
${circleLimpFromLongLatRadCenterMercatorCompass_accurate}
|
|
35
|
+
${circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate}
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
in vec3 center_position3d;
|
|
39
|
+
in float big_radius;
|
|
40
|
+
in float small_radius;
|
|
41
|
+
in vec4 color;
|
|
42
|
+
|
|
43
|
+
uniform float edge_count;
|
|
44
|
+
uniform float step_angle;
|
|
45
|
+
|
|
46
|
+
out float interpolation;
|
|
47
|
+
out vec4 v_color;
|
|
48
|
+
void main() {
|
|
49
|
+
if( !is3D) {
|
|
50
|
+
return;
|
|
51
|
+
}
|
|
52
|
+
int pad_phase = gl_VertexID % 2; // 0 or 1
|
|
53
|
+
interpolation = float( gl_VertexID - pad_phase) / edge_count;
|
|
54
|
+
float angle = float( gl_VertexID - pad_phase) * step_angle;
|
|
55
|
+
vec3 position;
|
|
56
|
+
if ( pad_phase == 0 ) {
|
|
57
|
+
position = circleLimpFromLongLatRadCenterCartesian3D_accurate(center_position3d, big_radius, angle);
|
|
58
|
+
} else {
|
|
59
|
+
position = circleLimpFromLongLatRadCenterCartesian3D_accurate(center_position3d, small_radius, angle);
|
|
60
|
+
}
|
|
61
|
+
gl_Position = cartesian3DToGLPosition(position);
|
|
62
|
+
v_color = color;
|
|
63
|
+
gl_PointSize = 5.0;
|
|
64
|
+
}`
|
|
65
|
+
|
|
66
|
+
const fragmentShaderSource = `#version 300 es
|
|
67
|
+
${POLE}
|
|
68
|
+
precision highp float;
|
|
69
|
+
uniform float opacity;
|
|
70
|
+
in vec4 v_color;
|
|
71
|
+
in float interpolation;
|
|
72
|
+
in vec2 v_limp;
|
|
73
|
+
out vec4 color;
|
|
74
|
+
void main() {
|
|
75
|
+
color = v_color;
|
|
76
|
+
color.a *= opacity;
|
|
77
|
+
}
|
|
78
|
+
`;
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
class Logic {
|
|
83
|
+
|
|
84
|
+
constructor(globe) {
|
|
85
|
+
this.globe = globe;
|
|
86
|
+
this.gl = globe.gl;
|
|
87
|
+
this._lastOpacity = 1.0;
|
|
88
|
+
this._lastEdgeCount = INITIAL_EDGE_COUNT;
|
|
89
|
+
this._lastStepAngle = 360 / INITIAL_EDGE_COUNT;
|
|
90
|
+
this.program = createProgram(this.gl, vertexShaderSource, fragmentShaderSource);
|
|
91
|
+
|
|
92
|
+
const { gl, program } = this;
|
|
93
|
+
this.program.uniforms = {
|
|
94
|
+
opacity: gl.getUniformLocation(program, "opacity"),
|
|
95
|
+
edgeCount: gl.getUniformLocation(program, "edge_count"),
|
|
96
|
+
stepAngle: gl.getUniformLocation(program, "step_angle")
|
|
97
|
+
};
|
|
98
|
+
|
|
99
|
+
{ // initial uniform values
|
|
100
|
+
const currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
|
|
101
|
+
gl.useProgram(program);
|
|
102
|
+
gl.uniform1f(program.uniforms.opacity, 1.0);
|
|
103
|
+
gl.uniform1f(program.uniforms.edgeCount, INITIAL_EDGE_COUNT * 2);
|
|
104
|
+
gl.uniform1f(program.uniforms.stepAngle, this._lastStepAngle * Math.PI / 180);
|
|
105
|
+
gl.useProgram(currentProgram);
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
{ // assign attribute locations
|
|
109
|
+
gl.bindAttribLocation(program, 0, "center_position3d");
|
|
110
|
+
gl.bindAttribLocation(program, 1, "big_radius");
|
|
111
|
+
gl.bindAttribLocation(program, 2, "small_radius");
|
|
112
|
+
gl.bindAttribLocation(program, 3, "color");
|
|
113
|
+
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
this.cameraBindingPoint = 0;
|
|
117
|
+
this.cameraBlockTotem = CameraUniformBlockTotemCache.get(globe);
|
|
118
|
+
const cameraBlockLocation = gl.getUniformBlockIndex(program, "CameraUniformBlock");
|
|
119
|
+
gl.uniformBlockBinding(program, cameraBlockLocation, this.cameraBindingPoint);
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
createVAO(center3dObj, bigRadiusObj, smallRadiusObj, colorObj) {
|
|
123
|
+
const { gl } = this;
|
|
124
|
+
const vao = gl.createVertexArray();
|
|
125
|
+
const divisor = 1;
|
|
126
|
+
gl.bindVertexArray(vao);
|
|
127
|
+
{ // make this a function end import from account module.
|
|
128
|
+
const { buffer, stride = 0, offset = 0 } = center3dObj;
|
|
129
|
+
vaoAttributeLoader(gl, buffer, 0, 3, stride, offset, divisor);
|
|
130
|
+
}
|
|
131
|
+
{
|
|
132
|
+
console.log("bigRadiusObj", bigRadiusObj);
|
|
133
|
+
const { buffer, stride = 0, offset = 0 } = bigRadiusObj;
|
|
134
|
+
vaoAttributeLoader(gl, buffer, 1, 1, stride, offset, divisor);
|
|
135
|
+
}
|
|
136
|
+
{
|
|
137
|
+
const { buffer, stride = 0, offset = 0 } = smallRadiusObj;
|
|
138
|
+
vaoAttributeLoader(gl, buffer, 2, 1, stride, offset, divisor);
|
|
139
|
+
}
|
|
140
|
+
{
|
|
141
|
+
const { buffer, stride = 0, offset = 0 } = colorObj;
|
|
142
|
+
vaoAttributeLoader(gl, buffer, 3, 4, stride, offset, divisor);
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
gl.bindVertexArray(null);
|
|
146
|
+
gl.bindVertexArray(null);
|
|
147
|
+
return vao;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
draw(vao, length, edgeCount, stepAngle, opacity) {
|
|
151
|
+
const { gl, program, cameraBlockTotem, cameraBindingPoint } = this;
|
|
152
|
+
gl.useProgram(program);
|
|
153
|
+
|
|
154
|
+
if (this._lastOpacity !== opacity) {
|
|
155
|
+
gl.uniform1f(program.uniforms.opacity, opacity);
|
|
156
|
+
this._lastOpacity = opacity;
|
|
157
|
+
}
|
|
158
|
+
if (this._lastEdgeCount !== edgeCount) {
|
|
159
|
+
gl.uniform1f(program.uniforms.edgeCount, 2 * edgeCount);
|
|
160
|
+
this._lastEdgeCount = edgeCount;
|
|
161
|
+
}
|
|
162
|
+
if (this._lastStepAngle !== stepAngle) {
|
|
163
|
+
gl.uniform1f(program.uniforms.stepAngle, stepAngle * Math.PI / 180);
|
|
164
|
+
this._lastStepAngle = stepAngle;
|
|
165
|
+
}
|
|
166
|
+
gl.bindVertexArray(vao);
|
|
167
|
+
cameraBlockTotem.bind(cameraBindingPoint);
|
|
168
|
+
gl.drawArraysInstanced(gl.LINES, 0, edgeCount * 2, length);
|
|
169
|
+
// gl.drawArraysInstanced(gl.POINTS, 0, edgeCount, length);
|
|
170
|
+
cameraBlockTotem.unbind(cameraBindingPoint);
|
|
171
|
+
gl.bindVertexArray(null);
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
|
|
175
|
+
|
|
176
|
+
free() {
|
|
177
|
+
if (this.isFreed) return;
|
|
178
|
+
CameraUniformBlockTotemCache.release(this.globe);
|
|
179
|
+
this.gl.deleteProgram(this.program);
|
|
180
|
+
this.isFreed = true;
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
|
|
185
|
+
|
|
186
|
+
export const CirclePadding3DCache = Object.freeze({
|
|
187
|
+
get: (globe) => noRegisterGlobeProgramCache.getProgram(globe, Logic),
|
|
188
|
+
release: (globe) => noRegisterGlobeProgramCache.releaseProgram(globe, Logic)
|
|
189
|
+
});
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { CameraUniformBlockTotemCache, CameraUniformBlockString } from "../totems";
|
|
2
|
-
import { mercatorXYToGLPosition } from "../../util/shaderfunctions/geometrytransformations";
|
|
2
|
+
import { mercatorXYToGLPosition, POLE } from "../../util/shaderfunctions/geometrytransformations";
|
|
3
3
|
import { noRegisterGlobeProgramCache } from "../programcache";
|
|
4
4
|
import { createProgram } from "../../util";
|
|
5
5
|
import { vaoAttributeLoader } from "../../util/account/util";
|
|
6
6
|
|
|
7
7
|
/**
|
|
8
8
|
* This program draws line between points provided from the first and second buffer.
|
|
9
|
-
* draw method gl.
|
|
9
|
+
* draw method gl.drawArraysInstanced( gl.POINTS, 0,2, lineCount);
|
|
10
10
|
* */
|
|
11
11
|
|
|
12
12
|
const Z_ALPHA_MODE = Object.freeze({
|
|
@@ -25,38 +25,45 @@ in vec2 posA;
|
|
|
25
25
|
in vec2 posB;
|
|
26
26
|
in vec4 color;
|
|
27
27
|
|
|
28
|
+
out vec2 v_frame;
|
|
28
29
|
out vec4 v_color;
|
|
29
|
-
|
|
30
30
|
void main() {
|
|
31
|
+
|
|
31
32
|
if ( is3D ) {
|
|
32
33
|
return;
|
|
33
34
|
}
|
|
35
|
+
float gap = distance(posA, posB);
|
|
34
36
|
float z_alpha;
|
|
35
|
-
if ( z_alpha_on == 1){
|
|
36
|
-
z_alpha = z_level * z_level /
|
|
37
|
+
if ( z_alpha_on == 1 || gap > 40000000.0){
|
|
38
|
+
z_alpha = z_level * z_level / ( gap / 100.0 );
|
|
37
39
|
if( z_alpha < 0.1 ) {return;}
|
|
38
40
|
if( z_alpha > 1.0 ) {z_alpha = 1.0;}
|
|
39
41
|
} else {
|
|
40
42
|
z_alpha = 1.0;
|
|
41
43
|
}
|
|
42
44
|
vec2 pos;
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
45
|
+
if ( gl_VertexID == 0 ) {
|
|
46
|
+
pos = posA;
|
|
47
|
+
} else {
|
|
48
|
+
pos = posB;
|
|
49
|
+
}
|
|
50
|
+
v_frame = pos;
|
|
48
51
|
gl_Position = mercatorXYToGLPosition( pos );
|
|
49
52
|
v_color = color;
|
|
50
53
|
v_color.a *= z_alpha * opacity;
|
|
51
|
-
gl_PointSize =
|
|
54
|
+
gl_PointSize = 4.0;
|
|
52
55
|
}`;
|
|
53
56
|
|
|
54
57
|
|
|
55
58
|
const fragmentShaderSource = `#version 300 es
|
|
59
|
+
${POLE}
|
|
56
60
|
precision highp float;
|
|
57
61
|
in vec4 v_color;
|
|
62
|
+
in vec2 v_frame;
|
|
58
63
|
out vec4 outColor;
|
|
59
64
|
void main() {
|
|
65
|
+
if ( v_frame.x < -POLE || v_frame.x > POLE || v_frame.y < -POLE || v_frame.y > POLE ){ discard; }
|
|
66
|
+
|
|
60
67
|
outColor = v_color;
|
|
61
68
|
}`;
|
|
62
69
|
|
|
@@ -101,7 +108,7 @@ class Logic {
|
|
|
101
108
|
gl.bindVertexArray(vao);
|
|
102
109
|
[posAObj, posBObj, colorObj].forEach((obj, index) => {
|
|
103
110
|
const { buffer, size, stride, offset } = obj;
|
|
104
|
-
vaoAttributeLoader(gl,
|
|
111
|
+
vaoAttributeLoader(gl, buffer, index, size, stride, offset, divisor, type);
|
|
105
112
|
});
|
|
106
113
|
gl.bindVertexArray(null);
|
|
107
114
|
return vao;
|
|
@@ -121,7 +128,7 @@ class Logic {
|
|
|
121
128
|
this._lastZAlphaOn = zAlphaOn;
|
|
122
129
|
gl.uniform1i(this._zAlphaOnLocation, zAlphaOn);
|
|
123
130
|
}
|
|
124
|
-
gl.
|
|
131
|
+
gl.drawArraysInstanced(gl.LINES, 0, 2, lineCount);
|
|
125
132
|
_cameraUniformBlock.unbind(_cameraBindingPoint);
|
|
126
133
|
gl.bindVertexArray(null);
|
|
127
134
|
}
|
|
@@ -2,11 +2,9 @@ import { CameraUniformBlockString, CameraUniformBlockTotem } from "../totems";
|
|
|
2
2
|
import { pointsOnSphereBetween, POLE, R_3D, mercatorXYToGLPosition, cartesian3DToGLPosition } from "../../util/shaderfunctions/geometrytransformations";
|
|
3
3
|
import { createProgram } from "../../util";
|
|
4
4
|
import { noRegisterGlobeProgramCache, globeProgramCache } from "../programcache";
|
|
5
|
-
import BufferOffsetManger from "../../util/account/bufferoffsetmanager";
|
|
6
5
|
import { programCache } from "../rings/distancering/circleflatprogram";
|
|
7
6
|
|
|
8
7
|
const GLOBE_MIDPOINT_COUNT = 30;
|
|
9
|
-
const ITEM_SIZE = 9;
|
|
10
8
|
|
|
11
9
|
const vertexShader = `#version 300 es
|
|
12
10
|
precision highp float;
|
|
@@ -43,6 +41,7 @@ void main() {
|
|
|
43
41
|
gl_Position = cartesian3DToGLPosition(cartesian);
|
|
44
42
|
v_limp = vec2(0.0, 0.0);
|
|
45
43
|
} else {
|
|
44
|
+
if ( distance( start_position, end_position) > 30000000.0) { return; }
|
|
46
45
|
interpolation = float(gl_VertexID);
|
|
47
46
|
if (gl_VertexID % 2 == 0) {
|
|
48
47
|
longLat = start_position;
|
|
@@ -17,15 +17,15 @@ vec3 coord_opacity(){
|
|
|
17
17
|
float angle;
|
|
18
18
|
float gap = (pixel_radius_big - pixel_radius_small);
|
|
19
19
|
if( gl_VertexID % 2 == 0){
|
|
20
|
-
if( gl_VertexID % 180 == 0){
|
|
21
|
-
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
radius = pixel_radius_small
|
|
20
|
+
// if( gl_VertexID % 180 == 0){
|
|
21
|
+
// radius = pixel_radius_small ;
|
|
22
|
+
// } else
|
|
23
|
+
if ( gl_VertexID % 60 == 0){
|
|
24
|
+
radius = pixel_radius_small;
|
|
25
25
|
} else if( gl_VertexID % 10 == 0) {
|
|
26
|
-
radius = pixel_radius_small + gap * 0.
|
|
26
|
+
radius = pixel_radius_small + gap * 0.5;
|
|
27
27
|
} else {
|
|
28
|
-
radius = pixel_radius_small + gap* 0.
|
|
28
|
+
radius = pixel_radius_small + gap* 0.75;
|
|
29
29
|
}
|
|
30
30
|
angle = (float(gl_VertexID) / (${vertexCount}.0));
|
|
31
31
|
} else {
|
package/rangerings-2/plugin.js
CHANGED
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
*
|
|
31
31
|
*
|
|
32
32
|
* @method insertBulk
|
|
33
|
-
* @typedef {Array<{ringID, radius,
|
|
33
|
+
* @typedef {Array<{ringID, radius, padding}>} rings
|
|
34
34
|
* @param {Array<centerID:string, x:number, y:number, stepAngle:number, rgba:[4 numbers], rings:rings} items
|
|
35
35
|
|
|
36
36
|
* @method updateCentersXY @param {Array<{centerID, x, y}>} items
|
|
@@ -51,6 +51,11 @@ import { LinesColorInstancedFlatCache } from "../programs/line-on-globe/lines-co
|
|
|
51
51
|
import { BufferOrchestrator, BufferManager } from "../util/account";
|
|
52
52
|
import { populateFloat32Array } from "../util/jshelpers/data-filler";
|
|
53
53
|
import { RingAccount, ringKeyMethod, ringBigPaddingKeyMethod } from "./ring-account";
|
|
54
|
+
import { CirclePadding3DCache } from "../programs/line-on-globe/degree-padding-around-circle-3d";
|
|
55
|
+
import { LineOnGlobeCache } from '../programs/line-on-globe/naive-accurate';
|
|
56
|
+
|
|
57
|
+
import RangeRingAngleText from "./rangeringangletext";
|
|
58
|
+
|
|
54
59
|
/**
|
|
55
60
|
* Programs:
|
|
56
61
|
*
|
|
@@ -62,18 +67,19 @@ import { RingAccount, ringKeyMethod, ringBigPaddingKeyMethod } from "./ring-acco
|
|
|
62
67
|
|
|
63
68
|
/**
|
|
64
69
|
* [+] Draw circles
|
|
65
|
-
* [
|
|
66
|
-
* [
|
|
67
|
-
* [
|
|
68
|
-
* [
|
|
69
|
-
* [
|
|
70
|
-
* [
|
|
70
|
+
* [+] BUG BUFFER OVERFLOW
|
|
71
|
+
* [+] Draw one degree paddings 2d
|
|
72
|
+
* [+] Create a program for accurate padding 3d
|
|
73
|
+
* [+] Draw one degree paddings 3d
|
|
74
|
+
* [+] Draw big paddings
|
|
75
|
+
* [+] DrawText
|
|
76
|
+
* [+] big paddings does not remove
|
|
71
77
|
*/
|
|
72
78
|
|
|
73
79
|
// TODO make x, y -> long, lat
|
|
74
80
|
|
|
75
81
|
class RangeRings {
|
|
76
|
-
constructor(id, { oneDegreePadding = true, showNumbers = true, numbersStyle = null, opacity = 1
|
|
82
|
+
constructor(id, { oneDegreePadding = true, showNumbers = true, numbersStyle = null, opacity = 1 } = {}) {
|
|
77
83
|
|
|
78
84
|
this.id = id;
|
|
79
85
|
|
|
@@ -92,6 +98,10 @@ class RangeRings {
|
|
|
92
98
|
this.gl = gl;
|
|
93
99
|
this._initPrograms();
|
|
94
100
|
this._initBufferManagers();
|
|
101
|
+
if (this._showNumbers) {
|
|
102
|
+
this.textPlugin = new RangeRingAngleText(globe, this.id + "text", { flatCompassMode: this.compass, style: this._numbersStyle, opacity: this._opacity });
|
|
103
|
+
delete this._numbersStyle;
|
|
104
|
+
}
|
|
95
105
|
}
|
|
96
106
|
|
|
97
107
|
|
|
@@ -100,6 +110,8 @@ class RangeRings {
|
|
|
100
110
|
this._circleProgram2D = CircleCache2D.get(globe);
|
|
101
111
|
this._circleProgram3D = CircleCache3D.get(globe);
|
|
102
112
|
this._padding2dProgram = LinesColorInstancedFlatCache.get(globe);
|
|
113
|
+
this._padding3dProgram = CirclePadding3DCache.get(globe);
|
|
114
|
+
this._bigPadding3dFlatProgram = LineOnGlobeCache.get(globe);
|
|
103
115
|
// this._padding3dProgram
|
|
104
116
|
}
|
|
105
117
|
|
|
@@ -127,6 +139,10 @@ class RangeRings {
|
|
|
127
139
|
'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
|
|
128
140
|
'adaptor': (item) => new Float32Array([item.radius])
|
|
129
141
|
}],
|
|
142
|
+
["radius3dsmall", {
|
|
143
|
+
'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
|
|
144
|
+
'adaptor': (item) => new Float32Array([item.radius - item.padding / 3])
|
|
145
|
+
}],
|
|
130
146
|
["circleDashAngle", {
|
|
131
147
|
'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
|
|
132
148
|
'adaptor': (item) => new Float32Array([1]),
|
|
@@ -137,10 +153,10 @@ class RangeRings {
|
|
|
137
153
|
}],
|
|
138
154
|
|
|
139
155
|
// circle 2D
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
156
|
+
["centerCoords2dflatForPadding", {
|
|
157
|
+
'bufferManager': new BufferManager(gl, _circleFlatEdgeCount * 2, { bufferType, initialCapacity }),
|
|
158
|
+
'adaptor': (item) => item.centerCoords2dflatForPadding,
|
|
159
|
+
}],
|
|
144
160
|
["centerCoords2dflat", {
|
|
145
161
|
'bufferManager': new BufferManager(gl, _circleFlatEdgeCount * 2, { bufferType, initialCapacity }),
|
|
146
162
|
'adaptor': (item) => item.centerCoords2dflat,
|
|
@@ -171,25 +187,87 @@ class RangeRings {
|
|
|
171
187
|
...["centerCoords3d", "radius3d", "rgba", "circleDashAngle", "dashOpacity"].map(key => obj(this.bufferManagersCompMap.get(key)))
|
|
172
188
|
);
|
|
173
189
|
|
|
190
|
+
this.oneDegreePaddingVao = this._padding2dProgram.createVAO(
|
|
191
|
+
{ buffer: this.bufferManagersCompMap.get("centerCoords2dflat").bufferManager.buffer, size: 2, stride: 0, offset: 0 },
|
|
192
|
+
{ buffer: this.bufferManagersCompMap.get("centerCoords2dflatForPadding").bufferManager.buffer, size: 2, stride: 0, offset: 0 },
|
|
193
|
+
{ buffer: this.bufferManagersCompMap.get("rgbaMercator").bufferManager.buffer, size: 4, stride: 0, offset: 0 },
|
|
194
|
+
);
|
|
174
195
|
|
|
175
196
|
// PADDING
|
|
176
197
|
// this one needs glue to assosiate rings and their big paddings since the count for center is not fixed
|
|
177
|
-
this.
|
|
178
|
-
this.bufferManagersCompMapPadding = new Map(
|
|
198
|
+
this.paddingBufferOrchestrator = new BufferOrchestrator({ capacity: initialCapacity });
|
|
199
|
+
this.bufferManagersCompMapPadding = new Map(
|
|
200
|
+
[
|
|
201
|
+
["circlePoint", {
|
|
202
|
+
'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
|
|
203
|
+
'adaptor': (item) => item.circlePoint,
|
|
204
|
+
}],
|
|
205
|
+
["paddingPoint", {
|
|
206
|
+
'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
|
|
207
|
+
'adaptor': (item) => item.paddingPoint,
|
|
208
|
+
}],
|
|
209
|
+
["circlePoint3d", {
|
|
210
|
+
'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
|
|
211
|
+
'adaptor': (item) => item.circlePoint3d
|
|
212
|
+
}],
|
|
213
|
+
["paddingPoint3d", {
|
|
214
|
+
'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
|
|
215
|
+
'adaptor': (item) => item.paddingPoint3d
|
|
216
|
+
}],
|
|
217
|
+
["rgba", {
|
|
218
|
+
'bufferManager': new BufferManager(gl, 4, { bufferType, initialCapacity }),
|
|
219
|
+
'adaptor': (item) => new Float32Array(item.rgba)
|
|
220
|
+
}],
|
|
221
|
+
|
|
222
|
+
["dashOpacity", {
|
|
223
|
+
'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
|
|
224
|
+
'adaptor': (item) => new Float32Array([1]),
|
|
225
|
+
}],
|
|
226
|
+
["dashRatio", {
|
|
227
|
+
'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
|
|
228
|
+
'adaptor': (item) => new Float32Array([1]),
|
|
229
|
+
}],
|
|
230
|
+
]
|
|
231
|
+
);
|
|
232
|
+
|
|
233
|
+
// this.bigPaddingVAO = this._padding2dProgram.createVAO(
|
|
234
|
+
// { buffer: this.bufferManagersCompMapPadding.get("circlePoint").bufferManager.buffer, size: 2, stride: 0, offset: 0 },
|
|
235
|
+
// { buffer: this.bufferManagersCompMapPadding.get("paddingPoint").bufferManager.buffer, size: 2, stride: 0, offset: 0 },
|
|
236
|
+
// { buffer: this.bufferManagersCompMapPadding.get("rgba").bufferManager.buffer, size: 4, stride: 0, offset: 0 },
|
|
237
|
+
// );
|
|
238
|
+
|
|
239
|
+
this._bigPadding3dFlatVAO = this._bigPadding3dFlatProgram.createVAO(
|
|
240
|
+
...["circlePoint", "circlePoint3d", "paddingPoint", "paddingPoint3d", "dashRatio", "dashOpacity", "rgba",].map(key => obj(this.bufferManagersCompMapPadding.get(key)))
|
|
241
|
+
);
|
|
242
|
+
|
|
243
|
+
this._padding3dOneDegreeVao = this._padding3dProgram.createVAO(
|
|
244
|
+
...["centerCoords3d", "radius3d", "radius3dsmall", "rgba"].map(key => obj(this.bufferManagersCompMap.get(key)))
|
|
245
|
+
);
|
|
246
|
+
|
|
179
247
|
}
|
|
180
248
|
|
|
181
249
|
|
|
182
250
|
// GLOBE API
|
|
183
251
|
|
|
184
252
|
draw3D() {
|
|
185
|
-
const {
|
|
253
|
+
const {
|
|
254
|
+
globe, gl,
|
|
255
|
+
_circleProgram2D, _circleProgram3D, _padding2dProgram, _padding3dProgram, _bigPadding3dFlatProgram,
|
|
256
|
+
circle2DVao, circle3DVao, oneDegreePaddingVao, _padding3dOneDegreeVao, _bigPadding3dFlatVAO,
|
|
257
|
+
bufferOrchestrator, paddingBufferOrchestrator,
|
|
258
|
+
_circleFlatEdgeCount, _opacity, _oneDegreePadding } = this;
|
|
186
259
|
gl.disable(gl.DEPTH_TEST);
|
|
187
|
-
const is3D =
|
|
260
|
+
const is3D = globe.api_GetCurrentGeometry() === 0;
|
|
261
|
+
// const lod = globe.api_GetCurrentLOD();
|
|
188
262
|
if (is3D) {
|
|
189
263
|
_circleProgram3D.draw(circle3DVao, bufferOrchestrator.length, _opacity);
|
|
264
|
+
if (_oneDegreePadding) _padding3dProgram.draw(_padding3dOneDegreeVao, bufferOrchestrator.length, 360, 1, _opacity);
|
|
190
265
|
} else {
|
|
191
266
|
_circleProgram2D.draw(circle2DVao, bufferOrchestrator.length, _circleFlatEdgeCount, _opacity);
|
|
267
|
+
// _padding2dProgram.draw(bigPaddingVAO, paddingBufferOrchestrator.length, _opacity);
|
|
268
|
+
if (_oneDegreePadding) _padding2dProgram.draw(oneDegreePaddingVao, bufferOrchestrator.length * _circleFlatEdgeCount, _opacity);
|
|
192
269
|
}
|
|
270
|
+
_bigPadding3dFlatProgram.draw(_bigPadding3dFlatVAO, paddingBufferOrchestrator.length, _opacity);
|
|
193
271
|
gl.enable(gl.DEPTH_TEST);
|
|
194
272
|
}
|
|
195
273
|
|
|
@@ -198,6 +276,8 @@ class RangeRings {
|
|
|
198
276
|
const { globe } = this;
|
|
199
277
|
CircleCache2D.release(globe);
|
|
200
278
|
CircleCache3D.release(globe);
|
|
279
|
+
this.textPlugin?.free();
|
|
280
|
+
// free buffer managers
|
|
201
281
|
this._isFreed = true;
|
|
202
282
|
}
|
|
203
283
|
|
|
@@ -216,18 +296,27 @@ class RangeRings {
|
|
|
216
296
|
*/
|
|
217
297
|
|
|
218
298
|
this._ringAccount.updateCentersXY(items);
|
|
219
|
-
const { globe,
|
|
299
|
+
const { globe,
|
|
300
|
+
bufferOrchestrator, bufferManagersCompMap,
|
|
301
|
+
paddingBufferOrchestrator, bufferManagersCompMapPadding
|
|
302
|
+
} = this;
|
|
220
303
|
for (const { centerID } of items) {
|
|
221
|
-
const datas = this.
|
|
304
|
+
const datas = this.__reconstructCentralRings(centerID);
|
|
222
305
|
// TODO add big paddings when when implemented
|
|
223
|
-
bufferOrchestrator.updateBulk(datas, bufferManagersCompMap, ["centerCoords3d", "centerCoords2dflat",
|
|
306
|
+
bufferOrchestrator.updateBulk(datas, bufferManagersCompMap, ["centerCoords3d", "centerCoords2dflat", "centerCoords2dflatForPadding"]);
|
|
307
|
+
const paddingDatas = this.__reconstructCentralRingsBigPaddings(centerID);
|
|
308
|
+
paddingBufferOrchestrator.updateBulk(paddingDatas, bufferManagersCompMapPadding, ["circlePoint", "paddingPoint", "circlePoint3d", "paddingPoint3d"]);
|
|
224
309
|
}
|
|
310
|
+
this.textPlugin?.updateCentersXY(items);
|
|
311
|
+
|
|
312
|
+
|
|
313
|
+
|
|
225
314
|
globe.DrawRender();
|
|
226
315
|
}
|
|
227
316
|
|
|
228
317
|
/**
|
|
229
318
|
* @method insertBulk
|
|
230
|
-
* @typedef { Array < { ringID, radius,
|
|
319
|
+
* @typedef { Array < { ringID, radius, padding } >} rings
|
|
231
320
|
* @param { Array < centerID: string, x: number, y: number, stepAngle: number, rgba: [4 numbers], rings: rings, hide, textHide } items
|
|
232
321
|
*/
|
|
233
322
|
insertBulk(items) {
|
|
@@ -239,22 +328,28 @@ class RangeRings {
|
|
|
239
328
|
* 3. insert new centerRings to centerRingAccount
|
|
240
329
|
* 4. insert new keys with buffer orchestators
|
|
241
330
|
*/
|
|
242
|
-
const { globe, _ringAccount, bufferOrchestrator, bufferManagersCompMap } = this;
|
|
331
|
+
const { globe, _ringAccount, bufferOrchestrator, bufferManagersCompMap, paddingBufferOrchestrator, bufferManagersCompMapPadding } = this;
|
|
243
332
|
// TODO add delete existing for padding
|
|
244
333
|
for (const item of items) {
|
|
245
334
|
const existingKeys = _ringAccount.ringKeys(item.centerID);
|
|
246
335
|
if (existingKeys.length) {
|
|
247
336
|
bufferOrchestrator.deleteBulk(existingKeys, bufferManagersCompMap);
|
|
248
337
|
}
|
|
338
|
+
const paddingKeys = _ringAccount.ringBigPaddingKeys(item.centerID);
|
|
339
|
+
if (paddingKeys.length) {
|
|
340
|
+
paddingBufferOrchestrator.deleteBulk(paddingKeys, bufferManagersCompMapPadding);
|
|
341
|
+
}
|
|
249
342
|
}
|
|
250
343
|
|
|
251
344
|
for (const item of items) {
|
|
252
345
|
_ringAccount.insertCenter(item);
|
|
253
|
-
const datas = this.
|
|
346
|
+
const datas = this.__reconstructCentralRings(item.centerID);
|
|
254
347
|
bufferOrchestrator.insertBulk(datas, bufferManagersCompMap,);
|
|
348
|
+
const paddingDatas = this.__reconstructCentralRingsBigPaddings(item.centerID);
|
|
349
|
+
paddingBufferOrchestrator.insertBulk(paddingDatas, bufferManagersCompMapPadding);
|
|
255
350
|
}
|
|
256
351
|
|
|
257
|
-
|
|
352
|
+
this.textPlugin?.insertBulk(items);
|
|
258
353
|
globe.DrawRender();
|
|
259
354
|
|
|
260
355
|
}
|
|
@@ -273,10 +368,15 @@ class RangeRings {
|
|
|
273
368
|
* 3. update buffer orchestators
|
|
274
369
|
*/
|
|
275
370
|
this._ringAccount.updateCentersColor(centerColors);
|
|
276
|
-
const { globe,
|
|
371
|
+
const { globe,
|
|
372
|
+
bufferOrchestrator, bufferManagersCompMap,
|
|
373
|
+
paddingBufferOrchestrator, bufferManagersCompMapPadding
|
|
374
|
+
} = this;
|
|
277
375
|
for (const { centerID } of centerColors) {
|
|
278
|
-
const datas = this.
|
|
376
|
+
const datas = this.__reconstructCentralProperties(centerID);
|
|
279
377
|
bufferOrchestrator.updateBulk(datas, bufferManagersCompMap, ["rgba", "rgbaMercator"]);
|
|
378
|
+
const paddingDatas = this.__reconstructCentralPaddingProperties(centerID)
|
|
379
|
+
paddingBufferOrchestrator.updateBulk(paddingDatas, bufferManagersCompMapPadding, ["rgba"]);
|
|
280
380
|
}
|
|
281
381
|
globe.DrawRender();
|
|
282
382
|
}
|
|
@@ -293,9 +393,21 @@ class RangeRings {
|
|
|
293
393
|
* 2. reconstruct data,
|
|
294
394
|
* 3. update color buffer
|
|
295
395
|
* */
|
|
396
|
+
this._ringAccount.updateCentersHide(centerHides);
|
|
397
|
+
const { globe,
|
|
398
|
+
bufferOrchestrator, bufferManagersCompMap,
|
|
399
|
+
paddingBufferOrchestrator, bufferManagersCompMapPadding
|
|
400
|
+
} = this;
|
|
401
|
+
|
|
402
|
+
for (const { centerID } of centerHides) {
|
|
403
|
+
const datas = this.__reconstructCentralProperties(centerID);
|
|
404
|
+
bufferOrchestrator.updateBulk(datas, bufferManagersCompMap, ["rgba", "rgbaMercator"]);
|
|
405
|
+
const paddingDatas = this.__reconstructCentralPaddingProperties(centerID)
|
|
406
|
+
paddingBufferOrchestrator.updateBulk(paddingDatas, bufferManagersCompMapPadding, ["rgba"]);
|
|
407
|
+
}
|
|
296
408
|
|
|
297
|
-
|
|
298
|
-
|
|
409
|
+
this.textPlugin?.updateCentersHide(centerHides);
|
|
410
|
+
globe.DrawRender();
|
|
299
411
|
/**
|
|
300
412
|
* Complicated
|
|
301
413
|
* 1. ask centerRingAccount for existing rings HIDE KEYS
|
|
@@ -315,13 +427,24 @@ class RangeRings {
|
|
|
315
427
|
* 2. delete from buffer orchestators
|
|
316
428
|
* 3. delete from centerRingAccount
|
|
317
429
|
*/
|
|
318
|
-
const { globe,
|
|
430
|
+
const { globe,
|
|
431
|
+
bufferOrchestrator, bufferManagersCompMap,
|
|
432
|
+
paddingBufferOrchestrator, bufferManagersCompMapPadding,
|
|
433
|
+
_ringAccount } = this;
|
|
319
434
|
for (const centerID of centerIDs) {
|
|
320
435
|
const existingKeys = _ringAccount.ringKeys(centerID);
|
|
321
436
|
if (existingKeys.length) {
|
|
322
437
|
bufferOrchestrator.deleteBulk(existingKeys, bufferManagersCompMap);
|
|
323
438
|
}
|
|
324
439
|
}
|
|
440
|
+
|
|
441
|
+
for (const centerID of centerIDs) {
|
|
442
|
+
const paddingKeys = _ringAccount.ringBigPaddingKeys(centerID);
|
|
443
|
+
if (paddingKeys.length) {
|
|
444
|
+
paddingBufferOrchestrator.deleteBulk(paddingKeys, bufferManagersCompMapPadding);
|
|
445
|
+
}
|
|
446
|
+
}
|
|
447
|
+
this.textPlugin?.removeCenters(centerIDs);
|
|
325
448
|
globe.DrawRender();
|
|
326
449
|
}
|
|
327
450
|
|
|
@@ -329,9 +452,11 @@ class RangeRings {
|
|
|
329
452
|
* @method setOpacity @param { number } opacity
|
|
330
453
|
*/
|
|
331
454
|
setOpacity(opacity) {
|
|
455
|
+
console.log("opacity", opacity, typeof opacity);
|
|
332
456
|
if (typeof opacity !== "number" || opacity < 0 || opacity > 1) throw new Error("Invalid opacity value");
|
|
333
457
|
this._opacity = opacity;
|
|
334
|
-
this.
|
|
458
|
+
this.textPlugin?.setOpacity(opacity);
|
|
459
|
+
this.globe.DrawRender();
|
|
335
460
|
}
|
|
336
461
|
|
|
337
462
|
|
|
@@ -353,8 +478,37 @@ class RangeRings {
|
|
|
353
478
|
// }
|
|
354
479
|
}
|
|
355
480
|
|
|
481
|
+
__reconstructCentralRingsBigPaddings(centerID) {
|
|
482
|
+
const { globe, _circleFlatEdgeCount } = this;
|
|
483
|
+
const centerItem = this._ringAccount.getCenter(centerID);
|
|
484
|
+
if (centerItem === undefined) throw new Error("Center not found");
|
|
485
|
+
const findPointByPolar = globe.Math.FindPointByPolar;
|
|
486
|
+
const { x, y, stepAngle, rgba, rings, hide = 0, textHide = 0 } = centerItem;
|
|
487
|
+
const result = [];
|
|
488
|
+
const color = hide === 1 ? new Float32Array([0, 0, 0, 0]) : new Float32Array(rgba)
|
|
489
|
+
for (const { ringID, radius, padding } of rings) {
|
|
490
|
+
let azimuthAngle = 0;
|
|
491
|
+
while (azimuthAngle < 360) {
|
|
492
|
+
const circlePoint = globe.Math.FindPointByPolar(x, y, radius, azimuthAngle); // long lat
|
|
493
|
+
const paddingPoint = globe.Math.FindPointByPolar(x, y, radius - padding, azimuthAngle); // long lat
|
|
494
|
+
result.push({
|
|
495
|
+
key: ringBigPaddingKeyMethod(centerID, ringID, azimuthAngle),
|
|
496
|
+
circlePoint: new Float32Array(globe.api_GetMercator2DPoint(circlePoint.long, circlePoint.lat)),
|
|
497
|
+
paddingPoint: new Float32Array(globe.api_GetMercator2DPoint(paddingPoint.long, paddingPoint.lat)),
|
|
498
|
+
circlePoint3d: new Float32Array(globe.api_GetCartesian3DPoint(circlePoint.long, circlePoint.lat, 0, 0)),
|
|
499
|
+
paddingPoint3d: new Float32Array(globe.api_GetCartesian3DPoint(paddingPoint.long, paddingPoint.lat, 0, 0)),
|
|
500
|
+
rgba: color,
|
|
501
|
+
hide,
|
|
502
|
+
textHide
|
|
503
|
+
});
|
|
504
|
+
azimuthAngle += stepAngle;
|
|
505
|
+
|
|
506
|
+
}
|
|
507
|
+
}
|
|
508
|
+
return result;
|
|
509
|
+
}
|
|
356
510
|
|
|
357
|
-
|
|
511
|
+
__reconstructCentralRings(centerID) {
|
|
358
512
|
const { globe, _circleFlatEdgeCount } = this;
|
|
359
513
|
const centerItem = this._ringAccount.getCenter(centerID);
|
|
360
514
|
if (centerItem === undefined) throw new Error("Center not found");
|
|
@@ -367,18 +521,18 @@ class RangeRings {
|
|
|
367
521
|
|
|
368
522
|
const result = [];
|
|
369
523
|
|
|
370
|
-
for (const { ringID, radius,
|
|
524
|
+
for (const { ringID, radius, padding } of rings) {
|
|
371
525
|
const key = ringKeyMethod(centerID, ringID);
|
|
372
526
|
const centerCoords2dflat = centerCoords2dflatDataCreatorWithRadius(globe, x, y, radius, { edgeCount: _circleFlatEdgeCount });
|
|
373
|
-
|
|
527
|
+
const centerCoords2dflatForPadding = centerCoords2dflatDataCreatorWithRadius(globe, x, y, radius - padding / 3, { edgeCount: _circleFlatEdgeCount });
|
|
374
528
|
result.push({
|
|
375
529
|
key,
|
|
376
530
|
centerCoords3d,
|
|
377
531
|
centerCoords2dflat,
|
|
378
532
|
radius,
|
|
379
|
-
|
|
533
|
+
padding,
|
|
380
534
|
rgba,
|
|
381
|
-
|
|
535
|
+
centerCoords2dflatForPadding,
|
|
382
536
|
hide,
|
|
383
537
|
textHide
|
|
384
538
|
});
|
|
@@ -387,7 +541,26 @@ class RangeRings {
|
|
|
387
541
|
|
|
388
542
|
}
|
|
389
543
|
|
|
390
|
-
|
|
544
|
+
__reconstructCentralPaddingProperties(centerID) {
|
|
545
|
+
const centerItem = this._ringAccount.getCenter(centerID);
|
|
546
|
+
if (centerItem === undefined) throw new Error("Center not found");
|
|
547
|
+
const { x, y, stepAngle, rgba, rings, hide = 0, textHide = 0 } = centerItem;
|
|
548
|
+
const result = [];
|
|
549
|
+
for (const { ringID, } of rings) {
|
|
550
|
+
let angle = 0;
|
|
551
|
+
while (angle < 360) {
|
|
552
|
+
result.push({
|
|
553
|
+
key: ringBigPaddingKeyMethod(centerID, ringID, angle),
|
|
554
|
+
rgba: hide === 1 ? new Float32Array([0, 0, 0, 0]) : rgba,
|
|
555
|
+
textHide
|
|
556
|
+
});
|
|
557
|
+
angle += stepAngle;
|
|
558
|
+
}
|
|
559
|
+
}
|
|
560
|
+
return result;
|
|
561
|
+
}
|
|
562
|
+
|
|
563
|
+
__reconstructCentralProperties(centerID) {
|
|
391
564
|
const centerItem = this._ringAccount.getCenter(centerID);
|
|
392
565
|
if (centerItem === undefined) throw new Error("Center not found");
|
|
393
566
|
const { rgba, rings, hide = 0, textHide = 0 } = centerItem;
|
|
@@ -396,8 +569,7 @@ class RangeRings {
|
|
|
396
569
|
const key = ringKeyMethod(centerID, ringID);
|
|
397
570
|
result.push({
|
|
398
571
|
key,
|
|
399
|
-
rgba,
|
|
400
|
-
hide,
|
|
572
|
+
rgba: hide === 1 ? new Float32Array([0, 0, 0, 0]) : rgba,
|
|
401
573
|
textHide
|
|
402
574
|
});
|
|
403
575
|
}
|
|
@@ -326,7 +326,7 @@ export default class RangeRingAngleText {
|
|
|
326
326
|
this.__realCoords(long, lat, radius, step, centerID, outBucket);
|
|
327
327
|
} else if (currentCompassMode == COMPASS_MODES.COMPASS) {
|
|
328
328
|
// throw new Error("Not implemented yet");
|
|
329
|
-
this.__compassCoords(long, lat, radius, step, centerID, outBucket);
|
|
329
|
+
// this.__compassCoords(long, lat, radius, step, centerID, outBucket);
|
|
330
330
|
}
|
|
331
331
|
|
|
332
332
|
}
|
|
@@ -334,7 +334,7 @@ export default class RangeRingAngleText {
|
|
|
334
334
|
__realCoords(long, lat, radius, stepAngle, centerID, outBucket) {
|
|
335
335
|
const { coords, coordsZ, attribs } = outBucket;
|
|
336
336
|
|
|
337
|
-
const coords_ = realCircle(long, lat, radius, stepAngle
|
|
337
|
+
const coords_ = realCircle(this.globe, long, lat, radius, stepAngle);
|
|
338
338
|
{ // add 0
|
|
339
339
|
const { long, lat } = coords_[0];
|
|
340
340
|
coords.push(long, lat);
|
|
@@ -356,7 +356,7 @@ export default class RangeRingAngleText {
|
|
|
356
356
|
// fidkey is the key
|
|
357
357
|
attribs.push({
|
|
358
358
|
"__fid__": key,
|
|
359
|
-
"aci": aci.toString()
|
|
359
|
+
"aci": (360 - aci).toString()
|
|
360
360
|
})
|
|
361
361
|
aci += stepAngle;
|
|
362
362
|
}
|
|
@@ -474,16 +474,13 @@ const flatCircle = (longitude, latitude, radius, paddingAngles) => {
|
|
|
474
474
|
return points;
|
|
475
475
|
}
|
|
476
476
|
|
|
477
|
-
const realCircle = (longitude, latitude, radius, stepAngle) => {
|
|
478
|
-
const
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
points.push({ long: Degree * x, lat: Degree * y });
|
|
487
|
-
}
|
|
488
|
-
return points;
|
|
477
|
+
const realCircle = (globe, longitude, latitude, radius, stepAngle) => {
|
|
478
|
+
const pointsLongLat = globe.Math.GetEllipseGeo(
|
|
479
|
+
longitude,
|
|
480
|
+
latitude,
|
|
481
|
+
radius,
|
|
482
|
+
radius,
|
|
483
|
+
0,
|
|
484
|
+
stepAngle);
|
|
485
|
+
return pointsLongLat;
|
|
489
486
|
}
|
|
@@ -27,7 +27,15 @@ class RingAccount {
|
|
|
27
27
|
*
|
|
28
28
|
*/
|
|
29
29
|
insertCenter(centeralItem) {
|
|
30
|
-
this._centeralMap.set(centeralItem.centerID,
|
|
30
|
+
this._centeralMap.set(centeralItem.centerID, {
|
|
31
|
+
x: centeralItem.x,
|
|
32
|
+
y: centeralItem.y,
|
|
33
|
+
rings: centeralItem.rings,
|
|
34
|
+
rgba: new Float32Array(centeralItem.rgba),
|
|
35
|
+
hide: centeralItem.hide,
|
|
36
|
+
textHide: centeralItem.textHide,
|
|
37
|
+
stepAngle: centeralItem.stepAngle
|
|
38
|
+
});
|
|
31
39
|
}
|
|
32
40
|
|
|
33
41
|
|
|
@@ -45,6 +53,17 @@ class RingAccount {
|
|
|
45
53
|
}
|
|
46
54
|
}
|
|
47
55
|
|
|
56
|
+
updateCentersHide(items) {
|
|
57
|
+
for (const { centerID, hide = null, textHide = null } of items) {
|
|
58
|
+
const center = this.getCenter(centerID);
|
|
59
|
+
if (center) {
|
|
60
|
+
if (hide) center.hide = hide;
|
|
61
|
+
if (textHide) center.textHide = textHide;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
|
|
48
67
|
/**
|
|
49
68
|
*
|
|
50
69
|
* @param {Array<{centerID, rgba}>} centersColor
|
|
@@ -53,7 +72,7 @@ class RingAccount {
|
|
|
53
72
|
for (const { centerID, rgba } of centersColor) {
|
|
54
73
|
const center = this.getCenter(centerID);
|
|
55
74
|
if (center) {
|
|
56
|
-
center.rgba = rgba;
|
|
75
|
+
center.rgba = new Float32Array(rgba);
|
|
57
76
|
}
|
|
58
77
|
}
|
|
59
78
|
}
|
|
@@ -75,7 +94,7 @@ class RingAccount {
|
|
|
75
94
|
ringBigPaddingKeys(centerID) {
|
|
76
95
|
const result = [];
|
|
77
96
|
const center = this.getCenter(centerID);
|
|
78
|
-
if (!center) return;
|
|
97
|
+
if (!center) return [];
|
|
79
98
|
const { rings, stepAngle } = center;
|
|
80
99
|
for (const { ringID } of rings) {
|
|
81
100
|
let angle = 0;
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
// TODO: Implement compass rose in 2D
|
|
2
|
-
// TODO: enrich cameraBlockTotem with globe tile and more...
|
|
3
|
-
|
|
4
|
-
const vertexShader = `#version 300 es
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
in vec2 center;
|
|
8
|
-
in float pixel_radius;
|
|
9
|
-
in vec4 color;
|
|
10
|
-
out vec4 v_color;
|
|
11
|
-
void main() {
|
|
12
|
-
const float PI = 3.14159265359;
|
|
13
|
-
float angle = float(gl_VertexID) / 180.0 * PI;
|
|
14
|
-
vec2 limp = vec2(
|
|
15
|
-
|
|
16
|
-
)
|
|
17
|
-
vec2 position =
|
|
18
|
-
v_color = color;
|
|
19
|
-
}
|
|
20
|
-
`;
|
|
21
|
-
|
|
22
|
-
const fragmentShader = `#version 300 es
|
|
23
|
-
precision mediump float;
|
|
24
|
-
in vec4 v_color;
|
|
25
|
-
out vec4 outColor;
|
|
26
|
-
void main() {
|
|
27
|
-
outColor = v_color;
|
|
28
|
-
}
|
|
29
|
-
`;
|