Three.js 导入 Blender 模型：未捕获的 TypeError：无法读取未定义的属性“长度”答案

【问题标题】：Three.js Importing Blender model: Uncaught TypeError: Cannot read property 'length' of undefinedThree.js 导入 Blender 模型：未捕获的 TypeError：无法读取未定义的属性“长度”
【发布时间】：2017-05-10 15:20:14
【问题描述】：

我正在尝试使用 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。

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

这是我的代码：（我正在关注这个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":[...]
        }
    }
}

【问题讨论】：

标签： three.js blender

【解决方案1】：

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

【讨论】：

【解决方案2】：

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

【讨论】：

你能举例说明你是如何加载模型的吗？