fix(viewer): double tap zoom to object made nicer; other minor improvements

This commit is contained in:
Dimitrie Stefanescu
2021-01-13 23:17:48 +02:00
parent 39f0e827a0
commit 113b027f99
4 changed files with 13 additions and 13 deletions
+6 -7
View File
@@ -1129,7 +1129,7 @@ var SceneObjectManager = /*#__PURE__*/function () {
}, {
key: "zoomToBox",
value: function zoomToBox(box) {
var fitOffset = 1.2;
var fitOffset = 0.9;
var size = box.getSize(new three__WEBPACK_IMPORTED_MODULE_0__.Vector3());
var center = box.getCenter(new three__WEBPACK_IMPORTED_MODULE_0__.Vector3());
var maxSize = Math.max(size.x, size.y, size.z);
@@ -1437,7 +1437,7 @@ var SelectionHelper = /*#__PURE__*/function (_EventEmitter) {
_this.handleSelection(selectionObjects);
}); // Doubleclicks on touch devices
// ref: http://jsfiddle.net/brettwp/J4djY/
// http://jsfiddle.net/brettwp/J4djY/
_this.tapTimeout;
@@ -1448,7 +1448,7 @@ var SelectionHelper = /*#__PURE__*/function (_EventEmitter) {
_this.touchLocation = e.targetTouches[0];
});
_this.viewer.renderer.domElement.addEventListener('touchend', e => {
_this.viewer.renderer.domElement.addEventListener('touchend', event => {
var currentTime = new Date().getTime();
var tapLength = currentTime - _this.lastTap;
clearTimeout(_this.tapTimeout);
@@ -1458,8 +1458,7 @@ var SelectionHelper = /*#__PURE__*/function (_EventEmitter) {
_this.emit('object-doubleclicked', selectionObjects);
_this.handleDoubleClick(selectionObjects);
if (!_this.orbiting) _this.handleDoubleClick(selectionObjects);
event.preventDefault();
} else {
_this.tapTimeout = setTimeout(function () {
@@ -1915,11 +1914,11 @@ var Viewer = /*#__PURE__*/function () {
this.scene.add(this.cubeCamera);
this.controls = new three_examples_jsm_controls_OrbitControls_js__WEBPACK_IMPORTED_MODULE_1__.OrbitControls(this.camera, this.renderer.domElement);
this.controls.enableDamping = true;
this.controls.dampingFactor = 0.05;
this.controls.dampingFactor = 0.1;
this.controls.screenSpacePanning = true;
this.controls.maxPolarAngle = Math.PI / 2;
this.controls.panSpeed = 0.8;
this.controls.rotateSpeed = 0.5;
this.controls.rotateSpeed = 0.8;
this.composer = new three_examples_jsm_postprocessing_EffectComposer_js__WEBPACK_IMPORTED_MODULE_2__.EffectComposer(this.renderer);
this.ssaoPass = new three_examples_jsm_postprocessing_SSAOPass_js__WEBPACK_IMPORTED_MODULE_3__.SSAOPass(this.scene, this.camera, this.container.offsetWidth, this.container.offsetHeight);
this.ssaoPass.kernelRadius = 0.03;
@@ -161,7 +161,7 @@ export default class SceneObjectManager {
// see this discussion: https://github.com/mrdoob/three.js/pull/14526#issuecomment-497254491
zoomToBox( box ) {
const fitOffset = 1.2
const fitOffset = 0.9
const size = box.getSize( new THREE.Vector3() )
const center = box.getCenter( new THREE.Vector3() )
@@ -31,19 +31,20 @@ export default class SelectionHelper extends EventEmitter {
} )
// Doubleclicks on touch devices
// ref: http://jsfiddle.net/brettwp/J4djY/
// http://jsfiddle.net/brettwp/J4djY/
this.tapTimeout
this.lastTap = 0
this.touchLocation
this.viewer.renderer.domElement.addEventListener( 'touchstart', ( e ) => { this.touchLocation = e.targetTouches[0] } )
this.viewer.renderer.domElement.addEventListener( 'touchend', ( e ) => {
this.viewer.renderer.domElement.addEventListener( 'touchend', ( event ) => {
var currentTime = new Date().getTime()
var tapLength = currentTime - this.lastTap
clearTimeout( this.tapTimeout )
if ( tapLength < 500 && tapLength > 0 ) {
let selectionObjects = this.getClickedObjects( this.touchLocation )
this.emit( 'object-doubleclicked', selectionObjects )
this.handleDoubleClick( selectionObjects )
if ( !this.orbiting )
this.handleDoubleClick( selectionObjects )
event.preventDefault()
} else {
this.tapTimeout = setTimeout( function() {
+2 -2
View File
@@ -33,11 +33,11 @@ export default class Viewer {
this.controls = new OrbitControls( this.camera, this.renderer.domElement )
this.controls.enableDamping = true
this.controls.dampingFactor = 0.05
this.controls.dampingFactor = 0.1
this.controls.screenSpacePanning = true
this.controls.maxPolarAngle = Math.PI / 2
this.controls.panSpeed = 0.8
this.controls.rotateSpeed = 0.5
this.controls.rotateSpeed = 0.8
this.composer = new EffectComposer( this.renderer )