Threejs 传入顶点数据 设置

threejs 什么都写好了，于是我就把自己的webgl 迁移到threejs上实现

加载自己定义的json文件，得到顶点，法向量，颜色的数据，怎么在threejs 中设置？

 

var geometry = new THREE.BufferGeometry();

把得到数据设置到attribute 中；

geometry.addAttribute( 'position', new THREE.Float32BufferAttribute( vertices, 3 ));
geometry.addAttribute( 'normal', new THREE.Float32BufferAttribute( normals, 3 ));
geometry.addAttribute( 'color', new THREE.Float32BufferAttribute( colors, 4 ) );
geometry.addAttribute( 'index', new THREE.Uint16BufferAttribute( indices, 1 ));

position 对应第是顶点；

normal 对应的是 法向量

color 对应的是颜色

index 对应的是下标，

然后设置材质对象， 

var material = new THREE.MeshLambertMaterial( {

     shininess: 0,
    side: THREE.DoubleSide,
    vertexColors: THREE.VertexColors,
    //map:meshMaterialMap
} );
vertexColors: THREE.VertexColors,这个必须设置成THREE.VertexColors,它计算的时候就以顶点颜色来计算颜色；
其它的参数：


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

scene.add( mesh );//添加进场景

如果要在模型复用旋转什么的，比如我从revit 中导出的数据，桌子这些重复的数据就只用了一个模型，来减少加载文件的数据大小；然后进行变换得到它实际的位置，发现设置矩阵没有用，只能单独设旋转（四元数），平移，缩放；

如下：