gpt4 book ai didi

javascript - Three.js - 如何反复从左向右移动球

转载 作者:行者123 更新时间:2023-12-02 15:38:08 26 4
gpt4 key购买 nike

我想在 Three.js 中将一个球向右移动,然后它应移动到起始位置,然后反复返回右侧。

var geometry = new THREE.SphereGeometry( 5, 32, 32);
var material = new THREE.MeshPhongMaterial( {specular: "#fdfb57",
color: "#d8d613", emissive: "#6b6a0d", side: THREE.DoubleSide} );
var ball = new THREE.Mesh(geometry, material);

var render = function () {
requestAnimationFrame( render );
renderer.render(scene, camera);
renderer.setSize(window.innerWidth, window.innerHeight);

// What programming code I have to put on here?
};

render();

但是我应该如何实现球的移动呢?

最佳答案

通过更改每一帧上的 ball.position 或使用 Tween.js 等库来获取要在其之间移动的两点之间的运动路径。

对于简单的从左到右反向重复动画,只需调整位置即可。

尝试将其粘贴到 avgp.github.io/h2g2three 中:

var geometry = new THREE.SphereGeometry( 5, 32, 32);
var material = new THREE.MeshPhongMaterial( {specular: "#fdfb57", color: "#d8d613", emissive: "#6b6a0d", side: THREE.DoubleSide} );
var ball = new THREE.Mesh(geometry, material);
var dxPerFrame = 1; // how to move in a single frame

scene.add(ball);

onRender = function() {
ball.position.x += dxPerFrame; // move ball
if(ball.position.x > 100) dxPerFrame = -1; // if we're too far right, move towards the left
if(ball.position.x < -100) dxPerFrame = 1; // if we're too far left, move towards the right again
};

// Alt+Return run the code

关于javascript - Three.js - 如何反复从左向右移动球,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32775371/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com