用三个js更改合并网格上的材质颜色

问题描述：

在合并多个网格以更改选定单独网格上的颜色时，可以与缓冲区交互使用吗？用三个js更改合并网格上的材质颜色

用网格集合很容易做到这样的事情，但是如何用多种不同的材质合并网格呢？

答

取决于“改变颜色”的含义。请注意，合并后，网格就像其他任何未合并网格一样。

如果您指的是顶点颜色，则可能会遍历面并根据材质索引确定要更改颜色的顶点。

如果你的意思是为材料本身设置一种颜色，确定它是可能的。合并后的网格物体仍然可以使用与普通网格物体相同方式的多种材质 - 在MeshFaceMaterial中，尽管如果要合并自己，您需要为每个几何体传入材料索引偏移量参数。

thanx的精度，我认为我们很好，改变颜色materiel点击网格（合并200网格到一个）的索引，会检查出这 – hgates 2013-05-07 13:34:31

答

this.meshMaterials.push(new THREE.MeshBasicMaterial(
    {color:0x00ff00 * Math.random(), side:THREE.DoubleSide})); 

for (var face in geometry.faces) { 
    geometry.faces[face].materialIndex = this.meshMaterials.length-1; 
} 

var mesh = new THREE.Mesh(geometry); 

THREE.GeometryUtils.merge(this.globalMesh, mesh); 
var mesh = new THREE.Mesh(this.globalMesh, new THREE.MeshFaceMaterial(this.meshMaterials));

工程就像一个魅力，为那些需要示例，但！这创建了多个额外的缓冲区（索引和顶点数据），并且多个drawElements也调用:(我检查绘制调用与webgl inpector，之前添加MeshFaceMaterial：75调用opengl api容易在60fps运行，之后：3490调用opengl api fps下降约20％45-50 fps，这意味着drawElements被称为每个网格，我们没有合并网格的上下文，我错过了这里的东西吗？我想在同一个缓冲区上共享不同的材质

没有人得到答案？我想尽量减少平局，通过这段代码，我可以用多种材料构建一个网格，但是有太多的平局，请回答或提示，任何事情，如果你有任何想法的话!! – hgates 2013-05-14 12:42:57

好的，我在每个面上设置一个颜色，并在材质上设置为true vertexColor，即解决问题！ :) – hgates 2013-05-14 22:17:34

答

@hgates，你最近的评论对我很有帮助，我一直在寻找相同的东西！

好吧我设置了每个面对一种颜色，并在材质上设置为true vertexColor，即可解决问题！ :)

这里我写的整个概念是我为了增加一个合适的回答为那些谁是在相同的情况下使用：

// Define a main Geometry used for the final mesh 
var mainGeometry = new THREE.Geometry(); 

// Create a Geometry, a Material and a Mesh shared by all the shapes you want to merge together (here I did 1000 cubes) 
var cubeGeometry = new THREE.CubeGeometry(1, 1, 1); 
var cubeMaterial = new THREE.MeshBasicMaterial({vertexColors: true}); 
var cubeMesh = new THREE.Mesh(cubeGeometry); 

var i = 0; 

for (i; i<1000; i++) { 

    // I set the color to the material for each of my cubes individually, which is just random here 
    cubeMaterial.color.setHex(Math.random() * 0xffffff); 

    // For each face of the cube, I assign the color 
    for (var j = 0; j < cubeGeometry.faces.length; j ++) { 
     cubeGeometry.faces[ j ].color = cubeMaterial.color; 
} 

    // Each cube is merged to the mainGeometry 
    THREE.GeometryUtils.merge(mainGeometry, cubeMesh); 
} 

// Then I create my final mesh, composed of the mainGeometry and the cubeMaterial 
var finalMesh = new THREE.Mesh(mainGeometry, cubeMaterial); 
scene.add(finalMesh);

希望这将有助于它帮我！ :)

用三个js更改合并网格上的材质颜色

相关推荐