@antv/l7-map 2.9.33 → 2.9.35
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/lib/camera.js +766 -508
- package/lib/earthmap.js +389 -223
- package/lib/geo/edge_insets.js +117 -64
- package/lib/geo/lng_lat.js +86 -65
- package/lib/geo/lng_lat_bounds.js +162 -123
- package/lib/geo/mercator.js +91 -62
- package/lib/geo/point.js +234 -171
- package/lib/geo/simple.js +93 -61
- package/lib/geo/transform.js +982 -472
- package/lib/handler/IHandler.js +4 -16
- package/lib/handler/blockable_map_event.js +84 -63
- package/lib/handler/box_zoom.js +201 -123
- package/lib/handler/click_zoom.js +63 -55
- package/lib/handler/events/event.js +20 -35
- package/lib/handler/events/index.js +28 -35
- package/lib/handler/events/map_mouse_event.js +85 -42
- package/lib/handler/events/map_touch_event.js +116 -45
- package/lib/handler/events/map_wheel_event.js +70 -34
- package/lib/handler/events/render_event.js +50 -31
- package/lib/handler/handler_inertia.js +158 -114
- package/lib/handler/handler_manager.js +640 -381
- package/lib/handler/handler_util.js +11 -29
- package/lib/handler/keyboard.js +155 -114
- package/lib/handler/map_event.js +133 -84
- package/lib/handler/mouse/index.js +28 -35
- package/lib/handler/mouse/mouse_handler.js +126 -90
- package/lib/handler/mouse/mousepan_handler.js +64 -46
- package/lib/handler/mouse/mousepitch_hander.js +64 -44
- package/lib/handler/mouse/mouserotate_hander.js +64 -44
- package/lib/handler/mouse/util.js +22 -40
- package/lib/handler/scroll_zoom.js +318 -176
- package/lib/handler/shim/dblclick_zoom.js +76 -42
- package/lib/handler/shim/drag_pan.js +98 -48
- package/lib/handler/shim/drag_rotate.js +82 -43
- package/lib/handler/shim/touch_zoom_rotate.js +127 -59
- package/lib/handler/tap/single_tap_recognizer.js +113 -84
- package/lib/handler/tap/tap_drag_zoom.js +111 -93
- package/lib/handler/tap/tap_recognizer.js +72 -60
- package/lib/handler/tap/tap_zoom.js +113 -88
- package/lib/handler/touch/index.js +36 -38
- package/lib/handler/touch/touch_pan.js +126 -98
- package/lib/handler/touch/touch_pitch.js +108 -74
- package/lib/handler/touch/touch_rotate.js +93 -59
- package/lib/handler/touch/touch_zoom.js +71 -49
- package/lib/handler/touch/two_touch.js +129 -90
- package/lib/hash.js +149 -100
- package/lib/index.js +43 -20
- package/lib/interface.js +4 -16
- package/lib/map.js +420 -240
- package/lib/util.js +88 -69
- package/lib/utils/Aabb.js +134 -81
- package/lib/utils/dom.js +162 -88
- package/lib/utils/performance.js +46 -54
- package/lib/utils/primitives.js +53 -59
- package/lib/utils/task_queue.js +104 -61
- package/package.json +3 -3
package/lib/geo/transform.js
CHANGED
|
@@ -1,503 +1,1013 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
-
};
|
|
11
|
-
var __copyProps = (to, from, except, desc) => {
|
|
12
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
-
for (let key of __getOwnPropNames(from))
|
|
14
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
-
}
|
|
17
|
-
return to;
|
|
18
|
-
};
|
|
19
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
|
-
|
|
22
|
-
// src/geo/transform.ts
|
|
23
|
-
var transform_exports = {};
|
|
24
|
-
__export(transform_exports, {
|
|
25
|
-
EXTENT: () => EXTENT,
|
|
26
|
-
default: () => Transform
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
27
9
|
});
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
var
|
|
31
|
-
|
|
32
|
-
var
|
|
33
|
-
|
|
34
|
-
var
|
|
35
|
-
|
|
36
|
-
var
|
|
10
|
+
exports.default = exports.EXTENT = void 0;
|
|
11
|
+
|
|
12
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
13
|
+
|
|
14
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
15
|
+
|
|
16
|
+
var _l7Utils = require("@antv/l7-utils");
|
|
17
|
+
|
|
18
|
+
var _glMatrix = require("gl-matrix");
|
|
19
|
+
|
|
20
|
+
var _point = _interopRequireDefault(require("../geo/point"));
|
|
21
|
+
|
|
22
|
+
var _util = require("../util");
|
|
23
|
+
|
|
24
|
+
var _edge_insets = _interopRequireDefault(require("./edge_insets"));
|
|
25
|
+
|
|
26
|
+
var _lng_lat = _interopRequireDefault(require("./lng_lat"));
|
|
27
|
+
|
|
28
|
+
var _lng_lat_bounds = _interopRequireDefault(require("./lng_lat_bounds"));
|
|
29
|
+
|
|
30
|
+
var _mercator = _interopRequireWildcard(require("./mercator"));
|
|
31
|
+
|
|
32
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
33
|
+
|
|
34
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
35
|
+
|
|
36
|
+
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
37
|
+
|
|
38
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
39
|
+
|
|
40
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
41
|
+
|
|
37
42
|
var EXTENT = 8192;
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
this.
|
|
48
|
-
}
|
|
49
|
-
get maxZoom() {
|
|
50
|
-
return this._maxZoom;
|
|
51
|
-
}
|
|
52
|
-
set maxZoom(zoom) {
|
|
53
|
-
if (this._maxZoom === zoom) {
|
|
54
|
-
return;
|
|
55
|
-
}
|
|
56
|
-
this._maxZoom = zoom;
|
|
57
|
-
this.zoom = Math.min(this.zoom, zoom);
|
|
58
|
-
}
|
|
59
|
-
get minPitch() {
|
|
60
|
-
return this._minPitch;
|
|
61
|
-
}
|
|
62
|
-
set minPitch(pitch) {
|
|
63
|
-
if (this._minPitch === pitch) {
|
|
64
|
-
return;
|
|
65
|
-
}
|
|
66
|
-
this._minPitch = pitch;
|
|
67
|
-
this._pitch = Math.max(this._pitch, pitch);
|
|
68
|
-
}
|
|
69
|
-
get maxPitch() {
|
|
70
|
-
return this._maxPitch;
|
|
71
|
-
}
|
|
72
|
-
set maxPitch(pitch) {
|
|
73
|
-
if (this._maxPitch === pitch) {
|
|
74
|
-
return;
|
|
75
|
-
}
|
|
76
|
-
this._maxPitch = pitch;
|
|
77
|
-
this._pitch = Math.min(this._pitch, pitch);
|
|
78
|
-
}
|
|
79
|
-
get renderWorldCopies() {
|
|
80
|
-
return this._renderWorldCopies;
|
|
81
|
-
}
|
|
82
|
-
set renderWorldCopies(renderWorldCopies) {
|
|
83
|
-
if (renderWorldCopies === void 0) {
|
|
84
|
-
renderWorldCopies = true;
|
|
85
|
-
} else if (renderWorldCopies === null) {
|
|
86
|
-
renderWorldCopies = false;
|
|
87
|
-
}
|
|
88
|
-
this._renderWorldCopies = renderWorldCopies;
|
|
89
|
-
}
|
|
90
|
-
get worldSize() {
|
|
91
|
-
return this.tileSize * this.scale;
|
|
92
|
-
}
|
|
93
|
-
get centerOffset() {
|
|
94
|
-
return this.centerPoint._sub(this.size._div(2));
|
|
95
|
-
}
|
|
96
|
-
get size() {
|
|
97
|
-
return new import_point.default(this.width, this.height);
|
|
98
|
-
}
|
|
99
|
-
get bearing() {
|
|
100
|
-
return -this.angle / Math.PI * 180;
|
|
101
|
-
}
|
|
102
|
-
set bearing(bearing) {
|
|
103
|
-
const b = -(0, import_util.wrap)(bearing, -180, 180) * Math.PI / 180;
|
|
104
|
-
if (this.angle === b) {
|
|
105
|
-
return;
|
|
106
|
-
}
|
|
107
|
-
this.unmodified = false;
|
|
108
|
-
this.angle = b;
|
|
109
|
-
this.calcMatrices();
|
|
110
|
-
this.rotationMatrix = import_gl_matrix.mat2.create();
|
|
111
|
-
import_gl_matrix.mat2.rotate(this.rotationMatrix, this.rotationMatrix, this.angle);
|
|
112
|
-
}
|
|
113
|
-
get pitch() {
|
|
114
|
-
return this._pitch / Math.PI * 180;
|
|
115
|
-
}
|
|
116
|
-
set pitch(pitch) {
|
|
117
|
-
const p = (0, import_util.clamp)(pitch, this._minPitch, this._maxPitch) / 180 * Math.PI;
|
|
118
|
-
if (this._pitch === p) {
|
|
119
|
-
return;
|
|
120
|
-
}
|
|
121
|
-
this.unmodified = false;
|
|
122
|
-
this._pitch = p;
|
|
123
|
-
this.calcMatrices();
|
|
124
|
-
}
|
|
125
|
-
get fov() {
|
|
126
|
-
return this._fov / Math.PI * 180;
|
|
127
|
-
}
|
|
128
|
-
set fov(fov) {
|
|
129
|
-
fov = Math.max(0.01, Math.min(60, fov));
|
|
130
|
-
if (this._fov === fov) {
|
|
131
|
-
return;
|
|
132
|
-
}
|
|
133
|
-
this.unmodified = false;
|
|
134
|
-
this._fov = fov / 180 * Math.PI;
|
|
135
|
-
this.calcMatrices();
|
|
136
|
-
}
|
|
137
|
-
get zoom() {
|
|
138
|
-
return this._zoom;
|
|
139
|
-
}
|
|
140
|
-
set zoom(zoom) {
|
|
141
|
-
const z = Math.min(Math.max(zoom, this._minZoom), this._maxZoom);
|
|
142
|
-
if (this._zoom === z) {
|
|
143
|
-
return;
|
|
144
|
-
}
|
|
145
|
-
this.unmodified = false;
|
|
146
|
-
this._zoom = z;
|
|
147
|
-
this.scale = this.zoomScale(z);
|
|
148
|
-
this.tileZoom = Math.floor(z);
|
|
149
|
-
this.zoomFraction = z - this.tileZoom;
|
|
150
|
-
this.constrain();
|
|
151
|
-
this.calcMatrices();
|
|
152
|
-
}
|
|
153
|
-
get center() {
|
|
154
|
-
return this._center;
|
|
155
|
-
}
|
|
156
|
-
set center(center) {
|
|
157
|
-
if (center.lat === this._center.lat && center.lng === this._center.lng) {
|
|
158
|
-
return;
|
|
159
|
-
}
|
|
160
|
-
this.unmodified = false;
|
|
161
|
-
this._center = center;
|
|
162
|
-
this.constrain();
|
|
163
|
-
this.calcMatrices();
|
|
164
|
-
}
|
|
165
|
-
get padding() {
|
|
166
|
-
return this.edgeInsets.toJSON();
|
|
167
|
-
}
|
|
168
|
-
set padding(padding) {
|
|
169
|
-
if (this.edgeInsets.equals(padding)) {
|
|
170
|
-
return;
|
|
171
|
-
}
|
|
172
|
-
this.unmodified = false;
|
|
173
|
-
this.edgeInsets.interpolate(this.edgeInsets, padding, 1);
|
|
174
|
-
this.calcMatrices();
|
|
175
|
-
}
|
|
176
|
-
get centerPoint() {
|
|
177
|
-
return this.edgeInsets.getCenter(this.width, this.height);
|
|
178
|
-
}
|
|
179
|
-
get point() {
|
|
180
|
-
return this.project(this.center);
|
|
181
|
-
}
|
|
182
|
-
constructor(minZoom, maxZoom, minPitch, maxPitch, renderWorldCopies) {
|
|
183
|
-
this.tileSize = 512;
|
|
184
|
-
this.maxValidLatitude = 85.051129;
|
|
185
|
-
this._renderWorldCopies = renderWorldCopies === void 0 ? true : renderWorldCopies;
|
|
43
|
+
exports.EXTENT = EXTENT;
|
|
44
|
+
|
|
45
|
+
var Transform = /*#__PURE__*/function () {
|
|
46
|
+
function Transform(minZoom, maxZoom, minPitch, maxPitch, renderWorldCopies) {
|
|
47
|
+
(0, _classCallCheck2.default)(this, Transform);
|
|
48
|
+
this.tileSize = 512; // constant
|
|
49
|
+
|
|
50
|
+
this.maxValidLatitude = 85.051129; // constant
|
|
51
|
+
|
|
52
|
+
this._renderWorldCopies = renderWorldCopies === undefined ? true : renderWorldCopies;
|
|
186
53
|
this._minZoom = minZoom || 0;
|
|
187
54
|
this._maxZoom = maxZoom || 22;
|
|
188
|
-
this._minPitch = minPitch ===
|
|
189
|
-
this._maxPitch = maxPitch ===
|
|
55
|
+
this._minPitch = minPitch === undefined || minPitch === null ? 0 : minPitch;
|
|
56
|
+
this._maxPitch = maxPitch === undefined || maxPitch === null ? 60 : maxPitch;
|
|
190
57
|
this.setMaxBounds();
|
|
191
58
|
this.width = 0;
|
|
192
59
|
this.height = 0;
|
|
193
|
-
this._center = new
|
|
60
|
+
this._center = new _lng_lat.default(0, 0);
|
|
194
61
|
this.zoom = 0;
|
|
195
62
|
this.angle = 0;
|
|
196
63
|
this._fov = 0.6435011087932844;
|
|
197
64
|
this._pitch = 0;
|
|
198
65
|
this.unmodified = true;
|
|
199
|
-
this.edgeInsets = new
|
|
66
|
+
this.edgeInsets = new _edge_insets.default();
|
|
200
67
|
this.posMatrixCache = {};
|
|
201
68
|
this.alignedPosMatrixCache = {};
|
|
202
69
|
}
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
clone.calcMatrices();
|
|
217
|
-
return clone;
|
|
218
|
-
}
|
|
219
|
-
isPaddingEqual(padding) {
|
|
220
|
-
return this.edgeInsets.equals(padding);
|
|
221
|
-
}
|
|
222
|
-
interpolatePadding(start, target, t) {
|
|
223
|
-
this.unmodified = false;
|
|
224
|
-
this.edgeInsets.interpolate(start, target, t);
|
|
225
|
-
this.constrain();
|
|
226
|
-
this.calcMatrices();
|
|
227
|
-
}
|
|
228
|
-
coveringZoomLevel(options) {
|
|
229
|
-
const z = (options.roundZoom ? Math.round : Math.floor)(this.zoom + this.scaleZoom(this.tileSize / options.tileSize));
|
|
230
|
-
return Math.max(0, z);
|
|
231
|
-
}
|
|
232
|
-
resize(width, height) {
|
|
233
|
-
this.width = width;
|
|
234
|
-
this.height = height;
|
|
235
|
-
this.pixelsToGLUnits = [2 / width, -2 / height];
|
|
236
|
-
this.constrain();
|
|
237
|
-
this.calcMatrices();
|
|
238
|
-
}
|
|
239
|
-
zoomScale(zoom) {
|
|
240
|
-
return Math.pow(2, zoom);
|
|
241
|
-
}
|
|
242
|
-
scaleZoom(scale) {
|
|
243
|
-
return Math.log(scale) / Math.LN2;
|
|
244
|
-
}
|
|
245
|
-
project(lnglat) {
|
|
246
|
-
const lat = (0, import_util.clamp)(lnglat.lat, -this.maxValidLatitude, this.maxValidLatitude);
|
|
247
|
-
return new import_point.default((0, import_mercator.mercatorXfromLng)(lnglat.lng) * this.worldSize, (0, import_mercator.mercatorYfromLat)(lat) * this.worldSize);
|
|
248
|
-
}
|
|
249
|
-
unproject(point) {
|
|
250
|
-
return new import_mercator.default(point.x / this.worldSize, point.y / this.worldSize).toLngLat();
|
|
251
|
-
}
|
|
252
|
-
setLocationAtPoint(lnglat, point) {
|
|
253
|
-
const a = this.pointCoordinate(point);
|
|
254
|
-
const b = this.pointCoordinate(this.centerPoint);
|
|
255
|
-
const loc = this.locationCoordinate(lnglat);
|
|
256
|
-
const newCenter = new import_mercator.default(loc.x - (a.x - b.x), loc.y - (a.y - b.y));
|
|
257
|
-
this.center = this.coordinateLocation(newCenter);
|
|
258
|
-
if (this._renderWorldCopies) {
|
|
259
|
-
this.center = this.center.wrap();
|
|
70
|
+
|
|
71
|
+
(0, _createClass2.default)(Transform, [{
|
|
72
|
+
key: "minZoom",
|
|
73
|
+
get: function get() {
|
|
74
|
+
return this._minZoom;
|
|
75
|
+
},
|
|
76
|
+
set: function set(zoom) {
|
|
77
|
+
if (this._minZoom === zoom) {
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
this._minZoom = zoom;
|
|
82
|
+
this.zoom = Math.max(this.zoom, zoom);
|
|
260
83
|
}
|
|
261
|
-
}
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
const y1 = coord1[1] / w1;
|
|
274
|
-
const z0 = coord0[2] / w0;
|
|
275
|
-
const z1 = coord1[2] / w1;
|
|
276
|
-
const t = z0 === z1 ? 0 : (targetZ - z0) / (z1 - z0);
|
|
277
|
-
return new import_mercator.default((0, import_util.interpolate)(x0, x1, t) / this.worldSize, (0, import_util.interpolate)(y0, y1, t) / this.worldSize);
|
|
278
|
-
}
|
|
279
|
-
getBounds() {
|
|
280
|
-
return new import_lng_lat_bounds.default().extend(this.pointLocation(new import_point.default(0, 0))).extend(this.pointLocation(new import_point.default(this.width, 0))).extend(this.pointLocation(new import_point.default(this.width, this.height))).extend(this.pointLocation(new import_point.default(0, this.height)));
|
|
281
|
-
}
|
|
282
|
-
getMaxBounds() {
|
|
283
|
-
if (!this.latRange || this.latRange.length !== 2 || !this.lngRange || this.lngRange.length !== 2) {
|
|
284
|
-
return null;
|
|
84
|
+
}, {
|
|
85
|
+
key: "maxZoom",
|
|
86
|
+
get: function get() {
|
|
87
|
+
return this._maxZoom;
|
|
88
|
+
},
|
|
89
|
+
set: function set(zoom) {
|
|
90
|
+
if (this._maxZoom === zoom) {
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
this._maxZoom = zoom;
|
|
95
|
+
this.zoom = Math.min(this.zoom, zoom);
|
|
285
96
|
}
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
97
|
+
}, {
|
|
98
|
+
key: "minPitch",
|
|
99
|
+
get: function get() {
|
|
100
|
+
return this._minPitch;
|
|
101
|
+
},
|
|
102
|
+
set: function set(pitch) {
|
|
103
|
+
if (this._minPitch === pitch) {
|
|
104
|
+
return;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
this._minPitch = pitch;
|
|
108
|
+
this._pitch = Math.max(this._pitch, pitch);
|
|
109
|
+
}
|
|
110
|
+
}, {
|
|
111
|
+
key: "maxPitch",
|
|
112
|
+
get: function get() {
|
|
113
|
+
return this._maxPitch;
|
|
114
|
+
},
|
|
115
|
+
set: function set(pitch) {
|
|
116
|
+
if (this._maxPitch === pitch) {
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
this._maxPitch = pitch;
|
|
121
|
+
this._pitch = Math.min(this._pitch, pitch);
|
|
122
|
+
}
|
|
123
|
+
}, {
|
|
124
|
+
key: "renderWorldCopies",
|
|
125
|
+
get: function get() {
|
|
126
|
+
return this._renderWorldCopies;
|
|
127
|
+
},
|
|
128
|
+
set: function set(renderWorldCopies) {
|
|
129
|
+
if (renderWorldCopies === undefined) {
|
|
130
|
+
renderWorldCopies = true;
|
|
131
|
+
} else if (renderWorldCopies === null) {
|
|
132
|
+
renderWorldCopies = false;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
this._renderWorldCopies = renderWorldCopies;
|
|
136
|
+
}
|
|
137
|
+
}, {
|
|
138
|
+
key: "worldSize",
|
|
139
|
+
get: function get() {
|
|
140
|
+
return this.tileSize * this.scale;
|
|
141
|
+
}
|
|
142
|
+
}, {
|
|
143
|
+
key: "centerOffset",
|
|
144
|
+
get: function get() {
|
|
145
|
+
return this.centerPoint._sub(this.size._div(2));
|
|
146
|
+
}
|
|
147
|
+
}, {
|
|
148
|
+
key: "size",
|
|
149
|
+
get: function get() {
|
|
150
|
+
return new _point.default(this.width, this.height);
|
|
151
|
+
}
|
|
152
|
+
}, {
|
|
153
|
+
key: "bearing",
|
|
154
|
+
get: function get() {
|
|
155
|
+
return -this.angle / Math.PI * 180;
|
|
156
|
+
},
|
|
157
|
+
set: function set(bearing) {
|
|
158
|
+
var b = -(0, _util.wrap)(bearing, -180, 180) * Math.PI / 180;
|
|
159
|
+
|
|
160
|
+
if (this.angle === b) {
|
|
161
|
+
return;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
this.unmodified = false;
|
|
165
|
+
this.angle = b;
|
|
166
|
+
this.calcMatrices(); // 2x2 matrix for rotating points
|
|
167
|
+
|
|
168
|
+
this.rotationMatrix = _glMatrix.mat2.create();
|
|
169
|
+
|
|
170
|
+
_glMatrix.mat2.rotate(this.rotationMatrix, this.rotationMatrix, this.angle);
|
|
171
|
+
}
|
|
172
|
+
}, {
|
|
173
|
+
key: "pitch",
|
|
174
|
+
get: function get() {
|
|
175
|
+
return this._pitch / Math.PI * 180;
|
|
176
|
+
},
|
|
177
|
+
set: function set(pitch) {
|
|
178
|
+
var p = (0, _util.clamp)(pitch, this._minPitch, this._maxPitch) / 180 * Math.PI;
|
|
179
|
+
|
|
180
|
+
if (this._pitch === p) {
|
|
181
|
+
return;
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
this.unmodified = false;
|
|
185
|
+
this._pitch = p;
|
|
186
|
+
this.calcMatrices();
|
|
187
|
+
}
|
|
188
|
+
}, {
|
|
189
|
+
key: "fov",
|
|
190
|
+
get: function get() {
|
|
191
|
+
return this._fov / Math.PI * 180;
|
|
192
|
+
},
|
|
193
|
+
set: function set(fov) {
|
|
194
|
+
fov = Math.max(0.01, Math.min(60, fov));
|
|
195
|
+
|
|
196
|
+
if (this._fov === fov) {
|
|
197
|
+
return;
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
this.unmodified = false;
|
|
201
|
+
this._fov = fov / 180 * Math.PI;
|
|
202
|
+
this.calcMatrices();
|
|
203
|
+
}
|
|
204
|
+
}, {
|
|
205
|
+
key: "zoom",
|
|
206
|
+
get: function get() {
|
|
207
|
+
return this._zoom;
|
|
208
|
+
},
|
|
209
|
+
set: function set(zoom) {
|
|
210
|
+
var z = Math.min(Math.max(zoom, this._minZoom), this._maxZoom);
|
|
211
|
+
|
|
212
|
+
if (this._zoom === z) {
|
|
213
|
+
return;
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
this.unmodified = false;
|
|
217
|
+
this._zoom = z;
|
|
218
|
+
this.scale = this.zoomScale(z);
|
|
219
|
+
this.tileZoom = Math.floor(z);
|
|
220
|
+
this.zoomFraction = z - this.tileZoom;
|
|
292
221
|
this.constrain();
|
|
293
|
-
|
|
294
|
-
this.lngRange = void 0;
|
|
295
|
-
this.latRange = [-this.maxValidLatitude, this.maxValidLatitude];
|
|
222
|
+
this.calcMatrices();
|
|
296
223
|
}
|
|
297
|
-
}
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
const coord = this.pointCoordinate(new import_point.default(0, 0));
|
|
306
|
-
const p = new Float32Array([
|
|
307
|
-
coord.x * this.worldSize,
|
|
308
|
-
coord.y * this.worldSize,
|
|
309
|
-
0,
|
|
310
|
-
1
|
|
311
|
-
]);
|
|
312
|
-
const topPoint = import_gl_matrix.vec4.transformMat4(p, p, this.pixelMatrix);
|
|
313
|
-
return topPoint[3] / this.cameraToCenterDistance;
|
|
314
|
-
}
|
|
315
|
-
getCameraPoint() {
|
|
316
|
-
const pitch = this._pitch;
|
|
317
|
-
const yOffset = Math.tan(pitch) * (this.cameraToCenterDistance || 1);
|
|
318
|
-
return this.centerPoint.add(new import_point.default(0, yOffset));
|
|
319
|
-
}
|
|
320
|
-
getCameraQueryGeometry(queryGeometry) {
|
|
321
|
-
const c = this.getCameraPoint();
|
|
322
|
-
if (queryGeometry.length === 1) {
|
|
323
|
-
return [queryGeometry[0], c];
|
|
324
|
-
} else {
|
|
325
|
-
let minX = c.x;
|
|
326
|
-
let minY = c.y;
|
|
327
|
-
let maxX = c.x;
|
|
328
|
-
let maxY = c.y;
|
|
329
|
-
for (const p of queryGeometry) {
|
|
330
|
-
minX = Math.min(minX, p.x);
|
|
331
|
-
minY = Math.min(minY, p.y);
|
|
332
|
-
maxX = Math.max(maxX, p.x);
|
|
333
|
-
maxY = Math.max(maxY, p.y);
|
|
224
|
+
}, {
|
|
225
|
+
key: "center",
|
|
226
|
+
get: function get() {
|
|
227
|
+
return this._center;
|
|
228
|
+
},
|
|
229
|
+
set: function set(center) {
|
|
230
|
+
if (center.lat === this._center.lat && center.lng === this._center.lng) {
|
|
231
|
+
return;
|
|
334
232
|
}
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
new import_point.default(minX, minY)
|
|
341
|
-
];
|
|
233
|
+
|
|
234
|
+
this.unmodified = false;
|
|
235
|
+
this._center = center;
|
|
236
|
+
this.constrain();
|
|
237
|
+
this.calcMatrices();
|
|
342
238
|
}
|
|
343
|
-
}
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
239
|
+
}, {
|
|
240
|
+
key: "padding",
|
|
241
|
+
get: function get() {
|
|
242
|
+
return this.edgeInsets.toJSON();
|
|
243
|
+
},
|
|
244
|
+
set: function set(padding) {
|
|
245
|
+
if (this.edgeInsets.equals(padding)) {
|
|
246
|
+
return;
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
this.unmodified = false; // Update edge-insets inplace
|
|
250
|
+
|
|
251
|
+
this.edgeInsets.interpolate(this.edgeInsets, padding, 1);
|
|
252
|
+
this.calcMatrices();
|
|
253
|
+
}
|
|
254
|
+
/**
|
|
255
|
+
* The center of the screen in pixels with the top-left corner being (0,0)
|
|
256
|
+
* and +y axis pointing downwards. This accounts for padding.
|
|
257
|
+
*
|
|
258
|
+
* @readonly
|
|
259
|
+
* @type {Point}
|
|
260
|
+
* @memberof Transform
|
|
261
|
+
*/
|
|
262
|
+
|
|
263
|
+
}, {
|
|
264
|
+
key: "centerPoint",
|
|
265
|
+
get: function get() {
|
|
266
|
+
return this.edgeInsets.getCenter(this.width, this.height);
|
|
267
|
+
}
|
|
268
|
+
}, {
|
|
269
|
+
key: "point",
|
|
270
|
+
get: function get() {
|
|
271
|
+
return this.project(this.center);
|
|
272
|
+
}
|
|
273
|
+
}, {
|
|
274
|
+
key: "clone",
|
|
275
|
+
value: function clone() {
|
|
276
|
+
var clone = new Transform(this._minZoom, this._maxZoom, this._minPitch, this._maxPitch, this._renderWorldCopies);
|
|
277
|
+
clone.tileSize = this.tileSize;
|
|
278
|
+
clone.latRange = this.latRange;
|
|
279
|
+
clone.width = this.width;
|
|
280
|
+
clone.height = this.height;
|
|
281
|
+
clone.center = this._center;
|
|
282
|
+
clone.zoom = this.zoom;
|
|
283
|
+
clone.angle = this.angle;
|
|
284
|
+
clone.fov = this._fov;
|
|
285
|
+
clone.pitch = this._pitch;
|
|
286
|
+
clone.unmodified = this.unmodified;
|
|
287
|
+
clone.edgeInsets = this.edgeInsets.clone();
|
|
288
|
+
clone.calcMatrices();
|
|
289
|
+
return clone;
|
|
290
|
+
}
|
|
291
|
+
/**
|
|
292
|
+
* Returns if the padding params match
|
|
293
|
+
*
|
|
294
|
+
* @param {IPaddingOptions} padding
|
|
295
|
+
* @returns {boolean}
|
|
296
|
+
* @memberof Transform
|
|
297
|
+
*/
|
|
298
|
+
|
|
299
|
+
}, {
|
|
300
|
+
key: "isPaddingEqual",
|
|
301
|
+
value: function isPaddingEqual(padding) {
|
|
302
|
+
return this.edgeInsets.equals(padding);
|
|
303
|
+
}
|
|
304
|
+
/**
|
|
305
|
+
* Helper method to upadte edge-insets inplace
|
|
306
|
+
*
|
|
307
|
+
* @param {IPaddingOptions} target
|
|
308
|
+
* @param {number} t
|
|
309
|
+
* @memberof Transform
|
|
310
|
+
*/
|
|
311
|
+
|
|
312
|
+
}, {
|
|
313
|
+
key: "interpolatePadding",
|
|
314
|
+
value: function interpolatePadding(start, target, t) {
|
|
315
|
+
this.unmodified = false;
|
|
316
|
+
this.edgeInsets.interpolate(start, target, t);
|
|
317
|
+
this.constrain();
|
|
318
|
+
this.calcMatrices();
|
|
319
|
+
}
|
|
320
|
+
/**
|
|
321
|
+
* Return a zoom level that will cover all tiles the transform
|
|
322
|
+
* @param {Object} options options
|
|
323
|
+
* @param {number} options.tileSize Tile size, expressed in screen pixels.
|
|
324
|
+
* @param {boolean} options.roundZoom Target zoom level. If true, the value will be rounded to the closest integer. Otherwise the value will be floored.
|
|
325
|
+
* @returns {number} zoom level An integer zoom level at which all tiles will be visible.
|
|
326
|
+
*/
|
|
327
|
+
|
|
328
|
+
}, {
|
|
329
|
+
key: "coveringZoomLevel",
|
|
330
|
+
value: function coveringZoomLevel(options) {
|
|
331
|
+
var z = (options.roundZoom ? Math.round : Math.floor)(this.zoom + this.scaleZoom(this.tileSize / options.tileSize)); // At negative zoom levels load tiles from z0 because negative tile zoom levels don't exist.
|
|
332
|
+
|
|
333
|
+
return Math.max(0, z);
|
|
334
|
+
}
|
|
335
|
+
/**
|
|
336
|
+
* Return any "wrapped" copies of a given tile coordinate that are visible
|
|
337
|
+
* in the current view.
|
|
338
|
+
*
|
|
339
|
+
* @private
|
|
340
|
+
*/
|
|
341
|
+
// public getVisibleUnwrappedCoordinates(tileID: CanonicalTileID) {
|
|
342
|
+
// const result = [new UnwrappedTileID(0, tileID)];
|
|
343
|
+
// if (this._renderWorldCopies) {
|
|
344
|
+
// const utl = this.pointCoordinate(new Point(0, 0));
|
|
345
|
+
// const utr = this.pointCoordinate(new Point(this.width, 0));
|
|
346
|
+
// const ubl = this.pointCoordinate(new Point(this.width, this.height));
|
|
347
|
+
// const ubr = this.pointCoordinate(new Point(0, this.height));
|
|
348
|
+
// const w0 = Math.floor(Math.min(utl.x, utr.x, ubl.x, ubr.x));
|
|
349
|
+
// const w1 = Math.floor(Math.max(utl.x, utr.x, ubl.x, ubr.x));
|
|
350
|
+
// // Add an extra copy of the world on each side to properly render ImageSources and CanvasSources.
|
|
351
|
+
// // Both sources draw outside the tile boundaries of the tile that "contains them" so we need
|
|
352
|
+
// // to add extra copies on both sides in case offscreen tiles need to draw into on-screen ones.
|
|
353
|
+
// const extraWorldCopy = 1;
|
|
354
|
+
// for (let w = w0 - extraWorldCopy; w <= w1 + extraWorldCopy; w++) {
|
|
355
|
+
// if (w === 0) {
|
|
356
|
+
// continue;
|
|
357
|
+
// }
|
|
358
|
+
// result.push(new UnwrappedTileID(w, tileID));
|
|
359
|
+
// }
|
|
360
|
+
// }
|
|
361
|
+
// return result;
|
|
362
|
+
// }
|
|
363
|
+
|
|
364
|
+
/**
|
|
365
|
+
* Return all coordinates that could cover this transform for a covering
|
|
366
|
+
* zoom level.
|
|
367
|
+
* @param {Object} options
|
|
368
|
+
* @param {number} options.tileSize
|
|
369
|
+
* @param {number} options.minzoom
|
|
370
|
+
* @param {number} options.maxzoom
|
|
371
|
+
* @param {boolean} options.roundZoom
|
|
372
|
+
* @param {boolean} options.reparseOverscaled
|
|
373
|
+
* @param {boolean} options.renderWorldCopies
|
|
374
|
+
* @returns {Array<OverscaledTileID>} OverscaledTileIDs
|
|
375
|
+
* @private
|
|
376
|
+
*/
|
|
377
|
+
// public coveringTiles(options: {
|
|
378
|
+
// tileSize: number;
|
|
379
|
+
// minzoom?: number;
|
|
380
|
+
// maxzoom?: number;
|
|
381
|
+
// roundZoom?: boolean;
|
|
382
|
+
// reparseOverscaled?: boolean;
|
|
383
|
+
// renderWorldCopies?: boolean;
|
|
384
|
+
// }): OverscaledTileID[] {
|
|
385
|
+
// let z = this.coveringZoomLevel(options);
|
|
386
|
+
// const actualZ = z;
|
|
387
|
+
// if (options.minzoom !== undefined && z < options.minzoom) {
|
|
388
|
+
// return [];
|
|
389
|
+
// }
|
|
390
|
+
// if (options.maxzoom !== undefined && z > options.maxzoom) {
|
|
391
|
+
// z = options.maxzoom;
|
|
392
|
+
// }
|
|
393
|
+
// const centerCoord = MercatorCoordinate.fromLngLat(this.center);
|
|
394
|
+
// const numTiles = Math.pow(2, z);
|
|
395
|
+
// const centerPoint = [numTiles * centerCoord.x, numTiles * centerCoord.y, 0];
|
|
396
|
+
// const cameraFrustum = Frustum.fromInvProjectionMatrix(
|
|
397
|
+
// this.invProjMatrix,
|
|
398
|
+
// this.worldSize,
|
|
399
|
+
// z,
|
|
400
|
+
// );
|
|
401
|
+
// // No change of LOD behavior for pitch lower than 60 and when there is no top padding: return only tile ids from the requested zoom level
|
|
402
|
+
// let minZoom = options.minzoom || 0;
|
|
403
|
+
// // Use 0.1 as an epsilon to avoid for explicit == 0.0 floating point checks
|
|
404
|
+
// if (this._pitch <= 60.0 && this.edgeInsets.top < 0.1) {
|
|
405
|
+
// minZoom = z;
|
|
406
|
+
// }
|
|
407
|
+
// // There should always be a certain number of maximum zoom level tiles surrounding the center location
|
|
408
|
+
// const radiusOfMaxLvlLodInTiles = 3;
|
|
409
|
+
// const newRootTile = (wrap: number): any => {
|
|
410
|
+
// return {
|
|
411
|
+
// // All tiles are on zero elevation plane => z difference is zero
|
|
412
|
+
// aabb: new Aabb(
|
|
413
|
+
// [wrap * numTiles, 0, 0],
|
|
414
|
+
// [(wrap + 1) * numTiles, numTiles, 0],
|
|
415
|
+
// ),
|
|
416
|
+
// zoom: 0,
|
|
417
|
+
// x: 0,
|
|
418
|
+
// y: 0,
|
|
419
|
+
// wrap,
|
|
420
|
+
// fullyVisible: false,
|
|
421
|
+
// };
|
|
422
|
+
// };
|
|
423
|
+
// // Do a depth-first traversal to find visible tiles and proper levels of detail
|
|
424
|
+
// const stack = [];
|
|
425
|
+
// const result = [];
|
|
426
|
+
// const maxZoom = z;
|
|
427
|
+
// const overscaledZ = options.reparseOverscaled ? actualZ : z;
|
|
428
|
+
// if (this._renderWorldCopies) {
|
|
429
|
+
// // Render copy of the globe thrice on both sides
|
|
430
|
+
// for (let i = 1; i <= 3; i++) {
|
|
431
|
+
// stack.push(newRootTile(-i));
|
|
432
|
+
// stack.push(newRootTile(i));
|
|
433
|
+
// }
|
|
434
|
+
// }
|
|
435
|
+
// stack.push(newRootTile(0));
|
|
436
|
+
// while (stack.length > 0) {
|
|
437
|
+
// const it = stack.pop();
|
|
438
|
+
// const x = it.x;
|
|
439
|
+
// const y = it.y;
|
|
440
|
+
// let fullyVisible = it.fullyVisible;
|
|
441
|
+
// // Visibility of a tile is not required if any of its ancestor if fully inside the frustum
|
|
442
|
+
// if (!fullyVisible) {
|
|
443
|
+
// const intersectResult = it.aabb.intersects(cameraFrustum);
|
|
444
|
+
// if (intersectResult === 0) {
|
|
445
|
+
// continue;
|
|
446
|
+
// }
|
|
447
|
+
// fullyVisible = intersectResult === 2;
|
|
448
|
+
// }
|
|
449
|
+
// const distanceX = it.aabb.distanceX(centerPoint);
|
|
450
|
+
// const distanceY = it.aabb.distanceY(centerPoint);
|
|
451
|
+
// const longestDim = Math.max(Math.abs(distanceX), Math.abs(distanceY));
|
|
452
|
+
// // We're using distance based heuristics to determine if a tile should be split into quadrants or not.
|
|
453
|
+
// // radiusOfMaxLvlLodInTiles defines that there's always a certain number of maxLevel tiles next to the map center.
|
|
454
|
+
// // Using the fact that a parent node in quadtree is twice the size of its children (per dimension)
|
|
455
|
+
// // we can define distance thresholds for each relative level:
|
|
456
|
+
// // f(k) = offset + 2 + 4 + 8 + 16 + ... + 2^k. This is the same as "offset+2^(k+1)-2"
|
|
457
|
+
// const distToSplit =
|
|
458
|
+
// radiusOfMaxLvlLodInTiles + (1 << (maxZoom - it.zoom)) - 2;
|
|
459
|
+
// // Have we reached the target depth or is the tile too far away to be any split further?
|
|
460
|
+
// if (
|
|
461
|
+
// it.zoom === maxZoom ||
|
|
462
|
+
// (longestDim > distToSplit && it.zoom >= minZoom)
|
|
463
|
+
// ) {
|
|
464
|
+
// result.push({
|
|
465
|
+
// tileID: new OverscaledTileID(
|
|
466
|
+
// it.zoom === maxZoom ? overscaledZ : it.zoom,
|
|
467
|
+
// it.wrap,
|
|
468
|
+
// it.zoom,
|
|
469
|
+
// x,
|
|
470
|
+
// y,
|
|
471
|
+
// ),
|
|
472
|
+
// distanceSq: vec2.sqrLen([
|
|
473
|
+
// centerPoint[0] - 0.5 - x,
|
|
474
|
+
// centerPoint[1] - 0.5 - y,
|
|
475
|
+
// ]),
|
|
476
|
+
// });
|
|
477
|
+
// continue;
|
|
478
|
+
// }
|
|
479
|
+
// for (let i = 0; i < 4; i++) {
|
|
480
|
+
// const childX = (x << 1) + (i % 2);
|
|
481
|
+
// const childY = (y << 1) + (i >> 1);
|
|
482
|
+
// stack.push({
|
|
483
|
+
// aabb: it.aabb.quadrant(i),
|
|
484
|
+
// zoom: it.zoom + 1,
|
|
485
|
+
// x: childX,
|
|
486
|
+
// y: childY,
|
|
487
|
+
// wrap: it.wrap,
|
|
488
|
+
// fullyVisible,
|
|
489
|
+
// });
|
|
490
|
+
// }
|
|
491
|
+
// }
|
|
492
|
+
// return result
|
|
493
|
+
// .sort((a, b) => a.distanceSq - b.distanceSq)
|
|
494
|
+
// .map((a) => a.tileID);
|
|
495
|
+
// }
|
|
496
|
+
|
|
497
|
+
}, {
|
|
498
|
+
key: "resize",
|
|
499
|
+
value: function resize(width, height) {
|
|
500
|
+
this.width = width;
|
|
501
|
+
this.height = height;
|
|
502
|
+
this.pixelsToGLUnits = [2 / width, -2 / height];
|
|
503
|
+
this.constrain();
|
|
504
|
+
this.calcMatrices();
|
|
505
|
+
}
|
|
506
|
+
}, {
|
|
507
|
+
key: "zoomScale",
|
|
508
|
+
value: function zoomScale(zoom) {
|
|
509
|
+
return Math.pow(2, zoom);
|
|
510
|
+
}
|
|
511
|
+
}, {
|
|
512
|
+
key: "scaleZoom",
|
|
513
|
+
value: function scaleZoom(scale) {
|
|
514
|
+
return Math.log(scale) / Math.LN2;
|
|
515
|
+
}
|
|
516
|
+
}, {
|
|
517
|
+
key: "project",
|
|
518
|
+
value: function project(lnglat) {
|
|
519
|
+
var lat = (0, _util.clamp)(lnglat.lat, -this.maxValidLatitude, this.maxValidLatitude);
|
|
520
|
+
return new _point.default((0, _mercator.mercatorXfromLng)(lnglat.lng) * this.worldSize, (0, _mercator.mercatorYfromLat)(lat) * this.worldSize);
|
|
521
|
+
}
|
|
522
|
+
}, {
|
|
523
|
+
key: "unproject",
|
|
524
|
+
value: function unproject(point) {
|
|
525
|
+
return new _mercator.default(point.x / this.worldSize, point.y / this.worldSize).toLngLat();
|
|
526
|
+
}
|
|
527
|
+
}, {
|
|
528
|
+
key: "setLocationAtPoint",
|
|
529
|
+
value: function setLocationAtPoint(lnglat, point) {
|
|
530
|
+
var a = this.pointCoordinate(point);
|
|
531
|
+
var b = this.pointCoordinate(this.centerPoint);
|
|
532
|
+
var loc = this.locationCoordinate(lnglat);
|
|
533
|
+
var newCenter = new _mercator.default(loc.x - (a.x - b.x), loc.y - (a.y - b.y));
|
|
534
|
+
this.center = this.coordinateLocation(newCenter);
|
|
535
|
+
|
|
536
|
+
if (this._renderWorldCopies) {
|
|
537
|
+
this.center = this.center.wrap();
|
|
538
|
+
}
|
|
539
|
+
}
|
|
540
|
+
}, {
|
|
541
|
+
key: "pointCoordinate",
|
|
542
|
+
value: function pointCoordinate(p) {
|
|
543
|
+
var targetZ = 0; // since we don't know the correct projected z value for the point,
|
|
544
|
+
// unproject two points to get a line and then find the point on that
|
|
545
|
+
// line with z=0
|
|
546
|
+
|
|
547
|
+
var coord0 = new Float64Array([p.x, p.y, 0, 1]);
|
|
548
|
+
var coord1 = new Float64Array([p.x, p.y, 1, 1]); // @ts-ignore
|
|
549
|
+
|
|
550
|
+
_glMatrix.vec4.transformMat4(coord0, coord0, this.pixelMatrixInverse); // @ts-ignore
|
|
551
|
+
|
|
552
|
+
|
|
553
|
+
_glMatrix.vec4.transformMat4(coord1, coord1, this.pixelMatrixInverse);
|
|
554
|
+
|
|
555
|
+
var w0 = coord0[3];
|
|
556
|
+
var w1 = coord1[3];
|
|
557
|
+
var x0 = coord0[0] / w0;
|
|
558
|
+
var x1 = coord1[0] / w1;
|
|
559
|
+
var y0 = coord0[1] / w0;
|
|
560
|
+
var y1 = coord1[1] / w1;
|
|
561
|
+
var z0 = coord0[2] / w0;
|
|
562
|
+
var z1 = coord1[2] / w1;
|
|
563
|
+
var t = z0 === z1 ? 0 : (targetZ - z0) / (z1 - z0);
|
|
564
|
+
return new _mercator.default((0, _util.interpolate)(x0, x1, t) / this.worldSize, (0, _util.interpolate)(y0, y1, t) / this.worldSize);
|
|
565
|
+
}
|
|
566
|
+
/**
|
|
567
|
+
* Returns the map's geographical bounds. When the bearing or pitch is non-zero, the visible region is not
|
|
568
|
+
* an axis-aligned rectangle, and the result is the smallest bounds that encompasses the visible region.
|
|
569
|
+
* @returns {LngLatBounds} Returns a {@link LngLatBounds} object describing the map's geographical bounds.
|
|
570
|
+
*/
|
|
571
|
+
|
|
572
|
+
}, {
|
|
573
|
+
key: "getBounds",
|
|
574
|
+
value: function getBounds() {
|
|
575
|
+
return new _lng_lat_bounds.default().extend(this.pointLocation(new _point.default(0, 0))).extend(this.pointLocation(new _point.default(this.width, 0))).extend(this.pointLocation(new _point.default(this.width, this.height))).extend(this.pointLocation(new _point.default(0, this.height)));
|
|
576
|
+
}
|
|
577
|
+
/**
|
|
578
|
+
* Returns the maximum geographical bounds the map is constrained to, or `null` if none set.
|
|
579
|
+
* @returns {LngLatBounds} {@link LngLatBounds}
|
|
580
|
+
*/
|
|
581
|
+
|
|
582
|
+
}, {
|
|
583
|
+
key: "getMaxBounds",
|
|
584
|
+
value: function getMaxBounds() {
|
|
585
|
+
if (!this.latRange || this.latRange.length !== 2 || !this.lngRange || this.lngRange.length !== 2) {
|
|
586
|
+
return null;
|
|
587
|
+
}
|
|
588
|
+
|
|
589
|
+
return new _lng_lat_bounds.default([this.lngRange[0], this.latRange[0]], [this.lngRange[1], this.latRange[1]]);
|
|
590
|
+
}
|
|
591
|
+
/**
|
|
592
|
+
* Sets or clears the map's geographical constraints.
|
|
593
|
+
* @param {LngLatBounds} bounds A {@link LngLatBounds} object describing the new geographic boundaries of the map.
|
|
594
|
+
*/
|
|
595
|
+
|
|
596
|
+
}, {
|
|
597
|
+
key: "setMaxBounds",
|
|
598
|
+
value: function setMaxBounds(bounds) {
|
|
599
|
+
if (bounds) {
|
|
600
|
+
this.lngRange = [bounds.getWest(), bounds.getEast()];
|
|
601
|
+
this.latRange = [bounds.getSouth(), bounds.getNorth()];
|
|
602
|
+
this.constrain();
|
|
397
603
|
} else {
|
|
398
|
-
this.
|
|
604
|
+
this.lngRange = undefined;
|
|
605
|
+
this.latRange = [-this.maxValidLatitude, this.maxValidLatitude];
|
|
399
606
|
}
|
|
400
|
-
this.unmodified = unmodified;
|
|
401
|
-
this.constraining = false;
|
|
402
|
-
return;
|
|
403
607
|
}
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
608
|
+
}, {
|
|
609
|
+
key: "customLayerMatrix",
|
|
610
|
+
value: function customLayerMatrix() {
|
|
611
|
+
return this.mercatorMatrix.slice();
|
|
612
|
+
}
|
|
613
|
+
}, {
|
|
614
|
+
key: "maxPitchScaleFactor",
|
|
615
|
+
value: function maxPitchScaleFactor() {
|
|
616
|
+
// calcMatrices hasn't run yet
|
|
617
|
+
if (!this.pixelMatrixInverse) {
|
|
618
|
+
return 1;
|
|
409
619
|
}
|
|
410
|
-
|
|
411
|
-
|
|
620
|
+
|
|
621
|
+
var coord = this.pointCoordinate(new _point.default(0, 0));
|
|
622
|
+
var p = new Float32Array([coord.x * this.worldSize, coord.y * this.worldSize, 0, 1]);
|
|
623
|
+
|
|
624
|
+
var topPoint = _glMatrix.vec4.transformMat4(p, p, this.pixelMatrix);
|
|
625
|
+
|
|
626
|
+
return topPoint[3] / this.cameraToCenterDistance;
|
|
627
|
+
}
|
|
628
|
+
/*
|
|
629
|
+
* The camera looks at the map from a 3D (lng, lat, altitude) location. Let's use `cameraLocation`
|
|
630
|
+
* as the name for the location under the camera and on the surface of the earth (lng, lat, 0).
|
|
631
|
+
* `cameraPoint` is the projected position of the `cameraLocation`.
|
|
632
|
+
*
|
|
633
|
+
* This point is useful to us because only fill-extrusions that are between `cameraPoint` and
|
|
634
|
+
* the query point on the surface of the earth can extend and intersect the query.
|
|
635
|
+
*
|
|
636
|
+
* When the map is not pitched the `cameraPoint` is equivalent to the center of the map because
|
|
637
|
+
* the camera is right above the center of the map.
|
|
638
|
+
*/
|
|
639
|
+
|
|
640
|
+
}, {
|
|
641
|
+
key: "getCameraPoint",
|
|
642
|
+
value: function getCameraPoint() {
|
|
643
|
+
var pitch = this._pitch;
|
|
644
|
+
var yOffset = Math.tan(pitch) * (this.cameraToCenterDistance || 1);
|
|
645
|
+
return this.centerPoint.add(new _point.default(0, yOffset));
|
|
646
|
+
}
|
|
647
|
+
/*
|
|
648
|
+
* When the map is pitched, some of the 3D features that intersect a query will not intersect
|
|
649
|
+
* the query at the surface of the earth. Instead the feature may be closer and only intersect
|
|
650
|
+
* the query because it extrudes into the air.
|
|
651
|
+
*
|
|
652
|
+
* This returns a geometry that includes all of the original query as well as all possible ares of the
|
|
653
|
+
* screen where the *base* of a visible extrusion could be.
|
|
654
|
+
* - For point queries, the line from the query point to the "camera point"
|
|
655
|
+
* - For other geometries, the envelope of the query geometry and the "camera point"
|
|
656
|
+
*/
|
|
657
|
+
|
|
658
|
+
}, {
|
|
659
|
+
key: "getCameraQueryGeometry",
|
|
660
|
+
value: function getCameraQueryGeometry(queryGeometry) {
|
|
661
|
+
var c = this.getCameraPoint();
|
|
662
|
+
|
|
663
|
+
if (queryGeometry.length === 1) {
|
|
664
|
+
return [queryGeometry[0], c];
|
|
665
|
+
} else {
|
|
666
|
+
var minX = c.x;
|
|
667
|
+
var minY = c.y;
|
|
668
|
+
var maxX = c.x;
|
|
669
|
+
var maxY = c.y;
|
|
670
|
+
|
|
671
|
+
var _iterator = _createForOfIteratorHelper(queryGeometry),
|
|
672
|
+
_step;
|
|
673
|
+
|
|
674
|
+
try {
|
|
675
|
+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
676
|
+
var p = _step.value;
|
|
677
|
+
minX = Math.min(minX, p.x);
|
|
678
|
+
minY = Math.min(minY, p.y);
|
|
679
|
+
maxX = Math.max(maxX, p.x);
|
|
680
|
+
maxY = Math.max(maxY, p.y);
|
|
681
|
+
}
|
|
682
|
+
} catch (err) {
|
|
683
|
+
_iterator.e(err);
|
|
684
|
+
} finally {
|
|
685
|
+
_iterator.f();
|
|
686
|
+
}
|
|
687
|
+
|
|
688
|
+
return [new _point.default(minX, minY), new _point.default(maxX, minY), new _point.default(maxX, maxY), new _point.default(minX, maxY), new _point.default(minX, minY)];
|
|
412
689
|
}
|
|
413
690
|
}
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
691
|
+
/**
|
|
692
|
+
* Given a coordinate, return the screen point that corresponds to it
|
|
693
|
+
* @param {Coordinate} coord
|
|
694
|
+
* @returns {Point} screen point
|
|
695
|
+
* @private
|
|
696
|
+
*/
|
|
697
|
+
|
|
698
|
+
}, {
|
|
699
|
+
key: "coordinatePoint",
|
|
700
|
+
value: function coordinatePoint(coord) {
|
|
701
|
+
var p = _glMatrix.vec4.fromValues(coord.x * this.worldSize, coord.y * this.worldSize, 0, 1);
|
|
702
|
+
|
|
703
|
+
_glMatrix.vec4.transformMat4(p, p, this.pixelMatrix);
|
|
704
|
+
|
|
705
|
+
return new _point.default(p[0] / p[3], p[1] / p[3]);
|
|
706
|
+
}
|
|
707
|
+
/**
|
|
708
|
+
* Given a location, return the screen point that corresponds to it
|
|
709
|
+
* @param {LngLat} lnglat location
|
|
710
|
+
* @returns {Point} screen point
|
|
711
|
+
* @private
|
|
712
|
+
*/
|
|
713
|
+
|
|
714
|
+
}, {
|
|
715
|
+
key: "locationPoint",
|
|
716
|
+
value: function locationPoint(lnglat) {
|
|
717
|
+
return this.coordinatePoint(this.locationCoordinate(lnglat));
|
|
718
|
+
}
|
|
719
|
+
/**
|
|
720
|
+
* Given a point on screen, return its lnglat
|
|
721
|
+
* @param {Point} p screen point
|
|
722
|
+
* @returns {LngLat} lnglat location
|
|
723
|
+
* @private
|
|
724
|
+
*/
|
|
725
|
+
|
|
726
|
+
}, {
|
|
727
|
+
key: "pointLocation",
|
|
728
|
+
value: function pointLocation(p) {
|
|
729
|
+
// if(p.x !== 0 && p.x !== 1001) {
|
|
730
|
+
// console.log(p.x)
|
|
731
|
+
// }
|
|
732
|
+
return this.coordinateLocation(this.pointCoordinate(p));
|
|
733
|
+
}
|
|
734
|
+
/**
|
|
735
|
+
* Given a geographical lnglat, return an unrounded
|
|
736
|
+
* coordinate that represents it at this transform's zoom level.
|
|
737
|
+
* @param {LngLat} lnglat
|
|
738
|
+
* @returns {Coordinate}
|
|
739
|
+
* @private
|
|
740
|
+
*/
|
|
741
|
+
|
|
742
|
+
}, {
|
|
743
|
+
key: "locationCoordinate",
|
|
744
|
+
value: function locationCoordinate(lnglat) {
|
|
745
|
+
return _mercator.default.fromLngLat(lnglat);
|
|
746
|
+
}
|
|
747
|
+
/**
|
|
748
|
+
* Given a Coordinate, return its geographical position.
|
|
749
|
+
* @param {Coordinate} coord
|
|
750
|
+
* @returns {LngLat} lnglat
|
|
751
|
+
* @private
|
|
752
|
+
*/
|
|
753
|
+
|
|
754
|
+
}, {
|
|
755
|
+
key: "coordinateLocation",
|
|
756
|
+
value: function coordinateLocation(coord) {
|
|
757
|
+
return coord.toLngLat();
|
|
758
|
+
}
|
|
759
|
+
}, {
|
|
760
|
+
key: "getProjectionMatrix",
|
|
761
|
+
value: function getProjectionMatrix() {
|
|
762
|
+
return this.projMatrix;
|
|
763
|
+
}
|
|
764
|
+
/**
|
|
765
|
+
* Calculate the posMatrix that, given a tile coordinate, would be used to display the tile on a map.
|
|
766
|
+
* @param {UnwrappedTileID} unwrappedTileID;
|
|
767
|
+
* @private
|
|
768
|
+
*/
|
|
769
|
+
// private calculatePosMatrix(
|
|
770
|
+
// unwrappedTileID: UnwrappedTileID,
|
|
771
|
+
// aligned: boolean = false,
|
|
772
|
+
// ): Float32Array {
|
|
773
|
+
// const posMatrixKey = unwrappedTileID.key;
|
|
774
|
+
// const cache = aligned ? this.alignedPosMatrixCache : this.posMatrixCache;
|
|
775
|
+
// if (cache[posMatrixKey]) {
|
|
776
|
+
// return cache[posMatrixKey];
|
|
777
|
+
// }
|
|
778
|
+
// const canonical = unwrappedTileID.canonical;
|
|
779
|
+
// const scale = this.worldSize / this.zoomScale(canonical.z);
|
|
780
|
+
// const unwrappedX =
|
|
781
|
+
// canonical.x + Math.pow(2, canonical.z) * unwrappedTileID.wrap;
|
|
782
|
+
// const posMatrix = mat4.identity(new Float64Array(16));
|
|
783
|
+
// mat4.translate(posMatrix, posMatrix, [
|
|
784
|
+
// unwrappedX * scale,
|
|
785
|
+
// canonical.y * scale,
|
|
786
|
+
// 0,
|
|
787
|
+
// ]);
|
|
788
|
+
// mat4.scale(posMatrix, posMatrix, [scale / EXTENT, scale / EXTENT, 1]);
|
|
789
|
+
// mat4.multiply(
|
|
790
|
+
// posMatrix,
|
|
791
|
+
// aligned ? this.alignedProjMatrix : this.projMatrix,
|
|
792
|
+
// posMatrix,
|
|
793
|
+
// );
|
|
794
|
+
// cache[posMatrixKey] = new Float32Array(posMatrix);
|
|
795
|
+
// return cache[posMatrixKey];
|
|
796
|
+
// }
|
|
797
|
+
|
|
798
|
+
}, {
|
|
799
|
+
key: "constrain",
|
|
800
|
+
value: function constrain() {
|
|
801
|
+
if (!this.center || !this.width || !this.height || this.constraining) {
|
|
802
|
+
return;
|
|
803
|
+
}
|
|
804
|
+
|
|
805
|
+
this.constraining = true;
|
|
806
|
+
var minY = -90;
|
|
807
|
+
var maxY = 90;
|
|
808
|
+
var minX = -180;
|
|
809
|
+
var maxX = 180;
|
|
810
|
+
var sy;
|
|
811
|
+
var sx;
|
|
812
|
+
var x2;
|
|
813
|
+
var y2;
|
|
814
|
+
var size = this.size;
|
|
815
|
+
var unmodified = this.unmodified;
|
|
816
|
+
|
|
817
|
+
if (this.latRange) {
|
|
818
|
+
var latRange = this.latRange;
|
|
819
|
+
minY = (0, _mercator.mercatorYfromLat)(latRange[1]) * this.worldSize;
|
|
820
|
+
maxY = (0, _mercator.mercatorYfromLat)(latRange[0]) * this.worldSize;
|
|
821
|
+
sy = maxY - minY < size.y ? size.y / (maxY - minY) : 0;
|
|
822
|
+
}
|
|
823
|
+
|
|
824
|
+
if (this.lngRange) {
|
|
825
|
+
var lngRange = this.lngRange;
|
|
826
|
+
minX = (0, _mercator.mercatorXfromLng)(lngRange[0]) * this.worldSize;
|
|
827
|
+
maxX = (0, _mercator.mercatorXfromLng)(lngRange[1]) * this.worldSize;
|
|
828
|
+
sx = maxX - minX < size.x ? size.x / (maxX - minX) : 0;
|
|
419
829
|
}
|
|
420
|
-
|
|
421
|
-
|
|
830
|
+
|
|
831
|
+
var point = this.point; // how much the map should scale to fit the screen into given latitude/longitude ranges
|
|
832
|
+
|
|
833
|
+
var s = Math.max(sx || 0, sy || 0);
|
|
834
|
+
|
|
835
|
+
if (s) {
|
|
836
|
+
this.center = this.unproject(new _point.default(sx ? (maxX + minX) / 2 : point.x, sy ? (maxY + minY) / 2 : point.y));
|
|
837
|
+
|
|
838
|
+
if (_l7Utils.isMini) {
|
|
839
|
+
this.zoom = Math.max(this.zoom, Math.max(-1, this.minZoom));
|
|
840
|
+
} else {
|
|
841
|
+
this.zoom += this.scaleZoom(s);
|
|
842
|
+
}
|
|
843
|
+
|
|
844
|
+
this.unmodified = unmodified;
|
|
845
|
+
this.constraining = false;
|
|
846
|
+
return;
|
|
422
847
|
}
|
|
848
|
+
|
|
849
|
+
if (this.latRange) {
|
|
850
|
+
var y = point.y;
|
|
851
|
+
var h2 = size.y / 2;
|
|
852
|
+
|
|
853
|
+
if (y - h2 < minY) {
|
|
854
|
+
y2 = minY + h2;
|
|
855
|
+
}
|
|
856
|
+
|
|
857
|
+
if (y + h2 > maxY) {
|
|
858
|
+
y2 = maxY - h2;
|
|
859
|
+
}
|
|
860
|
+
}
|
|
861
|
+
|
|
862
|
+
if (this.lngRange) {
|
|
863
|
+
var x = point.x;
|
|
864
|
+
var w2 = size.x / 2;
|
|
865
|
+
|
|
866
|
+
if (x - w2 < minX) {
|
|
867
|
+
x2 = minX + w2;
|
|
868
|
+
}
|
|
869
|
+
|
|
870
|
+
if (x + w2 > maxX) {
|
|
871
|
+
x2 = maxX - w2;
|
|
872
|
+
}
|
|
873
|
+
} // pan the map if the screen goes off the range
|
|
874
|
+
|
|
875
|
+
|
|
876
|
+
if (x2 !== undefined || y2 !== undefined) {
|
|
877
|
+
this.center = this.unproject(new _point.default(x2 !== undefined ? x2 : point.x, y2 !== undefined ? y2 : point.y));
|
|
878
|
+
}
|
|
879
|
+
|
|
880
|
+
this.unmodified = unmodified;
|
|
881
|
+
this.constraining = false;
|
|
423
882
|
}
|
|
424
|
-
|
|
425
|
-
|
|
883
|
+
}, {
|
|
884
|
+
key: "calcMatrices",
|
|
885
|
+
value: function calcMatrices() {
|
|
886
|
+
if (!this.height) {
|
|
887
|
+
return;
|
|
888
|
+
}
|
|
889
|
+
|
|
890
|
+
var halfFov = this._fov / 2;
|
|
891
|
+
var offset = this.centerOffset;
|
|
892
|
+
this.cameraToCenterDistance = 0.5 / Math.tan(halfFov) * this.height; // Find the distance from the center point [width/2 + offset.x, height/2 + offset.y] to the
|
|
893
|
+
// center top point [width/2 + offset.x, 0] in Z units, using the law of sines.
|
|
894
|
+
// 1 Z unit is equivalent to 1 horizontal px at the center of the map
|
|
895
|
+
// (the distance between[width/2, height/2] and [width/2 + 1, height/2])
|
|
896
|
+
|
|
897
|
+
var groundAngle = Math.PI / 2 + this._pitch;
|
|
898
|
+
var fovAboveCenter = this._fov * (0.5 + offset.y / this.height);
|
|
899
|
+
var topHalfSurfaceDistance = Math.sin(fovAboveCenter) * this.cameraToCenterDistance / Math.sin((0, _util.clamp)(Math.PI - groundAngle - fovAboveCenter, 0.01, Math.PI - 0.01));
|
|
900
|
+
var point = this.point;
|
|
901
|
+
var x = point.x;
|
|
902
|
+
var y = point.y; // Calculate z distance of the farthest fragment that should be rendered.
|
|
903
|
+
|
|
904
|
+
var furthestDistance = Math.cos(Math.PI / 2 - this._pitch) * topHalfSurfaceDistance + this.cameraToCenterDistance; // Add a bit extra to avoid precision problems when a fragment's distance is exactly `furthestDistance`
|
|
905
|
+
|
|
906
|
+
var farZ = furthestDistance * 1.01; // The larger the value of nearZ is
|
|
907
|
+
// - the more depth precision is available for features (good)
|
|
908
|
+
// - clipping starts appearing sooner when the camera is close to 3d features (bad)
|
|
909
|
+
//
|
|
910
|
+
// Smaller values worked well for mapbox-gl-js but deckgl was encountering precision issues
|
|
911
|
+
// when rendering it's layers using custom layers. This value was experimentally chosen and
|
|
912
|
+
// seems to solve z-fighting issues in deckgl while not clipping buildings too close to the camera.
|
|
913
|
+
|
|
914
|
+
var nearZ = this.height / 50; // matrix for conversion from location to GL coordinates (-1 .. 1)
|
|
915
|
+
// 使用 Float64Array 的原因是为了避免计算精度问题、 mat4.create() 默认使用 Float32Array
|
|
916
|
+
|
|
917
|
+
var m = new Float64Array(16); // @ts-ignore
|
|
918
|
+
|
|
919
|
+
_glMatrix.mat4.perspective(m, this._fov, this.width / this.height, nearZ, farZ); // Apply center of perspective offset
|
|
920
|
+
|
|
921
|
+
|
|
922
|
+
m[8] = -offset.x * 2 / this.width;
|
|
923
|
+
m[9] = offset.y * 2 / this.height; // @ts-ignore
|
|
924
|
+
|
|
925
|
+
_glMatrix.mat4.scale(m, m, [1, -1, 1]); // @ts-ignore
|
|
926
|
+
|
|
927
|
+
|
|
928
|
+
_glMatrix.mat4.translate(m, m, [0, 0, -this.cameraToCenterDistance]); // @ts-ignore
|
|
929
|
+
|
|
930
|
+
|
|
931
|
+
_glMatrix.mat4.rotateX(m, m, this._pitch); // @ts-ignore
|
|
932
|
+
|
|
933
|
+
|
|
934
|
+
_glMatrix.mat4.rotateZ(m, m, this.angle); // @ts-ignore
|
|
935
|
+
|
|
936
|
+
|
|
937
|
+
_glMatrix.mat4.translate(m, m, [-x, -y, 0]); // The mercatorMatrix can be used to transform points from mercator coordinates
|
|
938
|
+
// ([0, 0] nw, [1, 1] se) to GL coordinates.
|
|
939
|
+
// @ts-ignore
|
|
940
|
+
|
|
941
|
+
|
|
942
|
+
this.mercatorMatrix = _glMatrix.mat4.scale([], m, [this.worldSize, this.worldSize, this.worldSize]); // scale vertically to meters per pixel (inverse of ground resolution):
|
|
943
|
+
// @ts-ignore
|
|
944
|
+
|
|
945
|
+
_glMatrix.mat4.scale(m, m, [1, 1, (0, _mercator.mercatorZfromAltitude)(1, this.center.lat) * this.worldSize, 1]); // @ts-ignore
|
|
946
|
+
|
|
947
|
+
|
|
948
|
+
this.projMatrix = m; // @ts-ignore
|
|
949
|
+
|
|
950
|
+
this.invProjMatrix = _glMatrix.mat4.invert([], this.projMatrix); // Make a second projection matrix that is aligned to a pixel grid for rendering raster tiles.
|
|
951
|
+
// We're rounding the (floating point) x/y values to achieve to avoid rendering raster images to fractional
|
|
952
|
+
// coordinates. Additionally, we adjust by half a pixel in either direction in case that viewport dimension
|
|
953
|
+
// is an odd integer to preserve rendering to the pixel grid. We're rotating this shift based on the angle
|
|
954
|
+
// of the transformation so that 0°, 90°, 180°, and 270° rasters are crisp, and adjust the shift so that
|
|
955
|
+
// it is always <= 0.5 pixels.
|
|
956
|
+
|
|
957
|
+
var xShift = this.width % 2 / 2;
|
|
958
|
+
var yShift = this.height % 2 / 2;
|
|
959
|
+
var angleCos = Math.cos(this.angle);
|
|
960
|
+
var angleSin = Math.sin(this.angle);
|
|
961
|
+
var dx = x - Math.round(x) + angleCos * xShift + angleSin * yShift;
|
|
962
|
+
var dy = y - Math.round(y) + angleCos * yShift + angleSin * xShift; // const alignedM = mat4.clone(m);
|
|
963
|
+
|
|
964
|
+
var alignedM = new Float64Array(m); // @ts-ignore
|
|
965
|
+
|
|
966
|
+
_glMatrix.mat4.translate(alignedM, alignedM, [dx > 0.5 ? dx - 1 : dx, dy > 0.5 ? dy - 1 : dy, 0]); // @ts-ignore
|
|
967
|
+
|
|
968
|
+
|
|
969
|
+
this.alignedProjMatrix = alignedM; // @ts-ignore
|
|
970
|
+
|
|
971
|
+
m = _glMatrix.mat4.create(); // @ts-ignore
|
|
972
|
+
|
|
973
|
+
_glMatrix.mat4.scale(m, m, [this.width / 2, -this.height / 2, 1]); // @ts-ignore
|
|
974
|
+
|
|
975
|
+
|
|
976
|
+
_glMatrix.mat4.translate(m, m, [1, -1, 0]); // @ts-ignore
|
|
977
|
+
|
|
978
|
+
|
|
979
|
+
this.labelPlaneMatrix = m; // @ts-ignore
|
|
980
|
+
|
|
981
|
+
m = _glMatrix.mat4.create(); // @ts-ignore
|
|
982
|
+
|
|
983
|
+
_glMatrix.mat4.scale(m, m, [1, -1, 1]); // @ts-ignore
|
|
984
|
+
|
|
985
|
+
|
|
986
|
+
_glMatrix.mat4.translate(m, m, [-1, -1, 0]); // @ts-ignore
|
|
987
|
+
|
|
988
|
+
|
|
989
|
+
_glMatrix.mat4.scale(m, m, [2 / this.width, 2 / this.height, 1]); // @ts-ignore
|
|
990
|
+
|
|
991
|
+
|
|
992
|
+
this.glCoordMatrix = m; // matrix for conversion from location to screen coordinates
|
|
993
|
+
|
|
994
|
+
this.pixelMatrix = _glMatrix.mat4.multiply( // @ts-ignore
|
|
995
|
+
new Float64Array(16), this.labelPlaneMatrix, this.projMatrix); // inverse matrix for conversion from screen coordinaes to location
|
|
996
|
+
// @ts-ignore
|
|
997
|
+
|
|
998
|
+
m = _glMatrix.mat4.invert(new Float64Array(16), this.pixelMatrix);
|
|
999
|
+
|
|
1000
|
+
if (!m) {
|
|
1001
|
+
throw new Error('failed to invert matrix');
|
|
1002
|
+
} // @ts-ignore
|
|
1003
|
+
|
|
1004
|
+
|
|
1005
|
+
this.pixelMatrixInverse = m;
|
|
1006
|
+
this.posMatrixCache = {};
|
|
1007
|
+
this.alignedPosMatrixCache = {};
|
|
426
1008
|
}
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
return;
|
|
433
|
-
}
|
|
434
|
-
const halfFov = this._fov / 2;
|
|
435
|
-
const offset = this.centerOffset;
|
|
436
|
-
this.cameraToCenterDistance = 0.5 / Math.tan(halfFov) * this.height;
|
|
437
|
-
const groundAngle = Math.PI / 2 + this._pitch;
|
|
438
|
-
const fovAboveCenter = this._fov * (0.5 + offset.y / this.height);
|
|
439
|
-
const topHalfSurfaceDistance = Math.sin(fovAboveCenter) * this.cameraToCenterDistance / Math.sin((0, import_util.clamp)(Math.PI - groundAngle - fovAboveCenter, 0.01, Math.PI - 0.01));
|
|
440
|
-
const point = this.point;
|
|
441
|
-
const x = point.x;
|
|
442
|
-
const y = point.y;
|
|
443
|
-
const furthestDistance = Math.cos(Math.PI / 2 - this._pitch) * topHalfSurfaceDistance + this.cameraToCenterDistance;
|
|
444
|
-
const farZ = furthestDistance * 1.01;
|
|
445
|
-
const nearZ = this.height / 50;
|
|
446
|
-
let m = new Float64Array(16);
|
|
447
|
-
import_gl_matrix.mat4.perspective(m, this._fov, this.width / this.height, nearZ, farZ);
|
|
448
|
-
m[8] = -offset.x * 2 / this.width;
|
|
449
|
-
m[9] = offset.y * 2 / this.height;
|
|
450
|
-
import_gl_matrix.mat4.scale(m, m, [1, -1, 1]);
|
|
451
|
-
import_gl_matrix.mat4.translate(m, m, [0, 0, -this.cameraToCenterDistance]);
|
|
452
|
-
import_gl_matrix.mat4.rotateX(m, m, this._pitch);
|
|
453
|
-
import_gl_matrix.mat4.rotateZ(m, m, this.angle);
|
|
454
|
-
import_gl_matrix.mat4.translate(m, m, [-x, -y, 0]);
|
|
455
|
-
this.mercatorMatrix = import_gl_matrix.mat4.scale([], m, [
|
|
456
|
-
this.worldSize,
|
|
457
|
-
this.worldSize,
|
|
458
|
-
this.worldSize
|
|
459
|
-
]);
|
|
460
|
-
import_gl_matrix.mat4.scale(m, m, [
|
|
461
|
-
1,
|
|
462
|
-
1,
|
|
463
|
-
(0, import_mercator.mercatorZfromAltitude)(1, this.center.lat) * this.worldSize,
|
|
464
|
-
1
|
|
465
|
-
]);
|
|
466
|
-
this.projMatrix = m;
|
|
467
|
-
this.invProjMatrix = import_gl_matrix.mat4.invert([], this.projMatrix);
|
|
468
|
-
const xShift = this.width % 2 / 2;
|
|
469
|
-
const yShift = this.height % 2 / 2;
|
|
470
|
-
const angleCos = Math.cos(this.angle);
|
|
471
|
-
const angleSin = Math.sin(this.angle);
|
|
472
|
-
const dx = x - Math.round(x) + angleCos * xShift + angleSin * yShift;
|
|
473
|
-
const dy = y - Math.round(y) + angleCos * yShift + angleSin * xShift;
|
|
474
|
-
const alignedM = new Float64Array(m);
|
|
475
|
-
import_gl_matrix.mat4.translate(alignedM, alignedM, [
|
|
476
|
-
dx > 0.5 ? dx - 1 : dx,
|
|
477
|
-
dy > 0.5 ? dy - 1 : dy,
|
|
478
|
-
0
|
|
479
|
-
]);
|
|
480
|
-
this.alignedProjMatrix = alignedM;
|
|
481
|
-
m = import_gl_matrix.mat4.create();
|
|
482
|
-
import_gl_matrix.mat4.scale(m, m, [this.width / 2, -this.height / 2, 1]);
|
|
483
|
-
import_gl_matrix.mat4.translate(m, m, [1, -1, 0]);
|
|
484
|
-
this.labelPlaneMatrix = m;
|
|
485
|
-
m = import_gl_matrix.mat4.create();
|
|
486
|
-
import_gl_matrix.mat4.scale(m, m, [1, -1, 1]);
|
|
487
|
-
import_gl_matrix.mat4.translate(m, m, [-1, -1, 0]);
|
|
488
|
-
import_gl_matrix.mat4.scale(m, m, [2 / this.width, 2 / this.height, 1]);
|
|
489
|
-
this.glCoordMatrix = m;
|
|
490
|
-
this.pixelMatrix = import_gl_matrix.mat4.multiply(new Float64Array(16), this.labelPlaneMatrix, this.projMatrix);
|
|
491
|
-
m = import_gl_matrix.mat4.invert(new Float64Array(16), this.pixelMatrix);
|
|
492
|
-
if (!m) {
|
|
493
|
-
throw new Error("failed to invert matrix");
|
|
494
|
-
}
|
|
495
|
-
this.pixelMatrixInverse = m;
|
|
496
|
-
this.posMatrixCache = {};
|
|
497
|
-
this.alignedPosMatrixCache = {};
|
|
498
|
-
}
|
|
499
|
-
};
|
|
500
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
501
|
-
0 && (module.exports = {
|
|
502
|
-
EXTENT
|
|
503
|
-
});
|
|
1009
|
+
}]);
|
|
1010
|
+
return Transform;
|
|
1011
|
+
}();
|
|
1012
|
+
|
|
1013
|
+
exports.default = Transform;
|