Javascript Can'；在three.js中不能让尾巴摇摆（动画化）？
嘿，如果有人能帮我制作这个物体的动画： 上下移动| 向左-向右旋转| 一个需要仰望的人| z向下看 链接到原始文件： JSON模型文件（带动画尾翼）： 问题是json模型文件提供了关于尾部动画的必要细节。狼的尾巴要摇。 但事实并非如此，我什么都试过了，但毫无帮助 代码中是否有错误，或者我没有正确导出frm Blender 代码如下：Javascript Can'；在three.js中不能让尾巴摇摆（动画化）？,javascript,three.js,Javascript,Three.js,嘿，如果有人能帮我制作这个物体的动画： 上下移动| 向左-向右旋转| 一个需要仰望的人| z向下看 链接到原始文件： JSON模型文件（带动画尾翼）： 问题是json模型文件提供了关于尾部动画的必要细节。狼的尾巴要摇。 但事实并非如此，我什么都试过了，但毫无帮助 代码中是否有错误，或者我没有正确导出frm Blender 代码如下： <html> <head> <style> body { margin: 0; } <
<html>
<head>
<style>
body { margin: 0; }
</style>
</head>
<body>
<canvas id="myCanvas"></canvas>
<script src="three.js"></script>
<script>
var scene = new THREE.Scene();
var canvas = document.getElementById("myCanvas");
renderer = new THREE.WebGLRenderer({ canvas: canvas });
var camera = new THREE.PerspectiveCamera( 75, (canvas.width / canvas.height) , 1, 10000 );
var clock = new THREE.Clock(),mixer;
var forest,wolf,animation;
var fwd,bck,lft,rgt,up,down = 0 ;
var action = {};
camera.fov *= 0.3;
camera.updateProjectionMatrix();
renderer.setSize( window.innerWidth, window.innerHeight);
document.body.appendChild( renderer.domElement );
renderer.setClearColor (0x22222222, 1);
camera.position.z = 28;
var material = new THREE.MeshPhongMaterial( { map: THREE.ImageUtils.loadTexture('wolf_uvcons.png') } );
// Wolf Texture Above # Forest Uses Local Materials @Blender
var loader = new THREE.JSONLoader();
loader.load('forest.json', function(geometry, materials) {
forest = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials));
forest.scale.x = forest.scale.y = forest.scale.z = 0.25;
forest.rotateX( Math.PI / 2 );forest.rotateZ( Math.PI ); //load :env:
forest.translation = THREE.GeometryUtils.center(geometry);
scene.add(forest);
});
loader.load('wolf.json', function(geometry, materials) {
wolf = new THREE.SkinnedMesh(geometry,material);
wolf.scale.x = wolf.scale.y = wolf.scale.z = 0.25; //load wolf
wolf.translation = THREE.GeometryUtils.center(geometry);
scene.add(wolf);
wolf.add(camera);
wolf.translateY(-27); /// Bring it down
wolf.translateZ(100); /// Bring it down
action.idle = new THREE.AnimationAction(geometry.animations[ 0 ]);
action.idle.weight = 1;
// Create animation mixer and pass object to it
mixer = new THREE.AnimationMixer(wolf);
mixer.addAction( action.idle );
});
var light = new THREE.AmbientLight(0xFFFFFFFF,1);
scene.add(light);
var pointLight = new THREE.PointLight( 0xffcccc,0.41 );
pointLight.position.set( 0, 100, 3 );
scene.add( pointLight );
var pointLight1 = new THREE.PointLight( 0xff0000,0.81 );
pointLight1.position.set( 100, 200, 3 );
scene.add( pointLight1 );
function moveWolf()
{
if (fwd==1)
{ wolf.translateZ(-1);}
if (bck==1)
{ wolf.translateZ(1);}
if (lft==1)
{ wolf.rotateY(Math.PI/200)}
if (rgt==1)
{ wolf.rotateY(-Math.PI/200);}
if (up==1)
{ camera.rotateX(Math.PI/200);}
if (down==1)
{ camera.rotateX(-Math.PI/200);}
}
function animate() {
requestAnimationFrame( animate );
moveWolf();
render();
var delta = clock.getDelta();
var theta = clock.getElapsedTime();
if ( mixer ) { mixer.update( delta ); }
}
function render() {
renderer.render( scene, camera );
}
animate();
</script>
<script>
document.onkeydown = checkKey1;
document.onkeyup = checkKey2;
function checkKey1(e) {
e = e || window.event;
if (e.keyCode == '38') {
// up arrow
fwd=1;
}
else if (e.keyCode == '40') {
// down arrow
bck=1;
}
else if (e.keyCode == '37') {
// left arrow
lft=1;
}
else if (e.keyCode == '39') {
// right arrow
rgt=1;
}
else if (e.keyCode == '65') {
up=1;
}
else if (e.keyCode == '90') {
down=1;
}
}
function checkKey2(e) {
e = e || window.event;
if (e.keyCode == '38') {
// up arrow
fwd=0;
}
else if (e.keyCode == '40') {
// down arrow
bck=0;
}
else if (e.keyCode == '37') {
// left arrow
lft=0;
}
else if (e.keyCode == '39') {
// right arrow
rgt=0;
}
else if (e.keyCode == '65') {
// right arrow
up=0;
}
else if (e.keyCode == '90') {
// right arrow
down=0;
}
}
</script>
</body>
</html>
正文{页边距：0；}
var scene=new THREE.scene（）；
var canvas=document.getElementById（“myCanvas”）；
renderer=new THREE.WebGLRenderer（{canvas:canvas}）；
var摄像机=新的三视角摄像机（75，（canvas.width/canvas.height），11000）；
var clock=new THREE.clock（），混音器；
森林、狼、动画；
变量fwd、bck、lft、rgt、向上、向下=0；
var action={}；
摄像机视场*=0.3；
camera.updateProjectMatrix（）；
renderer.setSize（window.innerWidth、window.innerHeight）；
document.body.appendChild（renderer.doElement）；
renderer.setClearColor（0x2222，1）；
摄像机位置z=28；
var material=new THREE.MeshPhongMaterial（{map:THREE.ImageUtils.loadTexture（'wolf_uvcons.png'））}）；
//上方的狼纹理#森林使用当地材料@Blender
var loader=new THREE.JSONLoader（）；
loader.load（'forest.json'，函数（几何体、材质）{
森林=新的三点网格（几何体，新的三点网格面材质（材质））；
forest.scale.x=forest.scale.y=forest.scale.z=0.25；
forest.rotateX（Math.PI/2）；forest.rotateZ（Math.PI）；//load:env:
forest.translation=3.GeometryUtils.center（几何体）；
场景。添加（森林）；
});
loader.load（'wolf.json'，函数（几何体、材质）{
wolf=新的三个。皮肤网格（几何体、材质）；
wolf.scale.x=wolf.scale.y=wolf.scale.z=0.25；//加载wolf
wolf.translation=3.GeometryUtils.center（几何）；
场景。添加（狼）；
添加（摄像机）；
wolf.translateY（-27）；///把它拿下来
wolf.translateZ（100）；///把它拿下来
action.idle=新的3.AnimationAction（geometry.animations[0]）；
action.idle.weight=1；
//创建动画混合器并将对象传递给它
混合器=新的三个。动画混合器（狼）；
mixer.addAction（action.idle）；
});
var灯光=新的三个环境灯光（0xFFFFFFFF，1）；
场景。添加（灯光）；
var pointLight=新的三点光源（0xffcccc，0.41）；
点光源位置设置（0,100,3）；
场景。添加（点光源）；
var pointLight1=新的三点光源（0xff0000,0.81）；
点光源1.位置设置（1002003）；
场景。添加（pointLight1）；
函数moveWolf（）
{
如果（fwd==1）
{wolf.translateZ（-1）；}
如果（bck==1）
{wolf.translateZ（1）；}
如果（lft==1）
{wolf.rotateY（Math.PI/200）}
如果（rgt==1）
{wolf.rotateY（-Math.PI/200）；}
如果（向上==1）
{camera.rotateX（Math.PI/200）；}
如果（向下==1）
{camera.rotateX（-Math.PI/200）；}
}
函数animate（）{
请求动画帧（动画）；
moveWolf（）；
render（）；
var delta=clock.getDelta（）；
var theta=clock.getElapsedTime（）；
if（mixer）{mixer.update（delta）；}
}
函数render（）{
渲染器。渲染（场景、摄影机）；
}
制作动画（）；
document.onkeydown=checkKey1；
document.onkeyup=checkKey2；
功能检查键1（e）{
e=e | | window.event；
如果（e.keyCode=='38'）{
//向上箭头
fwd=1；
}
否则如果（e.keyCode=='40'）{
//向下箭头
bck=1；
}
否则如果（e.keyCode=='37'）{
//左箭头
lft=1；
}
否则如果（e.keyCode=='39'）{
//右箭头
rgt=1；
}
否则如果（e.keyCode==“65”）{
up=1；
}
否则如果（e.keyCode==“90”）{
向下=1；
}
}
功能检查键2（e）{
e=e | | window.event；
如果（e.keyCode=='38'）{
//向上箭头
fwd=0；
}
否则如果（e.keyCode=='40'）{
//向下箭头
bck=0；
}
否则如果（e.keyCode=='37'）{
//左箭头
lft=0；
}
否则如果（e.keyCode=='39'）{
//右箭头
rgt=0；
}
否则如果（e.keyCode==“65”）{
//右箭头
up=0；
}
否则如果（e.keyCode==“90”）{
//右箭头
向下=0；
}
}