Three.js

Question

Three.js版本：71

Blender 版本：2.75a

我想从 Blender 导出线框模型，并让它们出现在我的 Three.js 场景中，就像它们在 Blender 中的显示一样。这样我就可以将它们用作模型的轮廓边框。例如，这是启动 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 中未连接的角顶点。这是我将它加载到我的场景后的样子：

Answer 1

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

一种方法是使用 EdgesHelper，像这样：

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

您还可以看到this related answer。

three.js r.71

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

Three.js - Extra faces created when exporting model from Blender

blender