我想将四元数的时间序列数据应用于三个 JS 对象。我想出了如何应用单个四元数,但我想“动画/播放”存储在时间序列数据中的序列。你能解释一下我该怎么做吗?
我的四元数数据是这样存储的:
Quat = [[0.5005824565887451,0.42090433835983276,-0.5387108325958252,0.53108149766922],
[0.49928978085517883,0.4201703667640686,-0.5390385389328003,0.5325449705123901],
[0.4981348514556885,0.4199031591415405,-0.5389792919158936,0.5338954925537109],
[0.49724632501602173,0.41984856128692627,-0.5386257171630859,0.5351220965385437],
[0.49625831842422485,0.4202878177165985,-0.5380696654319763,0.5362526774406433],
[0.4953213334083557,0.42090925574302673,-0.5373315215110779,0.5373707413673401]]
我的三个 JS 代码:
let camera, scene, renderer, clock, rightForeArm;
init();
animate();
function init() {
camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.01, 10 );
camera.position.set( 2, 2, - 2 );
camera.lookAt( 0, 1, 0 );
clock = new THREE.Clock();
scene = new THREE.Scene();
scene.background = new THREE.Color( 0xffffff );
const light = new THREE.HemisphereLight( 0xbbbbff, 0x444422 );
light.position.set( 0, 1, 0 );
scene.add( light );
// model
const loader = new THREE.GLTFLoader();
loader.load( 'https://threejs.org/examples/models/gltf/Xbot.glb', function ( gltf ) {
const model = gltf.scene;
rightForeArm = model.getObjectByName( 'mixamorigRightForeArm' );
rightForeArm.quaternion.set(0.14086472988128662,-0.13513171672821045,-0.46360713243484497,0.8642714023590088);
scene.add( model );
} );
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.gammaOutput = true;
renderer.gammaFactor = 2.2;
document.body.appendChild( renderer.domElement );
window.addEventListener( 'resize', onWindowResize, false );
}
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize( window.innerWidth, window.innerHeight );
}
function animate() {
requestAnimationFrame( animate );
renderer.render( scene, camera );
}
