鍍金池/ 問答/HTML5  網(wǎng)絡安全  HTML/ three.js想把“犀?！惫潭ㄔ谠瓉砦恢?，旋轉(zhuǎn)不跑

three.js想把“犀牛”固定在原來位置，旋轉(zhuǎn)不跑

我怎么才能把“犀?！惫潭ㄔ谠瓉砦恢茫D(zhuǎn)不跑

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Three.js第二個例子</title>
    <script src="three.js"></script>
    <script src="OrbitControls.js"></script>
    <script src="OBJLoader.js"></script>


</head>
<body>
<script>

    //場景元素
    var scene=new THREE.Scene();

    var manager = new THREE.LoadingManager();
    manager.onProgress = function ( item, loaded, total ) {

        console.log( item, loaded, total );

    };

    var textureLoader = new THREE.TextureLoader( manager );
    var texture = textureLoader.load('xiniu/JS177_col.jpg' );

    // model

    var onProgress = function ( xhr ) {
        if ( xhr.lengthComputable ) {
            var percentComplete = xhr.loaded / xhr.total * 100;
            console.log( Math.round(percentComplete, 2) + '% downloaded' );
        }
    };

    var onError = function ( xhr ) {
    };

    var loader = new THREE.OBJLoader( manager );
    loader.load('xiniu/xiniu03.obj', function ( object ) {
        object.scale.set(3,3,3);//縮放

        object.traverse( function ( child ) {

            if ( child instanceof THREE.Mesh ) {

                child.material.map = texture;

            }

        } );

        object.position.y = 50;
        scene.add( object );

    }, onProgress, onError );

    //加入環(huán)境光
    scene.add(new THREE.AmbientLight(0x404040));
    // 平行光
    var directionalLight = new THREE.DirectionalLight( 0xffffff, 1 );
    directionalLight.position.set( 0, 1, 0 );
    scene.add( directionalLight );
    //相機對象
    var camera=new THREE.PerspectiveCamera(45,800/600,1,1000);//透視相機
    //相機位置
    camera.position.set(200,450,150);
    //朝向場景的中心
    camera.lookAt(scene.position);
    //創(chuàng)建渲染器
    var renderer = new THREE.WebGLRenderer();
    //渲染器尺寸
    renderer.setSize(800,600);
    //加入
    document.body.appendChild(renderer.domElement);
    //事件處理
    function render() {
        //渲染
        renderer.render(scene,camera);
    }
    render();

    //創(chuàng)建相機控制
    var controls = new THREE.OrbitControls(camera);

    //事件監(jiān)聽
    controls.addEventListener('change',render);
    //相機與模型最小距離，模型看上去大
    controls.minDistance = 300;
    //相機與模型最大距離，模型看上去小
    controls.maxDistance = 800;
    //      controls = new THREE.Vector3(0,0,0);
    //動畫函數(shù)處理渲染
    function  animate() {
        requestAnimationFrame(animate);//每一幀都執(zhí)行一次進行渲染
        render();
    }
    animate();
</script>
</body>
</html>

clipboard.png

鼠標旋轉(zhuǎn)后。。。跑了 不在原來位置上了 我怎么修改代碼

clipboard.png

回答
編輯回答
莫小染

你應該粘一下整個demo的code啊

2017年3月19日 12:39
編輯回答
悶油瓶
controls.target = new THREE.Vector3(0,70,0);
controls.needsUpdate=true;
2017年3月13日 16:06