Three.js导入Blender模型:Uncaught TypeError:无法读取属性' length'未定义的

时间:2016-12-26 04:43:36

标签: three.js blender

我尝试使用Three.js Blender Export工具将Blender模型导入three.js。但是,我收到了错误:Uncaught TypeError: Cannot read property 'length' of undefined

我已尝试浏览其他Stack Overflow主题,我尝试使用THREE.ObjectLoader()代替。但是,我收到了此错误Uncaught TypeError: Cannot read property 'type' of undefined

我目前使用的是版本R83 of three.js。

这是我的代码:(我跟随此tutorial。)

var scene, camera, renderer;

var WIDTH = window.innerWidth;
var HEIGHT = window.innerHeight;

var speed = 0.01;

function init() {
    scene = new THREE.Scene();

    initMesh();
    initCamera();
    initLights();
    initRenderer();

    document.body.appendChild(renderer.domElement);
}

function initCamera() {
    camera = new THREE.PerspectiveCamera(70, WIDTH / HEIGHT, 1, 10);
    camera.position.set(0, 3.5, 5);
    camera.lookAt(scene.position);
}

function initRenderer() {
    renderer = new THREE.WebGLRenderer( {alpha: true} );
    renderer.setSize(WIDTH, HEIGHT);
}

function initLights() {
    var light = new THREE.AmbientLight(0xFFFFFF);
    scene.add(light);
}

var mesh = null;
function initMesh() {
    var loader = new THREE.JSONLoader();
    loader.load('js/cube.json', function(geometry, materials) {
        mesh = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials));
        mesh.scale.x = mesh.scale.y = mesh.scale.z = 0.75;
        mesh.translation = THREE.GeometryUtils.center(geometry);
        scene.add(mesh);
    });
}

function rotateMesh() {
    if (!mesh) {
        return;
    }

    mesh.rotation.x -= SPEED * 2;
    mesh.rotation.y -= SPEED
    mesh.rotation.z -= SPEED * 3;
}

function render() {
    requestAnimationFrame(render);
    rotateMesh();
    renderer.render(scene, camera);
}

init();
render();

这就是我的cube.json的样子:

{
    "metadata":{
        "generator":"io_three",
        "type":"BufferGeometry",
        "position":23382,
        "version":3,
        "normal":23382
    },
    "data":{
        "attributes":{
            "position":{
                "type":"Float32Array",
                "itemSize":3,
                "array":[...]
            },
            "normal":{
                "type":"Float32Array",
                "itemSize":3,
                "array":[...]
            }
        },
        "index":{
            "type":"Uint16Array",
            "itemSize":1,
            "array":[...]
        }
    }
}

2 个答案:

答案 0 :(得分:8)

我通过将导出器设置从Type: BufferGeometry更改为Type: Geometry来解决了这个问题。希望如果有人遇到同样的问题,这将有所帮助。

答案 1 :(得分:0)

在导出器设置中包含“场景”为我解决了这个问题,并允许导出为Buffergeometry并使用ObjectLoader读取Three.js而没有问题。