将JSON文件加载器中的颜色传递给面

Question

我是以编程方式生成一个json文件来加载一个网格,顶点和面渲染得很好,但我无法弄清楚如何将颜色传递到面.

这是我正在尝试的json文件:

{
    "metadata" : {
        "formatVersion" : 3
    },
    "materials" : [],
    "vertices" : [-10,10,0, -10,-10,0, 10,-10,0, 10,10,0, -10,10,10,  -10,-10,10,  10,-10,10,  10,10,10],
    "faces" : [4, 0, 1, 3, 0], //or with 0 as the first number for a plain triangle
    "normals": [],
    "colors": [0.5, 0.4, 0.3],
    "uvs": []
}

像这样加载:

loader.load( "js/models/square.js", function(geometry) {
    var material = new THREE.MeshLambertMaterial( {
        faceColors : THREE.FaceColors,
    });
    material.side = THREE.DoubleSide;

    var mesh = new THREE.Mesh(geometry, material);
}

我的核心问题是我遇到了bitmask如何工作,但这里的FACE_COLOR位https://github.com/mrdoob/three.js/wiki/JSON-Model-format-3.1表明它应该可行,任何非常感谢帮助...谢谢!

Answer 1

首先,您必须正确构造JSON文件.这个最简单的例子是这样的,它定义了一个具有面颜色的立方体:

{
    "metadata" : {
        "formatVersion" : 3
    },
    "materials" : [],
    "vertices" : [ -5,5,-5,  -5,-5,-5,  5,-5,-5,  5,5,-5,  -5,5,5,  -5,-5,5,  5,-5,5,  5,5,5 ],
    "faces" : [ 65,3,2,1,0,0,  65,4,5,6,7,1,  65,7,6,2,3,2,  65,0,1,5,4,3,  65,0,4,7,3,0,  65,6,5,1,2,1 ],
    "colors": [ 16711680, 65280, 255, 16776960 ],
    "normals": [],
    "uvs": []
}

在该示例中,为每个面分配四种面部颜色中的一种.颜色以十进制格式指定,例如0xff0000 = 16711680.

每个面的位掩码代码是64(对于面部颜色)+ 1(对于四边形)= 65.

然后,由于你没有指定顶点法线,我假设你想要的是什么MeshBasicMateral.此外,没有"faceColors"属性 - 它是vertexColors.而且,您必须记住将网格添加到场景中.

var loader = new THREE.JSONLoader();

loader.load( "cube.js", function( geometry ) {
    var material = new THREE.MeshBasicMaterial( {
        vertexColors : THREE.FaceColors,
    });

    var mesh = new THREE.Mesh( geometry, material );
    scene.add( mesh );
}

three.js r.53