Three.js - 从 Blender 导出模型时创建的额外面答案

【问题标题】：Three.js - Extra faces created when exporting model from BlenderThree.js - 从 Blender 导出模型时创建的额外面
【发布时间】：2015-12-01 20:24:57
【问题描述】：

三个.js 版本：71

Blender 版本：2.75a

我想从 Blender 中导出线框模型，并让它们在我的 Three.js 场景中完全按照它们在 Blender 中的显示方式出现。这样我就可以将它们用作模型的轮廓边框。例如，这是启动搅拌机时默认立方体的线框模型：

这是我导出后此模型的 JSON：

{
    "uvs": [],
    "name": "CubeGeometry.1",
    "materials": [{
        "wireframe": true,
        "DbgName": "Material",
        "depthWrite": true,
        "transparent": false,
        "depthTest": true,
        "specularCoef": 50,
        "colorAmbient": [0.64,0.64,0.64],
        "opacity": 1,
        "vertexColors": false,
        "DbgIndex": 0,
        "DbgColor": 15658734,
        "shading": "phong",
        "visible": true,
        "colorEmissive": [0,0,0],
        "blending": "NormalBlending",
        "colorSpecular": [0.5,0.5,0.5]
    }],
    "faces": [35,0,1,2,3,0,0,1,2,3,35,4,7,6,5,0,4,5,6,7,35,0,4,5,1,0,0,4,7,1,35,1,5,6,2,0,1,7,6,2,35,2,6,7,3,0,2,6,5,3,35,4,0,3,7,0,4,0,3,5],
    "vertices": [1,-1,-1,1,-1,1,-1,-1,1,-1,-1,-1,1,1,-1,0.999999,1,1,-1,1,1,-1,1,-1],
    "metadata": {
        "uvs": 0,
        "materials": 1,
        "generator": "io_three",
        "vertices": 8,
        "faces": 6,
        "normals": 8,
        "type": "Geometry",
        "version": 3,
        "colors": 0
    },
    "normals": [0.577349,-0.577349,-0.577349,0.577349,-0.577349,0.577349,-0.577349,-0.577349,0.577349,-0.577349,-0.577349,-0.577349,0.577349,0.577349,-0.577349,-0.577349,0.577349,-0.577349,-0.577349,0.577349,0.577349,0.577349,0.577349,0.577349],
    "colors": []
}

注意有 6 个面孔。我希望它在我的 Three.js 场景中完全像这样出现。但是，会绘制额外的面。这通常是因为出于某种原因 Three.js 正在连接 Blender 中未连接的角顶点。这是我将其加载到场景中后的样子：

【问题讨论】：

见stackoverflow.com/questions/20153705/…
从那个答案中，我像这样使用了 THREE.EdgesHelper：var egh = new THREE.EdgesHelper( mesh, 0x00ffff ); egh.material.linewidth = 2; scene.add( egh ); 有效，所以请说明你的答案，我会接受 =)

标签： three.js blender

【解决方案1】：

您想以线框模式渲染立方体或盒子，但没有对角线。

一种方法是使用EdgesHelper，如下所示：

var helper = new THREE.EdgesHelper( mesh, 0xff0000 );
helper.material.linewidth = 2;
scene.add( helper );

你也可以看到this related answer。

three.js r.71

【讨论】：