2015-05-29 4 views
0

Я новичок в этом и создал сцену, визуализатор, камеру и два объекта, Я хочу, чтобы переместить один объект на другой объект, как я могу достичь этого в THREE.JS? Heres все вещи я попытался любезно помочь мне в этом благодаряКак перенести объект на другой стабильный объект в THREE.JS?

<script src="js/three.min.js"></script> 
 
<script src="js/tween.min.js"></script> 
 
<script src="js/OrbitControls.js"></script> 
 
<script> 
 
    var scene = new THREE.Scene(), 
 
     camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000), 
 
     renderer = new THREE.WebGLRenderer(), 
 
     controls = new THREE.OrbitControls(camera), 
 
     tween = new TWEEN.Tween({cube.position}) 
 
\t \t .to({cube1.position},3000) 
 
\t \t .delay(2000) 
 
\t \t .start(); \t 
 
\t \t \t 
 
    renderer.setSize(window.innerWidth, window.innerHeight); 
 
    document.body.appendChild(renderer.domElement); 
 
     
 
    var cube = new THREE.Mesh(
 
     new THREE.CubeGeometry(2,2,2), 
 
     new THREE.MeshBasicMaterial({wireframe: true, color: 0x000000} 
 
    )); 
 
    cube.position.x=3; 
 
    cube.position.y=1; 
 
    cube.position.z=2; 
 
    //cube.geometry.dynamic = True; 
 
    //cube.translateZ(10); 
 
    scene.add(cube); 
 

 
    camera.position.z = 10; 
 

 
    var dullMaterial = new THREE.MeshBasicMaterial({ color: 0xCCFF00 \t , ambient: 0x333333 }); 
 
     
 
    var loader = new THREE.JSONLoader(); 
 
    loader.load('models/monkey.js', function (geometry, materials) { 
 
     cube1 = new THREE.Mesh(geometry, dullMaterial); 
 
     scene.add(cube1); 
 
    }); 
 

 
    var render = function() { 
 
     requestAnimationFrame(render); 
 
     controls.update(); 
 
     TWEEN.update(); 
 

 
     cube1.rotation.x += 0.01; 
 
     cube1.rotation.y += 0.01; 
 
     //cube.translate(0.1); 
 
     renderer.render(scene, camera); 
 
    }; 
 
    render(); 
 
</script>

ответ

0

Вы можете использовать другую библиотеку tween.js (вы можете найти его в three.js \ Примеры \ JS \ libs) и do

new TWEEN.Tween(object1.position, // old position 
    .to(object2.position, 3000) // new position, duration 
    .delay(2000) 
    .start(); 
+0

любезно дайте мне знать, где это добавить? я не получил вас, пожалуйста, объясните подробно, это было бы очень полезно Спасибо @gaitat –

+0

@mrdoob любые предложения? –

+0

Фактически вы можете поместить его в любое место после создания объектов. Параметр 'delay' позаботится о начале анимации, а' duration' покажет анимации, как долго продлится. – gaitat

Смежные вопросы