Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/three.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Three.js animationData对象结构_Animation_Three.js_Keyframe - Fatal编程技术网

Three.js animationData对象结构

Three.js animationData对象结构,animation,three.js,keyframe,Animation,Three.js,Keyframe,我正在尝试硬编码一个动画数据对象,以便在Three.js应用程序中使用。以下是迄今为止我在这段代码中的内容: scene = new THREE.Scene(); var axisHelper = new THREE.AxisHelper( 1 ); scene.add( axisHelper ); var geometry = new THREE.BoxGeometry(1,1,1); var material = new THREE.MeshBasicMaterial( { co

我正在尝试硬编码一个动画数据对象,以便在Three.js应用程序中使用。以下是迄今为止我在这段代码中的内容:

scene = new THREE.Scene();

var axisHelper = new THREE.AxisHelper( 1 );
scene.add( axisHelper );

var geometry = new THREE.BoxGeometry(1,1,1);
var material = new THREE.MeshBasicMaterial( {
    color: 0xffff00
} );
cube = new THREE.Mesh( geometry, material );

// Setup animation
var animationData = {
    "name"      : "Action",
    "fps"       : 25,
    "length"    : 2.0, 
    "loop"      : true,
    "timescale" : 1,
    "hierarchy" : [
    {
        "parent" : -1, //root
        "keys"   : [
        {
            "time":0,
            "pos" :[0,0,0],
            "rot" :[0,0,0],
            "scl" :[1,1,1]
        },
        {
            "time":1.0,
            "rot" :[0,Math.PI/5,0]
        },
        {
            "time":2.0,
            "rot" :[0,Math.PI/2,0]
        }
        ]
    }
    ]
};      

rotationAnimation = new THREE.Animation(cube, animationData);
rotationAnimation.play();
scene.add(cube);
当我在没有倒数第二行的情况下运行代码时(或者在代码后面有一个.stop()),我会得到一个非动画立方体(如预期的那样)。但是,当我播放动画时,立方体完全消失,没有控制台错误。从我所能诊断的一切来看,这似乎是animationData的JSON对象结构的一个问题,但我无法确认这一点,因为Three.js文档对此没有任何说明,我只能在本例中找到它:


如果有人能告诉我这里有什么问题,我将不胜感激。

当谈到如何处理three.js的问题时,我发现深入了解(不断变化的)源代码特别有帮助。这至少应该给你一个线索,看看到底发生了什么。在本例中,您似乎缺少数据中的一些关键点:(也就是说,旋转立方体不够复杂,无法使用动画系统,但我猜您正在制作原型)@Leeft是的,我正在准备生成更复杂的运动。你能解释一下“数据中缺少一些键”是什么意思吗?在您提供的链接中,
prevKey
nextKey
THREE.Animation
的范围内定义。