igs-view 1.0.1
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/dist/main.js +1613 -0
- package/dist/main.js.map +1 -0
- package/package.json +29 -0
- package/types/Main.d.ts +53 -0
package/dist/main.js
ADDED
|
@@ -0,0 +1,1613 @@
|
|
|
1
|
+
(function webpackUniversalModuleDefinition(root, factory) {
|
|
2
|
+
if(typeof exports === 'object' && typeof module === 'object')
|
|
3
|
+
module.exports = factory(require("three"));
|
|
4
|
+
else if(typeof define === 'function' && define.amd)
|
|
5
|
+
define(["three"], factory);
|
|
6
|
+
else {
|
|
7
|
+
var a = typeof exports === 'object' ? factory(require("three")) : factory(root["three"]);
|
|
8
|
+
for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
|
|
9
|
+
}
|
|
10
|
+
})(window, function(__WEBPACK_EXTERNAL_MODULE_three__) {
|
|
11
|
+
return /******/ (function(modules) { // webpackBootstrap
|
|
12
|
+
/******/ // The module cache
|
|
13
|
+
/******/ var installedModules = {};
|
|
14
|
+
/******/
|
|
15
|
+
/******/ // The require function
|
|
16
|
+
/******/ function __webpack_require__(moduleId) {
|
|
17
|
+
/******/
|
|
18
|
+
/******/ // Check if module is in cache
|
|
19
|
+
/******/ if(installedModules[moduleId]) {
|
|
20
|
+
/******/ return installedModules[moduleId].exports;
|
|
21
|
+
/******/ }
|
|
22
|
+
/******/ // Create a new module (and put it into the cache)
|
|
23
|
+
/******/ var module = installedModules[moduleId] = {
|
|
24
|
+
/******/ i: moduleId,
|
|
25
|
+
/******/ l: false,
|
|
26
|
+
/******/ exports: {}
|
|
27
|
+
/******/ };
|
|
28
|
+
/******/
|
|
29
|
+
/******/ // Execute the module function
|
|
30
|
+
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
|
|
31
|
+
/******/
|
|
32
|
+
/******/ // Flag the module as loaded
|
|
33
|
+
/******/ module.l = true;
|
|
34
|
+
/******/
|
|
35
|
+
/******/ // Return the exports of the module
|
|
36
|
+
/******/ return module.exports;
|
|
37
|
+
/******/ }
|
|
38
|
+
/******/
|
|
39
|
+
/******/
|
|
40
|
+
/******/ // expose the modules object (__webpack_modules__)
|
|
41
|
+
/******/ __webpack_require__.m = modules;
|
|
42
|
+
/******/
|
|
43
|
+
/******/ // expose the module cache
|
|
44
|
+
/******/ __webpack_require__.c = installedModules;
|
|
45
|
+
/******/
|
|
46
|
+
/******/ // define getter function for harmony exports
|
|
47
|
+
/******/ __webpack_require__.d = function(exports, name, getter) {
|
|
48
|
+
/******/ if(!__webpack_require__.o(exports, name)) {
|
|
49
|
+
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
|
|
50
|
+
/******/ }
|
|
51
|
+
/******/ };
|
|
52
|
+
/******/
|
|
53
|
+
/******/ // define __esModule on exports
|
|
54
|
+
/******/ __webpack_require__.r = function(exports) {
|
|
55
|
+
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
|
56
|
+
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
57
|
+
/******/ }
|
|
58
|
+
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
|
59
|
+
/******/ };
|
|
60
|
+
/******/
|
|
61
|
+
/******/ // create a fake namespace object
|
|
62
|
+
/******/ // mode & 1: value is a module id, require it
|
|
63
|
+
/******/ // mode & 2: merge all properties of value into the ns
|
|
64
|
+
/******/ // mode & 4: return value when already ns object
|
|
65
|
+
/******/ // mode & 8|1: behave like require
|
|
66
|
+
/******/ __webpack_require__.t = function(value, mode) {
|
|
67
|
+
/******/ if(mode & 1) value = __webpack_require__(value);
|
|
68
|
+
/******/ if(mode & 8) return value;
|
|
69
|
+
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
|
|
70
|
+
/******/ var ns = Object.create(null);
|
|
71
|
+
/******/ __webpack_require__.r(ns);
|
|
72
|
+
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
|
|
73
|
+
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
|
|
74
|
+
/******/ return ns;
|
|
75
|
+
/******/ };
|
|
76
|
+
/******/
|
|
77
|
+
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
78
|
+
/******/ __webpack_require__.n = function(module) {
|
|
79
|
+
/******/ var getter = module && module.__esModule ?
|
|
80
|
+
/******/ function getDefault() { return module['default']; } :
|
|
81
|
+
/******/ function getModuleExports() { return module; };
|
|
82
|
+
/******/ __webpack_require__.d(getter, 'a', getter);
|
|
83
|
+
/******/ return getter;
|
|
84
|
+
/******/ };
|
|
85
|
+
/******/
|
|
86
|
+
/******/ // Object.prototype.hasOwnProperty.call
|
|
87
|
+
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
|
|
88
|
+
/******/
|
|
89
|
+
/******/ // __webpack_public_path__
|
|
90
|
+
/******/ __webpack_require__.p = "";
|
|
91
|
+
/******/
|
|
92
|
+
/******/
|
|
93
|
+
/******/ // Load entry module and return exports
|
|
94
|
+
/******/ return __webpack_require__(__webpack_require__.s = "./src/Main.ts");
|
|
95
|
+
/******/ })
|
|
96
|
+
/************************************************************************/
|
|
97
|
+
/******/ ({
|
|
98
|
+
|
|
99
|
+
/***/ "./node_modules/.pnpm/three@0.139.2/node_modules/three/examples/jsm/controls/OrbitControls.js":
|
|
100
|
+
/*!****************************************************************************************************!*\
|
|
101
|
+
!*** ./node_modules/.pnpm/three@0.139.2/node_modules/three/examples/jsm/controls/OrbitControls.js ***!
|
|
102
|
+
\****************************************************************************************************/
|
|
103
|
+
/*! exports provided: OrbitControls, MapControls */
|
|
104
|
+
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
105
|
+
|
|
106
|
+
"use strict";
|
|
107
|
+
__webpack_require__.r(__webpack_exports__);
|
|
108
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "OrbitControls", function() { return OrbitControls; });
|
|
109
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MapControls", function() { return MapControls; });
|
|
110
|
+
/* harmony import */ var three__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! three */ "three");
|
|
111
|
+
/* harmony import */ var three__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(three__WEBPACK_IMPORTED_MODULE_0__);
|
|
112
|
+
|
|
113
|
+
|
|
114
|
+
// This set of controls performs orbiting, dollying (zooming), and panning.
|
|
115
|
+
// Unlike TrackballControls, it maintains the "up" direction object.up (+Y by default).
|
|
116
|
+
//
|
|
117
|
+
// Orbit - left mouse / touch: one-finger move
|
|
118
|
+
// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish
|
|
119
|
+
// Pan - right mouse, or left mouse + ctrl/meta/shiftKey, or arrow keys / touch: two-finger move
|
|
120
|
+
|
|
121
|
+
const _changeEvent = { type: 'change' };
|
|
122
|
+
const _startEvent = { type: 'start' };
|
|
123
|
+
const _endEvent = { type: 'end' };
|
|
124
|
+
|
|
125
|
+
class OrbitControls extends three__WEBPACK_IMPORTED_MODULE_0__["EventDispatcher"] {
|
|
126
|
+
|
|
127
|
+
constructor( object, domElement ) {
|
|
128
|
+
|
|
129
|
+
super();
|
|
130
|
+
|
|
131
|
+
if ( domElement === undefined ) console.warn( 'THREE.OrbitControls: The second parameter "domElement" is now mandatory.' );
|
|
132
|
+
if ( domElement === document ) console.error( 'THREE.OrbitControls: "document" should not be used as the target "domElement". Please use "renderer.domElement" instead.' );
|
|
133
|
+
|
|
134
|
+
this.object = object;
|
|
135
|
+
this.domElement = domElement;
|
|
136
|
+
this.domElement.style.touchAction = 'none'; // disable touch scroll
|
|
137
|
+
|
|
138
|
+
// Set to false to disable this control
|
|
139
|
+
this.enabled = true;
|
|
140
|
+
|
|
141
|
+
// "target" sets the location of focus, where the object orbits around
|
|
142
|
+
this.target = new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"]();
|
|
143
|
+
|
|
144
|
+
// How far you can dolly in and out ( PerspectiveCamera only )
|
|
145
|
+
this.minDistance = 0;
|
|
146
|
+
this.maxDistance = Infinity;
|
|
147
|
+
|
|
148
|
+
// How far you can zoom in and out ( OrthographicCamera only )
|
|
149
|
+
this.minZoom = 0;
|
|
150
|
+
this.maxZoom = Infinity;
|
|
151
|
+
|
|
152
|
+
// How far you can orbit vertically, upper and lower limits.
|
|
153
|
+
// Range is 0 to Math.PI radians.
|
|
154
|
+
this.minPolarAngle = 0; // radians
|
|
155
|
+
this.maxPolarAngle = Math.PI; // radians
|
|
156
|
+
|
|
157
|
+
// How far you can orbit horizontally, upper and lower limits.
|
|
158
|
+
// If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], with ( max - min < 2 PI )
|
|
159
|
+
this.minAzimuthAngle = - Infinity; // radians
|
|
160
|
+
this.maxAzimuthAngle = Infinity; // radians
|
|
161
|
+
|
|
162
|
+
// Set to true to enable damping (inertia)
|
|
163
|
+
// If damping is enabled, you must call controls.update() in your animation loop
|
|
164
|
+
this.enableDamping = false;
|
|
165
|
+
this.dampingFactor = 0.05;
|
|
166
|
+
|
|
167
|
+
// This option actually enables dollying in and out; left as "zoom" for backwards compatibility.
|
|
168
|
+
// Set to false to disable zooming
|
|
169
|
+
this.enableZoom = true;
|
|
170
|
+
this.zoomSpeed = 1.0;
|
|
171
|
+
|
|
172
|
+
// Set to false to disable rotating
|
|
173
|
+
this.enableRotate = true;
|
|
174
|
+
this.rotateSpeed = 1.0;
|
|
175
|
+
|
|
176
|
+
// Set to false to disable panning
|
|
177
|
+
this.enablePan = true;
|
|
178
|
+
this.panSpeed = 1.0;
|
|
179
|
+
this.screenSpacePanning = true; // if false, pan orthogonal to world-space direction camera.up
|
|
180
|
+
this.keyPanSpeed = 7.0; // pixels moved per arrow key push
|
|
181
|
+
|
|
182
|
+
// Set to true to automatically rotate around the target
|
|
183
|
+
// If auto-rotate is enabled, you must call controls.update() in your animation loop
|
|
184
|
+
this.autoRotate = false;
|
|
185
|
+
this.autoRotateSpeed = 2.0; // 30 seconds per orbit when fps is 60
|
|
186
|
+
|
|
187
|
+
// The four arrow keys
|
|
188
|
+
this.keys = { LEFT: 'ArrowLeft', UP: 'ArrowUp', RIGHT: 'ArrowRight', BOTTOM: 'ArrowDown' };
|
|
189
|
+
|
|
190
|
+
// Mouse buttons
|
|
191
|
+
this.mouseButtons = { LEFT: three__WEBPACK_IMPORTED_MODULE_0__["MOUSE"].ROTATE, MIDDLE: three__WEBPACK_IMPORTED_MODULE_0__["MOUSE"].DOLLY, RIGHT: three__WEBPACK_IMPORTED_MODULE_0__["MOUSE"].PAN };
|
|
192
|
+
|
|
193
|
+
// Touch fingers
|
|
194
|
+
this.touches = { ONE: three__WEBPACK_IMPORTED_MODULE_0__["TOUCH"].ROTATE, TWO: three__WEBPACK_IMPORTED_MODULE_0__["TOUCH"].DOLLY_PAN };
|
|
195
|
+
|
|
196
|
+
// for reset
|
|
197
|
+
this.target0 = this.target.clone();
|
|
198
|
+
this.position0 = this.object.position.clone();
|
|
199
|
+
this.zoom0 = this.object.zoom;
|
|
200
|
+
|
|
201
|
+
// the target DOM element for key events
|
|
202
|
+
this._domElementKeyEvents = null;
|
|
203
|
+
|
|
204
|
+
//
|
|
205
|
+
// public methods
|
|
206
|
+
//
|
|
207
|
+
|
|
208
|
+
this.getPolarAngle = function () {
|
|
209
|
+
|
|
210
|
+
return spherical.phi;
|
|
211
|
+
|
|
212
|
+
};
|
|
213
|
+
|
|
214
|
+
this.getAzimuthalAngle = function () {
|
|
215
|
+
|
|
216
|
+
return spherical.theta;
|
|
217
|
+
|
|
218
|
+
};
|
|
219
|
+
|
|
220
|
+
this.getDistance = function () {
|
|
221
|
+
|
|
222
|
+
return this.object.position.distanceTo( this.target );
|
|
223
|
+
|
|
224
|
+
};
|
|
225
|
+
|
|
226
|
+
this.listenToKeyEvents = function ( domElement ) {
|
|
227
|
+
|
|
228
|
+
domElement.addEventListener( 'keydown', onKeyDown );
|
|
229
|
+
this._domElementKeyEvents = domElement;
|
|
230
|
+
|
|
231
|
+
};
|
|
232
|
+
|
|
233
|
+
this.saveState = function () {
|
|
234
|
+
|
|
235
|
+
scope.target0.copy( scope.target );
|
|
236
|
+
scope.position0.copy( scope.object.position );
|
|
237
|
+
scope.zoom0 = scope.object.zoom;
|
|
238
|
+
|
|
239
|
+
};
|
|
240
|
+
|
|
241
|
+
this.reset = function () {
|
|
242
|
+
|
|
243
|
+
scope.target.copy( scope.target0 );
|
|
244
|
+
scope.object.position.copy( scope.position0 );
|
|
245
|
+
scope.object.zoom = scope.zoom0;
|
|
246
|
+
|
|
247
|
+
scope.object.updateProjectionMatrix();
|
|
248
|
+
scope.dispatchEvent( _changeEvent );
|
|
249
|
+
|
|
250
|
+
scope.update();
|
|
251
|
+
|
|
252
|
+
state = STATE.NONE;
|
|
253
|
+
|
|
254
|
+
};
|
|
255
|
+
|
|
256
|
+
// this method is exposed, but perhaps it would be better if we can make it private...
|
|
257
|
+
this.update = function () {
|
|
258
|
+
|
|
259
|
+
const offset = new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"]();
|
|
260
|
+
|
|
261
|
+
// so camera.up is the orbit axis
|
|
262
|
+
const quat = new three__WEBPACK_IMPORTED_MODULE_0__["Quaternion"]().setFromUnitVectors( object.up, new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"]( 0, 1, 0 ) );
|
|
263
|
+
const quatInverse = quat.clone().invert();
|
|
264
|
+
|
|
265
|
+
const lastPosition = new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"]();
|
|
266
|
+
const lastQuaternion = new three__WEBPACK_IMPORTED_MODULE_0__["Quaternion"]();
|
|
267
|
+
|
|
268
|
+
const twoPI = 2 * Math.PI;
|
|
269
|
+
|
|
270
|
+
return function update() {
|
|
271
|
+
|
|
272
|
+
const position = scope.object.position;
|
|
273
|
+
|
|
274
|
+
offset.copy( position ).sub( scope.target );
|
|
275
|
+
|
|
276
|
+
// rotate offset to "y-axis-is-up" space
|
|
277
|
+
offset.applyQuaternion( quat );
|
|
278
|
+
|
|
279
|
+
// angle from z-axis around y-axis
|
|
280
|
+
spherical.setFromVector3( offset );
|
|
281
|
+
|
|
282
|
+
if ( scope.autoRotate && state === STATE.NONE ) {
|
|
283
|
+
|
|
284
|
+
rotateLeft( getAutoRotationAngle() );
|
|
285
|
+
|
|
286
|
+
}
|
|
287
|
+
|
|
288
|
+
if ( scope.enableDamping ) {
|
|
289
|
+
|
|
290
|
+
spherical.theta += sphericalDelta.theta * scope.dampingFactor;
|
|
291
|
+
spherical.phi += sphericalDelta.phi * scope.dampingFactor;
|
|
292
|
+
|
|
293
|
+
} else {
|
|
294
|
+
|
|
295
|
+
spherical.theta += sphericalDelta.theta;
|
|
296
|
+
spherical.phi += sphericalDelta.phi;
|
|
297
|
+
|
|
298
|
+
}
|
|
299
|
+
|
|
300
|
+
// restrict theta to be between desired limits
|
|
301
|
+
|
|
302
|
+
let min = scope.minAzimuthAngle;
|
|
303
|
+
let max = scope.maxAzimuthAngle;
|
|
304
|
+
|
|
305
|
+
if ( isFinite( min ) && isFinite( max ) ) {
|
|
306
|
+
|
|
307
|
+
if ( min < - Math.PI ) min += twoPI; else if ( min > Math.PI ) min -= twoPI;
|
|
308
|
+
|
|
309
|
+
if ( max < - Math.PI ) max += twoPI; else if ( max > Math.PI ) max -= twoPI;
|
|
310
|
+
|
|
311
|
+
if ( min <= max ) {
|
|
312
|
+
|
|
313
|
+
spherical.theta = Math.max( min, Math.min( max, spherical.theta ) );
|
|
314
|
+
|
|
315
|
+
} else {
|
|
316
|
+
|
|
317
|
+
spherical.theta = ( spherical.theta > ( min + max ) / 2 ) ?
|
|
318
|
+
Math.max( min, spherical.theta ) :
|
|
319
|
+
Math.min( max, spherical.theta );
|
|
320
|
+
|
|
321
|
+
}
|
|
322
|
+
|
|
323
|
+
}
|
|
324
|
+
|
|
325
|
+
// restrict phi to be between desired limits
|
|
326
|
+
spherical.phi = Math.max( scope.minPolarAngle, Math.min( scope.maxPolarAngle, spherical.phi ) );
|
|
327
|
+
|
|
328
|
+
spherical.makeSafe();
|
|
329
|
+
|
|
330
|
+
|
|
331
|
+
spherical.radius *= scale;
|
|
332
|
+
|
|
333
|
+
// restrict radius to be between desired limits
|
|
334
|
+
spherical.radius = Math.max( scope.minDistance, Math.min( scope.maxDistance, spherical.radius ) );
|
|
335
|
+
|
|
336
|
+
// move target to panned location
|
|
337
|
+
|
|
338
|
+
if ( scope.enableDamping === true ) {
|
|
339
|
+
|
|
340
|
+
scope.target.addScaledVector( panOffset, scope.dampingFactor );
|
|
341
|
+
|
|
342
|
+
} else {
|
|
343
|
+
|
|
344
|
+
scope.target.add( panOffset );
|
|
345
|
+
|
|
346
|
+
}
|
|
347
|
+
|
|
348
|
+
offset.setFromSpherical( spherical );
|
|
349
|
+
|
|
350
|
+
// rotate offset back to "camera-up-vector-is-up" space
|
|
351
|
+
offset.applyQuaternion( quatInverse );
|
|
352
|
+
|
|
353
|
+
position.copy( scope.target ).add( offset );
|
|
354
|
+
|
|
355
|
+
scope.object.lookAt( scope.target );
|
|
356
|
+
|
|
357
|
+
if ( scope.enableDamping === true ) {
|
|
358
|
+
|
|
359
|
+
sphericalDelta.theta *= ( 1 - scope.dampingFactor );
|
|
360
|
+
sphericalDelta.phi *= ( 1 - scope.dampingFactor );
|
|
361
|
+
|
|
362
|
+
panOffset.multiplyScalar( 1 - scope.dampingFactor );
|
|
363
|
+
|
|
364
|
+
} else {
|
|
365
|
+
|
|
366
|
+
sphericalDelta.set( 0, 0, 0 );
|
|
367
|
+
|
|
368
|
+
panOffset.set( 0, 0, 0 );
|
|
369
|
+
|
|
370
|
+
}
|
|
371
|
+
|
|
372
|
+
scale = 1;
|
|
373
|
+
|
|
374
|
+
// update condition is:
|
|
375
|
+
// min(camera displacement, camera rotation in radians)^2 > EPS
|
|
376
|
+
// using small-angle approximation cos(x/2) = 1 - x^2 / 8
|
|
377
|
+
|
|
378
|
+
if ( zoomChanged ||
|
|
379
|
+
lastPosition.distanceToSquared( scope.object.position ) > EPS ||
|
|
380
|
+
8 * ( 1 - lastQuaternion.dot( scope.object.quaternion ) ) > EPS ) {
|
|
381
|
+
|
|
382
|
+
scope.dispatchEvent( _changeEvent );
|
|
383
|
+
|
|
384
|
+
lastPosition.copy( scope.object.position );
|
|
385
|
+
lastQuaternion.copy( scope.object.quaternion );
|
|
386
|
+
zoomChanged = false;
|
|
387
|
+
|
|
388
|
+
return true;
|
|
389
|
+
|
|
390
|
+
}
|
|
391
|
+
|
|
392
|
+
return false;
|
|
393
|
+
|
|
394
|
+
};
|
|
395
|
+
|
|
396
|
+
}();
|
|
397
|
+
|
|
398
|
+
this.dispose = function () {
|
|
399
|
+
|
|
400
|
+
scope.domElement.removeEventListener( 'contextmenu', onContextMenu );
|
|
401
|
+
|
|
402
|
+
scope.domElement.removeEventListener( 'pointerdown', onPointerDown );
|
|
403
|
+
scope.domElement.removeEventListener( 'pointercancel', onPointerCancel );
|
|
404
|
+
scope.domElement.removeEventListener( 'wheel', onMouseWheel );
|
|
405
|
+
|
|
406
|
+
scope.domElement.removeEventListener( 'pointermove', onPointerMove );
|
|
407
|
+
scope.domElement.removeEventListener( 'pointerup', onPointerUp );
|
|
408
|
+
|
|
409
|
+
|
|
410
|
+
if ( scope._domElementKeyEvents !== null ) {
|
|
411
|
+
|
|
412
|
+
scope._domElementKeyEvents.removeEventListener( 'keydown', onKeyDown );
|
|
413
|
+
|
|
414
|
+
}
|
|
415
|
+
|
|
416
|
+
//scope.dispatchEvent( { type: 'dispose' } ); // should this be added here?
|
|
417
|
+
|
|
418
|
+
};
|
|
419
|
+
|
|
420
|
+
//
|
|
421
|
+
// internals
|
|
422
|
+
//
|
|
423
|
+
|
|
424
|
+
const scope = this;
|
|
425
|
+
|
|
426
|
+
const STATE = {
|
|
427
|
+
NONE: - 1,
|
|
428
|
+
ROTATE: 0,
|
|
429
|
+
DOLLY: 1,
|
|
430
|
+
PAN: 2,
|
|
431
|
+
TOUCH_ROTATE: 3,
|
|
432
|
+
TOUCH_PAN: 4,
|
|
433
|
+
TOUCH_DOLLY_PAN: 5,
|
|
434
|
+
TOUCH_DOLLY_ROTATE: 6
|
|
435
|
+
};
|
|
436
|
+
|
|
437
|
+
let state = STATE.NONE;
|
|
438
|
+
|
|
439
|
+
const EPS = 0.000001;
|
|
440
|
+
|
|
441
|
+
// current position in spherical coordinates
|
|
442
|
+
const spherical = new three__WEBPACK_IMPORTED_MODULE_0__["Spherical"]();
|
|
443
|
+
const sphericalDelta = new three__WEBPACK_IMPORTED_MODULE_0__["Spherical"]();
|
|
444
|
+
|
|
445
|
+
let scale = 1;
|
|
446
|
+
const panOffset = new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"]();
|
|
447
|
+
let zoomChanged = false;
|
|
448
|
+
|
|
449
|
+
const rotateStart = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
450
|
+
const rotateEnd = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
451
|
+
const rotateDelta = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
452
|
+
|
|
453
|
+
const panStart = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
454
|
+
const panEnd = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
455
|
+
const panDelta = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
456
|
+
|
|
457
|
+
const dollyStart = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
458
|
+
const dollyEnd = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
459
|
+
const dollyDelta = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
460
|
+
|
|
461
|
+
const pointers = [];
|
|
462
|
+
const pointerPositions = {};
|
|
463
|
+
|
|
464
|
+
function getAutoRotationAngle() {
|
|
465
|
+
|
|
466
|
+
return 2 * Math.PI / 60 / 60 * scope.autoRotateSpeed;
|
|
467
|
+
|
|
468
|
+
}
|
|
469
|
+
|
|
470
|
+
function getZoomScale() {
|
|
471
|
+
|
|
472
|
+
return Math.pow( 0.95, scope.zoomSpeed );
|
|
473
|
+
|
|
474
|
+
}
|
|
475
|
+
|
|
476
|
+
function rotateLeft( angle ) {
|
|
477
|
+
|
|
478
|
+
sphericalDelta.theta -= angle;
|
|
479
|
+
|
|
480
|
+
}
|
|
481
|
+
|
|
482
|
+
function rotateUp( angle ) {
|
|
483
|
+
|
|
484
|
+
sphericalDelta.phi -= angle;
|
|
485
|
+
|
|
486
|
+
}
|
|
487
|
+
|
|
488
|
+
const panLeft = function () {
|
|
489
|
+
|
|
490
|
+
const v = new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"]();
|
|
491
|
+
|
|
492
|
+
return function panLeft( distance, objectMatrix ) {
|
|
493
|
+
|
|
494
|
+
v.setFromMatrixColumn( objectMatrix, 0 ); // get X column of objectMatrix
|
|
495
|
+
v.multiplyScalar( - distance );
|
|
496
|
+
|
|
497
|
+
panOffset.add( v );
|
|
498
|
+
|
|
499
|
+
};
|
|
500
|
+
|
|
501
|
+
}();
|
|
502
|
+
|
|
503
|
+
const panUp = function () {
|
|
504
|
+
|
|
505
|
+
const v = new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"]();
|
|
506
|
+
|
|
507
|
+
return function panUp( distance, objectMatrix ) {
|
|
508
|
+
|
|
509
|
+
if ( scope.screenSpacePanning === true ) {
|
|
510
|
+
|
|
511
|
+
v.setFromMatrixColumn( objectMatrix, 1 );
|
|
512
|
+
|
|
513
|
+
} else {
|
|
514
|
+
|
|
515
|
+
v.setFromMatrixColumn( objectMatrix, 0 );
|
|
516
|
+
v.crossVectors( scope.object.up, v );
|
|
517
|
+
|
|
518
|
+
}
|
|
519
|
+
|
|
520
|
+
v.multiplyScalar( distance );
|
|
521
|
+
|
|
522
|
+
panOffset.add( v );
|
|
523
|
+
|
|
524
|
+
};
|
|
525
|
+
|
|
526
|
+
}();
|
|
527
|
+
|
|
528
|
+
// deltaX and deltaY are in pixels; right and down are positive
|
|
529
|
+
const pan = function () {
|
|
530
|
+
|
|
531
|
+
const offset = new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"]();
|
|
532
|
+
|
|
533
|
+
return function pan( deltaX, deltaY ) {
|
|
534
|
+
|
|
535
|
+
const element = scope.domElement;
|
|
536
|
+
|
|
537
|
+
if ( scope.object.isPerspectiveCamera ) {
|
|
538
|
+
|
|
539
|
+
// perspective
|
|
540
|
+
const position = scope.object.position;
|
|
541
|
+
offset.copy( position ).sub( scope.target );
|
|
542
|
+
let targetDistance = offset.length();
|
|
543
|
+
|
|
544
|
+
// half of the fov is center to top of screen
|
|
545
|
+
targetDistance *= Math.tan( ( scope.object.fov / 2 ) * Math.PI / 180.0 );
|
|
546
|
+
|
|
547
|
+
// we use only clientHeight here so aspect ratio does not distort speed
|
|
548
|
+
panLeft( 2 * deltaX * targetDistance / element.clientHeight, scope.object.matrix );
|
|
549
|
+
panUp( 2 * deltaY * targetDistance / element.clientHeight, scope.object.matrix );
|
|
550
|
+
|
|
551
|
+
} else if ( scope.object.isOrthographicCamera ) {
|
|
552
|
+
|
|
553
|
+
// orthographic
|
|
554
|
+
panLeft( deltaX * ( scope.object.right - scope.object.left ) / scope.object.zoom / element.clientWidth, scope.object.matrix );
|
|
555
|
+
panUp( deltaY * ( scope.object.top - scope.object.bottom ) / scope.object.zoom / element.clientHeight, scope.object.matrix );
|
|
556
|
+
|
|
557
|
+
} else {
|
|
558
|
+
|
|
559
|
+
// camera neither orthographic nor perspective
|
|
560
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - pan disabled.' );
|
|
561
|
+
scope.enablePan = false;
|
|
562
|
+
|
|
563
|
+
}
|
|
564
|
+
|
|
565
|
+
};
|
|
566
|
+
|
|
567
|
+
}();
|
|
568
|
+
|
|
569
|
+
function dollyOut( dollyScale ) {
|
|
570
|
+
|
|
571
|
+
if ( scope.object.isPerspectiveCamera ) {
|
|
572
|
+
|
|
573
|
+
scale /= dollyScale;
|
|
574
|
+
|
|
575
|
+
} else if ( scope.object.isOrthographicCamera ) {
|
|
576
|
+
|
|
577
|
+
scope.object.zoom = Math.max( scope.minZoom, Math.min( scope.maxZoom, scope.object.zoom * dollyScale ) );
|
|
578
|
+
scope.object.updateProjectionMatrix();
|
|
579
|
+
zoomChanged = true;
|
|
580
|
+
|
|
581
|
+
} else {
|
|
582
|
+
|
|
583
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.' );
|
|
584
|
+
scope.enableZoom = false;
|
|
585
|
+
|
|
586
|
+
}
|
|
587
|
+
|
|
588
|
+
}
|
|
589
|
+
|
|
590
|
+
function dollyIn( dollyScale ) {
|
|
591
|
+
|
|
592
|
+
if ( scope.object.isPerspectiveCamera ) {
|
|
593
|
+
|
|
594
|
+
scale *= dollyScale;
|
|
595
|
+
|
|
596
|
+
} else if ( scope.object.isOrthographicCamera ) {
|
|
597
|
+
|
|
598
|
+
scope.object.zoom = Math.max( scope.minZoom, Math.min( scope.maxZoom, scope.object.zoom / dollyScale ) );
|
|
599
|
+
scope.object.updateProjectionMatrix();
|
|
600
|
+
zoomChanged = true;
|
|
601
|
+
|
|
602
|
+
} else {
|
|
603
|
+
|
|
604
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.' );
|
|
605
|
+
scope.enableZoom = false;
|
|
606
|
+
|
|
607
|
+
}
|
|
608
|
+
|
|
609
|
+
}
|
|
610
|
+
|
|
611
|
+
//
|
|
612
|
+
// event callbacks - update the object state
|
|
613
|
+
//
|
|
614
|
+
|
|
615
|
+
function handleMouseDownRotate( event ) {
|
|
616
|
+
|
|
617
|
+
rotateStart.set( event.clientX, event.clientY );
|
|
618
|
+
|
|
619
|
+
}
|
|
620
|
+
|
|
621
|
+
function handleMouseDownDolly( event ) {
|
|
622
|
+
|
|
623
|
+
dollyStart.set( event.clientX, event.clientY );
|
|
624
|
+
|
|
625
|
+
}
|
|
626
|
+
|
|
627
|
+
function handleMouseDownPan( event ) {
|
|
628
|
+
|
|
629
|
+
panStart.set( event.clientX, event.clientY );
|
|
630
|
+
|
|
631
|
+
}
|
|
632
|
+
|
|
633
|
+
function handleMouseMoveRotate( event ) {
|
|
634
|
+
|
|
635
|
+
rotateEnd.set( event.clientX, event.clientY );
|
|
636
|
+
|
|
637
|
+
rotateDelta.subVectors( rotateEnd, rotateStart ).multiplyScalar( scope.rotateSpeed );
|
|
638
|
+
|
|
639
|
+
const element = scope.domElement;
|
|
640
|
+
|
|
641
|
+
rotateLeft( 2 * Math.PI * rotateDelta.x / element.clientHeight ); // yes, height
|
|
642
|
+
|
|
643
|
+
rotateUp( 2 * Math.PI * rotateDelta.y / element.clientHeight );
|
|
644
|
+
|
|
645
|
+
rotateStart.copy( rotateEnd );
|
|
646
|
+
|
|
647
|
+
scope.update();
|
|
648
|
+
|
|
649
|
+
}
|
|
650
|
+
|
|
651
|
+
function handleMouseMoveDolly( event ) {
|
|
652
|
+
|
|
653
|
+
dollyEnd.set( event.clientX, event.clientY );
|
|
654
|
+
|
|
655
|
+
dollyDelta.subVectors( dollyEnd, dollyStart );
|
|
656
|
+
|
|
657
|
+
if ( dollyDelta.y > 0 ) {
|
|
658
|
+
|
|
659
|
+
dollyOut( getZoomScale() );
|
|
660
|
+
|
|
661
|
+
} else if ( dollyDelta.y < 0 ) {
|
|
662
|
+
|
|
663
|
+
dollyIn( getZoomScale() );
|
|
664
|
+
|
|
665
|
+
}
|
|
666
|
+
|
|
667
|
+
dollyStart.copy( dollyEnd );
|
|
668
|
+
|
|
669
|
+
scope.update();
|
|
670
|
+
|
|
671
|
+
}
|
|
672
|
+
|
|
673
|
+
function handleMouseMovePan( event ) {
|
|
674
|
+
|
|
675
|
+
panEnd.set( event.clientX, event.clientY );
|
|
676
|
+
|
|
677
|
+
panDelta.subVectors( panEnd, panStart ).multiplyScalar( scope.panSpeed );
|
|
678
|
+
|
|
679
|
+
pan( panDelta.x, panDelta.y );
|
|
680
|
+
|
|
681
|
+
panStart.copy( panEnd );
|
|
682
|
+
|
|
683
|
+
scope.update();
|
|
684
|
+
|
|
685
|
+
}
|
|
686
|
+
|
|
687
|
+
function handleMouseWheel( event ) {
|
|
688
|
+
|
|
689
|
+
if ( event.deltaY < 0 ) {
|
|
690
|
+
|
|
691
|
+
dollyIn( getZoomScale() );
|
|
692
|
+
|
|
693
|
+
} else if ( event.deltaY > 0 ) {
|
|
694
|
+
|
|
695
|
+
dollyOut( getZoomScale() );
|
|
696
|
+
|
|
697
|
+
}
|
|
698
|
+
|
|
699
|
+
scope.update();
|
|
700
|
+
|
|
701
|
+
}
|
|
702
|
+
|
|
703
|
+
function handleKeyDown( event ) {
|
|
704
|
+
|
|
705
|
+
let needsUpdate = false;
|
|
706
|
+
|
|
707
|
+
switch ( event.code ) {
|
|
708
|
+
|
|
709
|
+
case scope.keys.UP:
|
|
710
|
+
pan( 0, scope.keyPanSpeed );
|
|
711
|
+
needsUpdate = true;
|
|
712
|
+
break;
|
|
713
|
+
|
|
714
|
+
case scope.keys.BOTTOM:
|
|
715
|
+
pan( 0, - scope.keyPanSpeed );
|
|
716
|
+
needsUpdate = true;
|
|
717
|
+
break;
|
|
718
|
+
|
|
719
|
+
case scope.keys.LEFT:
|
|
720
|
+
pan( scope.keyPanSpeed, 0 );
|
|
721
|
+
needsUpdate = true;
|
|
722
|
+
break;
|
|
723
|
+
|
|
724
|
+
case scope.keys.RIGHT:
|
|
725
|
+
pan( - scope.keyPanSpeed, 0 );
|
|
726
|
+
needsUpdate = true;
|
|
727
|
+
break;
|
|
728
|
+
|
|
729
|
+
}
|
|
730
|
+
|
|
731
|
+
if ( needsUpdate ) {
|
|
732
|
+
|
|
733
|
+
// prevent the browser from scrolling on cursor keys
|
|
734
|
+
event.preventDefault();
|
|
735
|
+
|
|
736
|
+
scope.update();
|
|
737
|
+
|
|
738
|
+
}
|
|
739
|
+
|
|
740
|
+
|
|
741
|
+
}
|
|
742
|
+
|
|
743
|
+
function handleTouchStartRotate() {
|
|
744
|
+
|
|
745
|
+
if ( pointers.length === 1 ) {
|
|
746
|
+
|
|
747
|
+
rotateStart.set( pointers[ 0 ].pageX, pointers[ 0 ].pageY );
|
|
748
|
+
|
|
749
|
+
} else {
|
|
750
|
+
|
|
751
|
+
const x = 0.5 * ( pointers[ 0 ].pageX + pointers[ 1 ].pageX );
|
|
752
|
+
const y = 0.5 * ( pointers[ 0 ].pageY + pointers[ 1 ].pageY );
|
|
753
|
+
|
|
754
|
+
rotateStart.set( x, y );
|
|
755
|
+
|
|
756
|
+
}
|
|
757
|
+
|
|
758
|
+
}
|
|
759
|
+
|
|
760
|
+
function handleTouchStartPan() {
|
|
761
|
+
|
|
762
|
+
if ( pointers.length === 1 ) {
|
|
763
|
+
|
|
764
|
+
panStart.set( pointers[ 0 ].pageX, pointers[ 0 ].pageY );
|
|
765
|
+
|
|
766
|
+
} else {
|
|
767
|
+
|
|
768
|
+
const x = 0.5 * ( pointers[ 0 ].pageX + pointers[ 1 ].pageX );
|
|
769
|
+
const y = 0.5 * ( pointers[ 0 ].pageY + pointers[ 1 ].pageY );
|
|
770
|
+
|
|
771
|
+
panStart.set( x, y );
|
|
772
|
+
|
|
773
|
+
}
|
|
774
|
+
|
|
775
|
+
}
|
|
776
|
+
|
|
777
|
+
function handleTouchStartDolly() {
|
|
778
|
+
|
|
779
|
+
const dx = pointers[ 0 ].pageX - pointers[ 1 ].pageX;
|
|
780
|
+
const dy = pointers[ 0 ].pageY - pointers[ 1 ].pageY;
|
|
781
|
+
|
|
782
|
+
const distance = Math.sqrt( dx * dx + dy * dy );
|
|
783
|
+
|
|
784
|
+
dollyStart.set( 0, distance );
|
|
785
|
+
|
|
786
|
+
}
|
|
787
|
+
|
|
788
|
+
function handleTouchStartDollyPan() {
|
|
789
|
+
|
|
790
|
+
if ( scope.enableZoom ) handleTouchStartDolly();
|
|
791
|
+
|
|
792
|
+
if ( scope.enablePan ) handleTouchStartPan();
|
|
793
|
+
|
|
794
|
+
}
|
|
795
|
+
|
|
796
|
+
function handleTouchStartDollyRotate() {
|
|
797
|
+
|
|
798
|
+
if ( scope.enableZoom ) handleTouchStartDolly();
|
|
799
|
+
|
|
800
|
+
if ( scope.enableRotate ) handleTouchStartRotate();
|
|
801
|
+
|
|
802
|
+
}
|
|
803
|
+
|
|
804
|
+
function handleTouchMoveRotate( event ) {
|
|
805
|
+
|
|
806
|
+
if ( pointers.length == 1 ) {
|
|
807
|
+
|
|
808
|
+
rotateEnd.set( event.pageX, event.pageY );
|
|
809
|
+
|
|
810
|
+
} else {
|
|
811
|
+
|
|
812
|
+
const position = getSecondPointerPosition( event );
|
|
813
|
+
|
|
814
|
+
const x = 0.5 * ( event.pageX + position.x );
|
|
815
|
+
const y = 0.5 * ( event.pageY + position.y );
|
|
816
|
+
|
|
817
|
+
rotateEnd.set( x, y );
|
|
818
|
+
|
|
819
|
+
}
|
|
820
|
+
|
|
821
|
+
rotateDelta.subVectors( rotateEnd, rotateStart ).multiplyScalar( scope.rotateSpeed );
|
|
822
|
+
|
|
823
|
+
const element = scope.domElement;
|
|
824
|
+
|
|
825
|
+
rotateLeft( 2 * Math.PI * rotateDelta.x / element.clientHeight ); // yes, height
|
|
826
|
+
|
|
827
|
+
rotateUp( 2 * Math.PI * rotateDelta.y / element.clientHeight );
|
|
828
|
+
|
|
829
|
+
rotateStart.copy( rotateEnd );
|
|
830
|
+
|
|
831
|
+
}
|
|
832
|
+
|
|
833
|
+
function handleTouchMovePan( event ) {
|
|
834
|
+
|
|
835
|
+
if ( pointers.length === 1 ) {
|
|
836
|
+
|
|
837
|
+
panEnd.set( event.pageX, event.pageY );
|
|
838
|
+
|
|
839
|
+
} else {
|
|
840
|
+
|
|
841
|
+
const position = getSecondPointerPosition( event );
|
|
842
|
+
|
|
843
|
+
const x = 0.5 * ( event.pageX + position.x );
|
|
844
|
+
const y = 0.5 * ( event.pageY + position.y );
|
|
845
|
+
|
|
846
|
+
panEnd.set( x, y );
|
|
847
|
+
|
|
848
|
+
}
|
|
849
|
+
|
|
850
|
+
panDelta.subVectors( panEnd, panStart ).multiplyScalar( scope.panSpeed );
|
|
851
|
+
|
|
852
|
+
pan( panDelta.x, panDelta.y );
|
|
853
|
+
|
|
854
|
+
panStart.copy( panEnd );
|
|
855
|
+
|
|
856
|
+
}
|
|
857
|
+
|
|
858
|
+
function handleTouchMoveDolly( event ) {
|
|
859
|
+
|
|
860
|
+
const position = getSecondPointerPosition( event );
|
|
861
|
+
|
|
862
|
+
const dx = event.pageX - position.x;
|
|
863
|
+
const dy = event.pageY - position.y;
|
|
864
|
+
|
|
865
|
+
const distance = Math.sqrt( dx * dx + dy * dy );
|
|
866
|
+
|
|
867
|
+
dollyEnd.set( 0, distance );
|
|
868
|
+
|
|
869
|
+
dollyDelta.set( 0, Math.pow( dollyEnd.y / dollyStart.y, scope.zoomSpeed ) );
|
|
870
|
+
|
|
871
|
+
dollyOut( dollyDelta.y );
|
|
872
|
+
|
|
873
|
+
dollyStart.copy( dollyEnd );
|
|
874
|
+
|
|
875
|
+
}
|
|
876
|
+
|
|
877
|
+
function handleTouchMoveDollyPan( event ) {
|
|
878
|
+
|
|
879
|
+
if ( scope.enableZoom ) handleTouchMoveDolly( event );
|
|
880
|
+
|
|
881
|
+
if ( scope.enablePan ) handleTouchMovePan( event );
|
|
882
|
+
|
|
883
|
+
}
|
|
884
|
+
|
|
885
|
+
function handleTouchMoveDollyRotate( event ) {
|
|
886
|
+
|
|
887
|
+
if ( scope.enableZoom ) handleTouchMoveDolly( event );
|
|
888
|
+
|
|
889
|
+
if ( scope.enableRotate ) handleTouchMoveRotate( event );
|
|
890
|
+
|
|
891
|
+
}
|
|
892
|
+
|
|
893
|
+
//
|
|
894
|
+
// event handlers - FSM: listen for events and reset state
|
|
895
|
+
//
|
|
896
|
+
|
|
897
|
+
function onPointerDown( event ) {
|
|
898
|
+
|
|
899
|
+
if ( scope.enabled === false ) return;
|
|
900
|
+
|
|
901
|
+
if ( pointers.length === 0 ) {
|
|
902
|
+
|
|
903
|
+
scope.domElement.setPointerCapture( event.pointerId );
|
|
904
|
+
|
|
905
|
+
scope.domElement.addEventListener( 'pointermove', onPointerMove );
|
|
906
|
+
scope.domElement.addEventListener( 'pointerup', onPointerUp );
|
|
907
|
+
|
|
908
|
+
}
|
|
909
|
+
|
|
910
|
+
//
|
|
911
|
+
|
|
912
|
+
addPointer( event );
|
|
913
|
+
|
|
914
|
+
if ( event.pointerType === 'touch' ) {
|
|
915
|
+
|
|
916
|
+
onTouchStart( event );
|
|
917
|
+
|
|
918
|
+
} else {
|
|
919
|
+
|
|
920
|
+
onMouseDown( event );
|
|
921
|
+
|
|
922
|
+
}
|
|
923
|
+
|
|
924
|
+
}
|
|
925
|
+
|
|
926
|
+
function onPointerMove( event ) {
|
|
927
|
+
|
|
928
|
+
if ( scope.enabled === false ) return;
|
|
929
|
+
|
|
930
|
+
if ( event.pointerType === 'touch' ) {
|
|
931
|
+
|
|
932
|
+
onTouchMove( event );
|
|
933
|
+
|
|
934
|
+
} else {
|
|
935
|
+
|
|
936
|
+
onMouseMove( event );
|
|
937
|
+
|
|
938
|
+
}
|
|
939
|
+
|
|
940
|
+
}
|
|
941
|
+
|
|
942
|
+
function onPointerUp( event ) {
|
|
943
|
+
|
|
944
|
+
removePointer( event );
|
|
945
|
+
|
|
946
|
+
if ( pointers.length === 0 ) {
|
|
947
|
+
|
|
948
|
+
scope.domElement.releasePointerCapture( event.pointerId );
|
|
949
|
+
|
|
950
|
+
scope.domElement.removeEventListener( 'pointermove', onPointerMove );
|
|
951
|
+
scope.domElement.removeEventListener( 'pointerup', onPointerUp );
|
|
952
|
+
|
|
953
|
+
}
|
|
954
|
+
|
|
955
|
+
scope.dispatchEvent( _endEvent );
|
|
956
|
+
|
|
957
|
+
state = STATE.NONE;
|
|
958
|
+
|
|
959
|
+
}
|
|
960
|
+
|
|
961
|
+
function onPointerCancel( event ) {
|
|
962
|
+
|
|
963
|
+
removePointer( event );
|
|
964
|
+
|
|
965
|
+
}
|
|
966
|
+
|
|
967
|
+
function onMouseDown( event ) {
|
|
968
|
+
|
|
969
|
+
let mouseAction;
|
|
970
|
+
|
|
971
|
+
switch ( event.button ) {
|
|
972
|
+
|
|
973
|
+
case 0:
|
|
974
|
+
|
|
975
|
+
mouseAction = scope.mouseButtons.LEFT;
|
|
976
|
+
break;
|
|
977
|
+
|
|
978
|
+
case 1:
|
|
979
|
+
|
|
980
|
+
mouseAction = scope.mouseButtons.MIDDLE;
|
|
981
|
+
break;
|
|
982
|
+
|
|
983
|
+
case 2:
|
|
984
|
+
|
|
985
|
+
mouseAction = scope.mouseButtons.RIGHT;
|
|
986
|
+
break;
|
|
987
|
+
|
|
988
|
+
default:
|
|
989
|
+
|
|
990
|
+
mouseAction = - 1;
|
|
991
|
+
|
|
992
|
+
}
|
|
993
|
+
|
|
994
|
+
switch ( mouseAction ) {
|
|
995
|
+
|
|
996
|
+
case three__WEBPACK_IMPORTED_MODULE_0__["MOUSE"].DOLLY:
|
|
997
|
+
|
|
998
|
+
if ( scope.enableZoom === false ) return;
|
|
999
|
+
|
|
1000
|
+
handleMouseDownDolly( event );
|
|
1001
|
+
|
|
1002
|
+
state = STATE.DOLLY;
|
|
1003
|
+
|
|
1004
|
+
break;
|
|
1005
|
+
|
|
1006
|
+
case three__WEBPACK_IMPORTED_MODULE_0__["MOUSE"].ROTATE:
|
|
1007
|
+
|
|
1008
|
+
if ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
1009
|
+
|
|
1010
|
+
if ( scope.enablePan === false ) return;
|
|
1011
|
+
|
|
1012
|
+
handleMouseDownPan( event );
|
|
1013
|
+
|
|
1014
|
+
state = STATE.PAN;
|
|
1015
|
+
|
|
1016
|
+
} else {
|
|
1017
|
+
|
|
1018
|
+
if ( scope.enableRotate === false ) return;
|
|
1019
|
+
|
|
1020
|
+
handleMouseDownRotate( event );
|
|
1021
|
+
|
|
1022
|
+
state = STATE.ROTATE;
|
|
1023
|
+
|
|
1024
|
+
}
|
|
1025
|
+
|
|
1026
|
+
break;
|
|
1027
|
+
|
|
1028
|
+
case three__WEBPACK_IMPORTED_MODULE_0__["MOUSE"].PAN:
|
|
1029
|
+
|
|
1030
|
+
if ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
1031
|
+
|
|
1032
|
+
if ( scope.enableRotate === false ) return;
|
|
1033
|
+
|
|
1034
|
+
handleMouseDownRotate( event );
|
|
1035
|
+
|
|
1036
|
+
state = STATE.ROTATE;
|
|
1037
|
+
|
|
1038
|
+
} else {
|
|
1039
|
+
|
|
1040
|
+
if ( scope.enablePan === false ) return;
|
|
1041
|
+
|
|
1042
|
+
handleMouseDownPan( event );
|
|
1043
|
+
|
|
1044
|
+
state = STATE.PAN;
|
|
1045
|
+
|
|
1046
|
+
}
|
|
1047
|
+
|
|
1048
|
+
break;
|
|
1049
|
+
|
|
1050
|
+
default:
|
|
1051
|
+
|
|
1052
|
+
state = STATE.NONE;
|
|
1053
|
+
|
|
1054
|
+
}
|
|
1055
|
+
|
|
1056
|
+
if ( state !== STATE.NONE ) {
|
|
1057
|
+
|
|
1058
|
+
scope.dispatchEvent( _startEvent );
|
|
1059
|
+
|
|
1060
|
+
}
|
|
1061
|
+
|
|
1062
|
+
}
|
|
1063
|
+
|
|
1064
|
+
function onMouseMove( event ) {
|
|
1065
|
+
|
|
1066
|
+
if ( scope.enabled === false ) return;
|
|
1067
|
+
|
|
1068
|
+
switch ( state ) {
|
|
1069
|
+
|
|
1070
|
+
case STATE.ROTATE:
|
|
1071
|
+
|
|
1072
|
+
if ( scope.enableRotate === false ) return;
|
|
1073
|
+
|
|
1074
|
+
handleMouseMoveRotate( event );
|
|
1075
|
+
|
|
1076
|
+
break;
|
|
1077
|
+
|
|
1078
|
+
case STATE.DOLLY:
|
|
1079
|
+
|
|
1080
|
+
if ( scope.enableZoom === false ) return;
|
|
1081
|
+
|
|
1082
|
+
handleMouseMoveDolly( event );
|
|
1083
|
+
|
|
1084
|
+
break;
|
|
1085
|
+
|
|
1086
|
+
case STATE.PAN:
|
|
1087
|
+
|
|
1088
|
+
if ( scope.enablePan === false ) return;
|
|
1089
|
+
|
|
1090
|
+
handleMouseMovePan( event );
|
|
1091
|
+
|
|
1092
|
+
break;
|
|
1093
|
+
|
|
1094
|
+
}
|
|
1095
|
+
|
|
1096
|
+
}
|
|
1097
|
+
|
|
1098
|
+
function onMouseWheel( event ) {
|
|
1099
|
+
|
|
1100
|
+
if ( scope.enabled === false || scope.enableZoom === false || state !== STATE.NONE ) return;
|
|
1101
|
+
|
|
1102
|
+
event.preventDefault();
|
|
1103
|
+
|
|
1104
|
+
scope.dispatchEvent( _startEvent );
|
|
1105
|
+
|
|
1106
|
+
handleMouseWheel( event );
|
|
1107
|
+
|
|
1108
|
+
scope.dispatchEvent( _endEvent );
|
|
1109
|
+
|
|
1110
|
+
}
|
|
1111
|
+
|
|
1112
|
+
function onKeyDown( event ) {
|
|
1113
|
+
|
|
1114
|
+
if ( scope.enabled === false || scope.enablePan === false ) return;
|
|
1115
|
+
|
|
1116
|
+
handleKeyDown( event );
|
|
1117
|
+
|
|
1118
|
+
}
|
|
1119
|
+
|
|
1120
|
+
function onTouchStart( event ) {
|
|
1121
|
+
|
|
1122
|
+
trackPointer( event );
|
|
1123
|
+
|
|
1124
|
+
switch ( pointers.length ) {
|
|
1125
|
+
|
|
1126
|
+
case 1:
|
|
1127
|
+
|
|
1128
|
+
switch ( scope.touches.ONE ) {
|
|
1129
|
+
|
|
1130
|
+
case three__WEBPACK_IMPORTED_MODULE_0__["TOUCH"].ROTATE:
|
|
1131
|
+
|
|
1132
|
+
if ( scope.enableRotate === false ) return;
|
|
1133
|
+
|
|
1134
|
+
handleTouchStartRotate();
|
|
1135
|
+
|
|
1136
|
+
state = STATE.TOUCH_ROTATE;
|
|
1137
|
+
|
|
1138
|
+
break;
|
|
1139
|
+
|
|
1140
|
+
case three__WEBPACK_IMPORTED_MODULE_0__["TOUCH"].PAN:
|
|
1141
|
+
|
|
1142
|
+
if ( scope.enablePan === false ) return;
|
|
1143
|
+
|
|
1144
|
+
handleTouchStartPan();
|
|
1145
|
+
|
|
1146
|
+
state = STATE.TOUCH_PAN;
|
|
1147
|
+
|
|
1148
|
+
break;
|
|
1149
|
+
|
|
1150
|
+
default:
|
|
1151
|
+
|
|
1152
|
+
state = STATE.NONE;
|
|
1153
|
+
|
|
1154
|
+
}
|
|
1155
|
+
|
|
1156
|
+
break;
|
|
1157
|
+
|
|
1158
|
+
case 2:
|
|
1159
|
+
|
|
1160
|
+
switch ( scope.touches.TWO ) {
|
|
1161
|
+
|
|
1162
|
+
case three__WEBPACK_IMPORTED_MODULE_0__["TOUCH"].DOLLY_PAN:
|
|
1163
|
+
|
|
1164
|
+
if ( scope.enableZoom === false && scope.enablePan === false ) return;
|
|
1165
|
+
|
|
1166
|
+
handleTouchStartDollyPan();
|
|
1167
|
+
|
|
1168
|
+
state = STATE.TOUCH_DOLLY_PAN;
|
|
1169
|
+
|
|
1170
|
+
break;
|
|
1171
|
+
|
|
1172
|
+
case three__WEBPACK_IMPORTED_MODULE_0__["TOUCH"].DOLLY_ROTATE:
|
|
1173
|
+
|
|
1174
|
+
if ( scope.enableZoom === false && scope.enableRotate === false ) return;
|
|
1175
|
+
|
|
1176
|
+
handleTouchStartDollyRotate();
|
|
1177
|
+
|
|
1178
|
+
state = STATE.TOUCH_DOLLY_ROTATE;
|
|
1179
|
+
|
|
1180
|
+
break;
|
|
1181
|
+
|
|
1182
|
+
default:
|
|
1183
|
+
|
|
1184
|
+
state = STATE.NONE;
|
|
1185
|
+
|
|
1186
|
+
}
|
|
1187
|
+
|
|
1188
|
+
break;
|
|
1189
|
+
|
|
1190
|
+
default:
|
|
1191
|
+
|
|
1192
|
+
state = STATE.NONE;
|
|
1193
|
+
|
|
1194
|
+
}
|
|
1195
|
+
|
|
1196
|
+
if ( state !== STATE.NONE ) {
|
|
1197
|
+
|
|
1198
|
+
scope.dispatchEvent( _startEvent );
|
|
1199
|
+
|
|
1200
|
+
}
|
|
1201
|
+
|
|
1202
|
+
}
|
|
1203
|
+
|
|
1204
|
+
function onTouchMove( event ) {
|
|
1205
|
+
|
|
1206
|
+
trackPointer( event );
|
|
1207
|
+
|
|
1208
|
+
switch ( state ) {
|
|
1209
|
+
|
|
1210
|
+
case STATE.TOUCH_ROTATE:
|
|
1211
|
+
|
|
1212
|
+
if ( scope.enableRotate === false ) return;
|
|
1213
|
+
|
|
1214
|
+
handleTouchMoveRotate( event );
|
|
1215
|
+
|
|
1216
|
+
scope.update();
|
|
1217
|
+
|
|
1218
|
+
break;
|
|
1219
|
+
|
|
1220
|
+
case STATE.TOUCH_PAN:
|
|
1221
|
+
|
|
1222
|
+
if ( scope.enablePan === false ) return;
|
|
1223
|
+
|
|
1224
|
+
handleTouchMovePan( event );
|
|
1225
|
+
|
|
1226
|
+
scope.update();
|
|
1227
|
+
|
|
1228
|
+
break;
|
|
1229
|
+
|
|
1230
|
+
case STATE.TOUCH_DOLLY_PAN:
|
|
1231
|
+
|
|
1232
|
+
if ( scope.enableZoom === false && scope.enablePan === false ) return;
|
|
1233
|
+
|
|
1234
|
+
handleTouchMoveDollyPan( event );
|
|
1235
|
+
|
|
1236
|
+
scope.update();
|
|
1237
|
+
|
|
1238
|
+
break;
|
|
1239
|
+
|
|
1240
|
+
case STATE.TOUCH_DOLLY_ROTATE:
|
|
1241
|
+
|
|
1242
|
+
if ( scope.enableZoom === false && scope.enableRotate === false ) return;
|
|
1243
|
+
|
|
1244
|
+
handleTouchMoveDollyRotate( event );
|
|
1245
|
+
|
|
1246
|
+
scope.update();
|
|
1247
|
+
|
|
1248
|
+
break;
|
|
1249
|
+
|
|
1250
|
+
default:
|
|
1251
|
+
|
|
1252
|
+
state = STATE.NONE;
|
|
1253
|
+
|
|
1254
|
+
}
|
|
1255
|
+
|
|
1256
|
+
}
|
|
1257
|
+
|
|
1258
|
+
function onContextMenu( event ) {
|
|
1259
|
+
|
|
1260
|
+
if ( scope.enabled === false ) return;
|
|
1261
|
+
|
|
1262
|
+
event.preventDefault();
|
|
1263
|
+
|
|
1264
|
+
}
|
|
1265
|
+
|
|
1266
|
+
function addPointer( event ) {
|
|
1267
|
+
|
|
1268
|
+
pointers.push( event );
|
|
1269
|
+
|
|
1270
|
+
}
|
|
1271
|
+
|
|
1272
|
+
function removePointer( event ) {
|
|
1273
|
+
|
|
1274
|
+
delete pointerPositions[ event.pointerId ];
|
|
1275
|
+
|
|
1276
|
+
for ( let i = 0; i < pointers.length; i ++ ) {
|
|
1277
|
+
|
|
1278
|
+
if ( pointers[ i ].pointerId == event.pointerId ) {
|
|
1279
|
+
|
|
1280
|
+
pointers.splice( i, 1 );
|
|
1281
|
+
return;
|
|
1282
|
+
|
|
1283
|
+
}
|
|
1284
|
+
|
|
1285
|
+
}
|
|
1286
|
+
|
|
1287
|
+
}
|
|
1288
|
+
|
|
1289
|
+
function trackPointer( event ) {
|
|
1290
|
+
|
|
1291
|
+
let position = pointerPositions[ event.pointerId ];
|
|
1292
|
+
|
|
1293
|
+
if ( position === undefined ) {
|
|
1294
|
+
|
|
1295
|
+
position = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"]();
|
|
1296
|
+
pointerPositions[ event.pointerId ] = position;
|
|
1297
|
+
|
|
1298
|
+
}
|
|
1299
|
+
|
|
1300
|
+
position.set( event.pageX, event.pageY );
|
|
1301
|
+
|
|
1302
|
+
}
|
|
1303
|
+
|
|
1304
|
+
function getSecondPointerPosition( event ) {
|
|
1305
|
+
|
|
1306
|
+
const pointer = ( event.pointerId === pointers[ 0 ].pointerId ) ? pointers[ 1 ] : pointers[ 0 ];
|
|
1307
|
+
|
|
1308
|
+
return pointerPositions[ pointer.pointerId ];
|
|
1309
|
+
|
|
1310
|
+
}
|
|
1311
|
+
|
|
1312
|
+
//
|
|
1313
|
+
|
|
1314
|
+
scope.domElement.addEventListener( 'contextmenu', onContextMenu );
|
|
1315
|
+
|
|
1316
|
+
scope.domElement.addEventListener( 'pointerdown', onPointerDown );
|
|
1317
|
+
scope.domElement.addEventListener( 'pointercancel', onPointerCancel );
|
|
1318
|
+
scope.domElement.addEventListener( 'wheel', onMouseWheel, { passive: false } );
|
|
1319
|
+
|
|
1320
|
+
// force an update at start
|
|
1321
|
+
|
|
1322
|
+
this.update();
|
|
1323
|
+
|
|
1324
|
+
}
|
|
1325
|
+
|
|
1326
|
+
}
|
|
1327
|
+
|
|
1328
|
+
|
|
1329
|
+
// This set of controls performs orbiting, dollying (zooming), and panning.
|
|
1330
|
+
// Unlike TrackballControls, it maintains the "up" direction object.up (+Y by default).
|
|
1331
|
+
// This is very similar to OrbitControls, another set of touch behavior
|
|
1332
|
+
//
|
|
1333
|
+
// Orbit - right mouse, or left mouse + ctrl/meta/shiftKey / touch: two-finger rotate
|
|
1334
|
+
// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish
|
|
1335
|
+
// Pan - left mouse, or arrow keys / touch: one-finger move
|
|
1336
|
+
|
|
1337
|
+
class MapControls extends OrbitControls {
|
|
1338
|
+
|
|
1339
|
+
constructor( object, domElement ) {
|
|
1340
|
+
|
|
1341
|
+
super( object, domElement );
|
|
1342
|
+
|
|
1343
|
+
this.screenSpacePanning = false; // pan orthogonal to world-space direction camera.up
|
|
1344
|
+
|
|
1345
|
+
this.mouseButtons.LEFT = three__WEBPACK_IMPORTED_MODULE_0__["MOUSE"].PAN;
|
|
1346
|
+
this.mouseButtons.RIGHT = three__WEBPACK_IMPORTED_MODULE_0__["MOUSE"].ROTATE;
|
|
1347
|
+
|
|
1348
|
+
this.touches.ONE = three__WEBPACK_IMPORTED_MODULE_0__["TOUCH"].PAN;
|
|
1349
|
+
this.touches.TWO = three__WEBPACK_IMPORTED_MODULE_0__["TOUCH"].DOLLY_ROTATE;
|
|
1350
|
+
|
|
1351
|
+
}
|
|
1352
|
+
|
|
1353
|
+
}
|
|
1354
|
+
|
|
1355
|
+
|
|
1356
|
+
|
|
1357
|
+
|
|
1358
|
+
/***/ }),
|
|
1359
|
+
|
|
1360
|
+
/***/ "./package.json":
|
|
1361
|
+
/*!**********************!*\
|
|
1362
|
+
!*** ./package.json ***!
|
|
1363
|
+
\**********************/
|
|
1364
|
+
/*! exports provided: name, version, main, types, scripts, dependencies, devDependencies, author, license, description, default */
|
|
1365
|
+
/***/ (function(module) {
|
|
1366
|
+
|
|
1367
|
+
module.exports = JSON.parse("{\"name\":\"igs-view\",\"version\":\"1.0.0\",\"main\":\"./dist/main.js\",\"types\":\"./types/Main.d.ts\",\"scripts\":{\"dev\":\"webpack-dev-server --watch --open --config webpack.dev.js --host 127.0.0.1\",\"build\":\"webpack --config webpack.prod.js && npm run declare\",\"declare\":\"tsc -d --declarationDir types --emitDeclarationOnly\"},\"dependencies\":{\"@types/three\":\"^0.139.0\",\"three\":\"^0.139.2\"},\"devDependencies\":{\"@types/glob\":\"^9.0.0\",\"@types/node\":\"20.8.0\",\"ts-loader\":\"^4.0.0\",\"typescript\":\"^4.5.1\",\"webpack\":\"^4.1.0\",\"webpack-cli\":\"^3.1.1\",\"webpack-dev-server\":\"^3.1.0\",\"webpack-merge\":\"^4.2.2\",\"worker-loader\":\"^3.0.8\"},\"author\":\"\",\"license\":\"ISC\",\"description\":\"\"}");
|
|
1368
|
+
|
|
1369
|
+
/***/ }),
|
|
1370
|
+
|
|
1371
|
+
/***/ "./src/Main.ts":
|
|
1372
|
+
/*!*********************!*\
|
|
1373
|
+
!*** ./src/Main.ts ***!
|
|
1374
|
+
\*********************/
|
|
1375
|
+
/*! exports provided: OutEventTypes, Main */
|
|
1376
|
+
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
1377
|
+
|
|
1378
|
+
"use strict";
|
|
1379
|
+
__webpack_require__.r(__webpack_exports__);
|
|
1380
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "OutEventTypes", function() { return OutEventTypes; });
|
|
1381
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Main", function() { return Main; });
|
|
1382
|
+
/* harmony import */ var three__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! three */ "three");
|
|
1383
|
+
/* harmony import */ var three__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(three__WEBPACK_IMPORTED_MODULE_0__);
|
|
1384
|
+
/* harmony import */ var three_examples_jsm_controls_OrbitControls__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! three/examples/jsm/controls/OrbitControls */ "./node_modules/.pnpm/three@0.139.2/node_modules/three/examples/jsm/controls/OrbitControls.js");
|
|
1385
|
+
var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
1386
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
1387
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
1388
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
1389
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
1390
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
1391
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
1392
|
+
});
|
|
1393
|
+
};
|
|
1394
|
+
|
|
1395
|
+
|
|
1396
|
+
var OutEventTypes;
|
|
1397
|
+
(function (OutEventTypes) {
|
|
1398
|
+
/**
|
|
1399
|
+
* 模型选中,事件参数会返回模型名
|
|
1400
|
+
*/
|
|
1401
|
+
OutEventTypes["MODEL_SELECTED"] = "onModelSelected";
|
|
1402
|
+
/**
|
|
1403
|
+
* 取消选中
|
|
1404
|
+
*/
|
|
1405
|
+
OutEventTypes["UNSELECT"] = "onUnselect";
|
|
1406
|
+
/**
|
|
1407
|
+
* 模型位移旋转缩放时派发,事件参数会返回模型名、具体操作、数值
|
|
1408
|
+
*/
|
|
1409
|
+
// MODEL_TRANSFORM = 'onModelTransform',
|
|
1410
|
+
})(OutEventTypes || (OutEventTypes = {}));
|
|
1411
|
+
class Main extends three__WEBPACK_IMPORTED_MODULE_0__["EventDispatcher"] {
|
|
1412
|
+
version() {
|
|
1413
|
+
const pkg = __webpack_require__(/*! ../package.json */ "./package.json");
|
|
1414
|
+
return pkg.version;
|
|
1415
|
+
}
|
|
1416
|
+
constructor(container, option) {
|
|
1417
|
+
super();
|
|
1418
|
+
this.container = container;
|
|
1419
|
+
this.option = option;
|
|
1420
|
+
this.defaultMeshMaterial = new three__WEBPACK_IMPORTED_MODULE_0__["MeshStandardMaterial"]({ side: 0, clipIntersection: true });
|
|
1421
|
+
this.defaultMeshMaterial_selected = new three__WEBPACK_IMPORTED_MODULE_0__["MeshBasicMaterial"]({ side: 0, clipIntersection: true, color: new three__WEBPACK_IMPORTED_MODULE_0__["Color"](0xff0000) });
|
|
1422
|
+
this.onUpPosition = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"](-1, -1); // 用于判断点击事件位置
|
|
1423
|
+
this.onDownPosition = new three__WEBPACK_IMPORTED_MODULE_0__["Vector2"](-1, -1); // 同上
|
|
1424
|
+
console.log("%cigs-view version:" + this.version(), "text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15);font-size:3em");
|
|
1425
|
+
let width = container.clientWidth;
|
|
1426
|
+
let height = container.clientHeight;
|
|
1427
|
+
let renderer = this.renderer = new three__WEBPACK_IMPORTED_MODULE_0__["WebGLRenderer"]({ alpha: true, antialias: true, logarithmicDepthBuffer: true });
|
|
1428
|
+
renderer.setPixelRatio(window.devicePixelRatio);
|
|
1429
|
+
renderer.autoClear = true;
|
|
1430
|
+
renderer.localClippingEnabled = true;
|
|
1431
|
+
// renderer.setClearColor(0xf6f6f6);
|
|
1432
|
+
renderer.setSize(width, height);
|
|
1433
|
+
container.appendChild(renderer.domElement);
|
|
1434
|
+
let scene = this.scene = new three__WEBPACK_IMPORTED_MODULE_0__["Scene"]();
|
|
1435
|
+
this.igsGroup = new three__WEBPACK_IMPORTED_MODULE_0__["Group"]();
|
|
1436
|
+
scene.add(this.igsGroup);
|
|
1437
|
+
let camera;
|
|
1438
|
+
if (option === null || option === void 0 ? void 0 : option.isOrthographicCamera) {
|
|
1439
|
+
const left = -width / 2 / 1;
|
|
1440
|
+
const right = width / 2 / 1;
|
|
1441
|
+
const top = height / 2 / 1;
|
|
1442
|
+
const bottom = -height / 2 / 1;
|
|
1443
|
+
camera = this.camera = new three__WEBPACK_IMPORTED_MODULE_0__["OrthographicCamera"](left, right, top, bottom);
|
|
1444
|
+
camera.position.set(0, 0, 1000);
|
|
1445
|
+
const orbit = this.orbit = new three_examples_jsm_controls_OrbitControls__WEBPACK_IMPORTED_MODULE_1__["OrbitControls"](camera, renderer.domElement);
|
|
1446
|
+
orbit.enableRotate = false;
|
|
1447
|
+
}
|
|
1448
|
+
else {
|
|
1449
|
+
camera = this.camera = new three__WEBPACK_IMPORTED_MODULE_0__["PerspectiveCamera"](30, width / height, 0.0001, 100000);
|
|
1450
|
+
camera.position.set(1000, 1000, 1000);
|
|
1451
|
+
//相机控件
|
|
1452
|
+
const orbit = this.orbit = new three_examples_jsm_controls_OrbitControls__WEBPACK_IMPORTED_MODULE_1__["OrbitControls"](camera, renderer.domElement);
|
|
1453
|
+
orbit.maxDistance = 10000;
|
|
1454
|
+
// orbit.enableDamping = true;
|
|
1455
|
+
// orbit.dampingFactor = 0.005;
|
|
1456
|
+
}
|
|
1457
|
+
// var gridHelper = new GridHelper(100, 100, 0x888888, 0x888888);
|
|
1458
|
+
// gridHelper.rotation.x = Math.PI / 2;
|
|
1459
|
+
// scene.add(gridHelper);
|
|
1460
|
+
var axesHelper = new three__WEBPACK_IMPORTED_MODULE_0__["AxesHelper"](100);
|
|
1461
|
+
scene.add(axesHelper);
|
|
1462
|
+
axesHelper.position.z = 0.001;
|
|
1463
|
+
let self = this;
|
|
1464
|
+
loop();
|
|
1465
|
+
function loop() {
|
|
1466
|
+
renderer.render(scene, camera);
|
|
1467
|
+
// self.orbit?.update()
|
|
1468
|
+
self.requestID = requestAnimationFrame(loop);
|
|
1469
|
+
}
|
|
1470
|
+
//测试下分割
|
|
1471
|
+
var pll = new three__WEBPACK_IMPORTED_MODULE_0__["DirectionalLight"](0xffffff, 0.3);
|
|
1472
|
+
pll.position.set(5, -10, 10);
|
|
1473
|
+
scene.add(pll);
|
|
1474
|
+
var pll = new three__WEBPACK_IMPORTED_MODULE_0__["DirectionalLight"](0xffffff, 0.3);
|
|
1475
|
+
pll.position.set(0, 10, 0);
|
|
1476
|
+
scene.add(pll);
|
|
1477
|
+
scene.add(new three__WEBPACK_IMPORTED_MODULE_0__["AmbientLight"](0xeeeeee, 0.05));
|
|
1478
|
+
//
|
|
1479
|
+
let resize = this.resize = () => {
|
|
1480
|
+
var _a;
|
|
1481
|
+
if (!this.renderer)
|
|
1482
|
+
return;
|
|
1483
|
+
const w = container.clientWidth;
|
|
1484
|
+
const h = container.clientHeight;
|
|
1485
|
+
// this.resize(w, h);
|
|
1486
|
+
(_a = this.renderer) === null || _a === void 0 ? void 0 : _a.setSize(w, h);
|
|
1487
|
+
if (option === null || option === void 0 ? void 0 : option.isOrthographicCamera) {
|
|
1488
|
+
let orthographicCamera = camera;
|
|
1489
|
+
let zoom = 1; //orthographicCamera.zoom;
|
|
1490
|
+
// console.log(zoom)
|
|
1491
|
+
const left = -w / 2 / zoom;
|
|
1492
|
+
const right = w / 2 / zoom;
|
|
1493
|
+
const top = h / 2 / zoom;
|
|
1494
|
+
const bottom = -h / 2 / zoom;
|
|
1495
|
+
orthographicCamera.left = left;
|
|
1496
|
+
orthographicCamera.right = right;
|
|
1497
|
+
orthographicCamera.top = top;
|
|
1498
|
+
orthographicCamera.bottom = bottom;
|
|
1499
|
+
// console.log(zoom)
|
|
1500
|
+
}
|
|
1501
|
+
else {
|
|
1502
|
+
camera.aspect = w / h;
|
|
1503
|
+
}
|
|
1504
|
+
camera.updateProjectionMatrix();
|
|
1505
|
+
};
|
|
1506
|
+
window.addEventListener('resize', resize);
|
|
1507
|
+
this.addMouseEvent();
|
|
1508
|
+
}
|
|
1509
|
+
loadIgs(src) {
|
|
1510
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
1511
|
+
let json = yield fetch(src)
|
|
1512
|
+
.then((res) => res.text())
|
|
1513
|
+
.then((res) => JSON.parse(res));
|
|
1514
|
+
const Entities = json.Data.Metadata.Entities;
|
|
1515
|
+
this.parseIgs(Entities);
|
|
1516
|
+
});
|
|
1517
|
+
}
|
|
1518
|
+
parseIgs(entities) {
|
|
1519
|
+
this.entities = entities;
|
|
1520
|
+
entities.forEach(({ Triangles, Vertices, Id }) => {
|
|
1521
|
+
console.log(Triangles, Vertices);
|
|
1522
|
+
// ========== 创建BufferGeometry ==========
|
|
1523
|
+
const geometry = new three__WEBPACK_IMPORTED_MODULE_0__["BufferGeometry"]();
|
|
1524
|
+
// 顶点位置数组
|
|
1525
|
+
const positions = new Float32Array(Vertices.length * 3);
|
|
1526
|
+
Vertices.forEach((vert, i) => {
|
|
1527
|
+
positions[i * 3] = vert.X;
|
|
1528
|
+
positions[i * 3 + 1] = vert.Y;
|
|
1529
|
+
positions[i * 3 + 2] = vert.Z;
|
|
1530
|
+
});
|
|
1531
|
+
// 三角形索引数组
|
|
1532
|
+
const indices = [];
|
|
1533
|
+
Triangles.forEach(tri => {
|
|
1534
|
+
indices.push(tri.VertexIndex1, tri.VertexIndex2, tri.VertexIndex3);
|
|
1535
|
+
});
|
|
1536
|
+
// 设置几何体属性
|
|
1537
|
+
geometry.setAttribute('position', new three__WEBPACK_IMPORTED_MODULE_0__["BufferAttribute"](positions, 3));
|
|
1538
|
+
geometry.setIndex(indices);
|
|
1539
|
+
// 计算法线(用于光照)
|
|
1540
|
+
geometry.computeVertexNormals();
|
|
1541
|
+
// ========== 创建网格 ==========
|
|
1542
|
+
const mesh = new three__WEBPACK_IMPORTED_MODULE_0__["Mesh"](geometry, this.defaultMeshMaterial);
|
|
1543
|
+
mesh.uuid = Id + "";
|
|
1544
|
+
this.igsGroup.add(mesh);
|
|
1545
|
+
});
|
|
1546
|
+
}
|
|
1547
|
+
addMouseEvent() {
|
|
1548
|
+
this.raycaster = new three__WEBPACK_IMPORTED_MODULE_0__["Raycaster"]();
|
|
1549
|
+
const { container } = this;
|
|
1550
|
+
container.addEventListener('pointerdown', (event) => {
|
|
1551
|
+
this.onDownPosition.x = event.offsetX;
|
|
1552
|
+
this.onDownPosition.y = event.offsetY;
|
|
1553
|
+
});
|
|
1554
|
+
// container.addEventListener('pointermove', (event: PointerEvent) => {
|
|
1555
|
+
// this.hittest(event)
|
|
1556
|
+
// });
|
|
1557
|
+
container.addEventListener('pointerup', (event) => {
|
|
1558
|
+
var _a;
|
|
1559
|
+
this.onUpPosition.x = event.offsetX;
|
|
1560
|
+
this.onUpPosition.y = event.offsetY;
|
|
1561
|
+
// 单击有效(点击的位置已经不同,就直接返回了)
|
|
1562
|
+
if (this.onDownPosition.distanceTo(this.onUpPosition) > 20) {
|
|
1563
|
+
return;
|
|
1564
|
+
}
|
|
1565
|
+
const clientWidth = this.container.clientWidth;
|
|
1566
|
+
const clientHeight = this.container.clientHeight;
|
|
1567
|
+
const { camera, raycaster } = this;
|
|
1568
|
+
// console.log(clientWidth,clientHeight)
|
|
1569
|
+
let models = this.igsGroup.children.slice();
|
|
1570
|
+
let x = (event.offsetX / clientWidth) * 2 - 1;
|
|
1571
|
+
let y = -(event.offsetY / clientHeight) * 2 + 1;
|
|
1572
|
+
raycaster.setFromCamera(new three__WEBPACK_IMPORTED_MODULE_0__["Vector3"](x, y, 0.5), camera);
|
|
1573
|
+
//只需要距离最近的那个就行
|
|
1574
|
+
let picks = this.raycaster.intersectObjects(models, true);
|
|
1575
|
+
if ((_a = picks[0]) === null || _a === void 0 ? void 0 : _a.object) {
|
|
1576
|
+
if (this.selected)
|
|
1577
|
+
this.selected.material = this.defaultMeshMaterial;
|
|
1578
|
+
this.selected = picks[0].object;
|
|
1579
|
+
this.selected.material = this.defaultMeshMaterial_selected;
|
|
1580
|
+
//派发个事件出去,TODO,选中了,数据带上uuid
|
|
1581
|
+
this.dispatchEvent({
|
|
1582
|
+
type: OutEventTypes.MODEL_SELECTED,
|
|
1583
|
+
// id: this.selected.id,
|
|
1584
|
+
uuid: this.selected.uuid,
|
|
1585
|
+
});
|
|
1586
|
+
}
|
|
1587
|
+
else {
|
|
1588
|
+
if (this.selected)
|
|
1589
|
+
this.selected.material = this.defaultMeshMaterial;
|
|
1590
|
+
this.selected = null;
|
|
1591
|
+
this.dispatchEvent({ type: OutEventTypes.UNSELECT });
|
|
1592
|
+
}
|
|
1593
|
+
});
|
|
1594
|
+
}
|
|
1595
|
+
}
|
|
1596
|
+
|
|
1597
|
+
|
|
1598
|
+
/***/ }),
|
|
1599
|
+
|
|
1600
|
+
/***/ "three":
|
|
1601
|
+
/*!************************!*\
|
|
1602
|
+
!*** external "three" ***!
|
|
1603
|
+
\************************/
|
|
1604
|
+
/*! no static exports found */
|
|
1605
|
+
/***/ (function(module, exports) {
|
|
1606
|
+
|
|
1607
|
+
module.exports = __WEBPACK_EXTERNAL_MODULE_three__;
|
|
1608
|
+
|
|
1609
|
+
/***/ })
|
|
1610
|
+
|
|
1611
|
+
/******/ });
|
|
1612
|
+
});
|
|
1613
|
+
//# sourceMappingURL=main.js.map
|