【问题标题】:ThreeJS How to set the position of the OrbitControlsThreeJS 如何设置 OrbitControls 的位置
【发布时间】:2015-07-20 18:14:29
【问题描述】:

我正在使用 .getAzimuthalAngle() 和 .getPolarAngle() 存储 OrbitControls 的位置,以后我希望能够设置 getAzimuthalAngle 和 getPolarAngle 但值略有不同。

我使用 getAzimuthalAngle 和 getPolarAngle 的原因是因为我需要计算出旋转的百分比,例如如果是 180°,那将是 50%。在背景中,我将 2D 地图的位置设置为镜像相同的位置。我有它的一种工作方式,但由于我无法设置 OrbitControls 的位置,所以我被卡住了..

【问题讨论】:

    标签: javascript three.js


    【解决方案1】:

    我已经设法通过复制 OrbitControl 更新函数并直接设置 theta 和 phi 值(而不是像更新函数那样增量)来破解解决方案

    this.setPhiTheta = function(t, p) {
        var position = this.object.position;
    
        offset.copy( position ).sub( this.target );
    
        // rotate offset to "y-axis-is-up" space
        offset.applyQuaternion( quat );
    
        // angle from z-axis around y-axis
    
        theta = Math.atan2( offset.x, offset.z );
    
        // angle from y-axis
    
        phi = Math.atan2( Math.sqrt( offset.x * offset.x + offset.z * offset.z ), offset.y );
    
        if ( this.autoRotate && state === STATE.NONE ) {
    
            this.rotateLeft( getAutoRotationAngle() );
    
        }
    
        /*theta = 3.105;
        phi = 1.48;*/
        theta = t;
        phi = p
        //console.log("theta " + theta)
        // restrict theta to be between desired limits
        theta = Math.max( this.minAzimuthAngle, Math.min( this.maxAzimuthAngle, theta ) );
    
        // restrict phi to be between desired limits
        phi = Math.max( this.minPolarAngle, Math.min( this.maxPolarAngle, phi ) );
    
        // restrict phi to be betwee EPS and PI-EPS
        phi = Math.max( EPS, Math.min( Math.PI - EPS, phi ) );
    
        var radius = offset.length() * scale;
    
        // restrict radius to be between desired limits
        radius = Math.max( this.minDistance, Math.min( this.maxDistance, radius ) );
    
        // move target to panned location
        this.target.add( pan );
    
        offset.x = radius * Math.sin( phi ) * Math.sin( theta );
        offset.y = radius * Math.cos( phi );
        offset.z = radius * Math.sin( phi ) * Math.cos( theta );
    
        // rotate offset back to "camera-up-vector-is-up" space
        offset.applyQuaternion( quatInverse );
    
        position.copy( this.target ).add( offset );
    
        this.object.lookAt( this.target );
    
        //thetaDelta /= 1.2;
        //phiDelta /= 1.2;
        scale = 1;
        pan.set( 0, 0, 0 );
    
        // update condition is:
        // min(camera displacement, camera rotation in radians)^2 > EPS
        // using small-angle approximation cos(x/2) = 1 - x^2 / 8
    
        if ( lastPosition.distanceToSquared( this.object.position ) > EPS
            || 8 * (1 - lastQuaternion.dot(this.object.quaternion)) > EPS ) {
    
            this.dispatchEvent( changeEvent );
    
            lastPosition.copy( this.object.position );
            lastQuaternion.copy (this.object.quaternion );
    
        }
    }
    

    【讨论】:

    • 但是这并没有动画,这暂时还可以,但需要在几天内找到方法
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-12-04
    • 1970-01-01
    • 1970-01-01
    • 2021-12-29
    • 1970-01-01
    • 1970-01-01
    • 2013-07-31
    相关资源
    最近更新 更多