我的模型从blender导出到three.js不能正确渲染

时间:2014-03-20 21:58:29

标签: javascript three.js webgl blender

我正在尝试使用three.js为我的网站制作一个简单的齿轮动画。我在Blender中创建了一个齿轮网格和一个漂亮,闪亮的青铜材质,并使用下面的代码将其导出为带有blender导出器的three.js json格式。

var camera, scene, renderer, mesh, loader

init();

function init() {
    scene = new THREE.Scene();
    camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
    camera.position.z = 5;
    var ambientlight = new THREE.AmbientLight(0x404040); // soft white light 
    var pointlight = new THREE.PointLight(0xFFFFFF);
    pointlight.z = 5;
    scene.add(pointlight);
    scene.add(ambientlight);

    renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    document.body.appendChild(renderer.domElement);

    loader = new THREE.JSONLoader();
    loader.load("gear.js", function(geometry, materials) {
        mesh = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials));
        scene.add(mesh);
        mesh.rotation.x += 1.5;
        animate()
    });
}
function animate() {
    requestAnimationFrame(animate);
    mesh.rotation.y += 0.02;
    mesh.rotation.x += 0.01;
    renderer.render(scene, camera);
}

以下是Blender中网格的截图: Blender Screenshot \

以下是three.js呈现内容的屏幕截图: Three.js screenshot 注意如何仅渲染齿轮的后部。 我不知道为什么会这样,如果有人能给我一个指针代码我会非常感激。

修改

用户gaitat指出它看起来像是从里面渲染出来的。这是一个比“仅渲染齿轮的后部”更好的描述。

1 个答案:

答案 0 :(得分:2)

你的法线是向后的(正如其他人指出的那样)。

也许你向后挤压制造装备?

我不是搅拌机专家,而是a quick google brings up a bunch of hits for flipping normals