Javascript 如何合并具有不同颜色的网格并只有一个绘制调用？

我有很多相同的网格。它们的材质相同，但颜色不同。有没有一种方法可以将它们的几何体合并到一个缓冲几何体中，并为其设置一种材质

---

是的，我可以将所有材质添加到材质数组，将几何体合并到缓冲几何体，添加索引并创建一个网格。但通过这种方式，我将有和材质一样多的绘制调用，但我只需要一个。

您可以使用顶点颜色进行绘制

const myMeshes = [...]

//first go through all the meshes, and tell them that they have another attibute
//in addition to whatever they already have 
myMeshes.forEach( mesh=>{
  const thisMeshColor = new THREE.Color().copy(mesh.material.color) //the color you want to distribute
  //expand the data to match the vertices
  mesh.colors = mesh.vertices.map(vert=>thisMeshColor)
}

//merge here

//apply this to material and it should "work" 
myMerges.material.vertexColors = THREE.VertexColors

---

有些伪代码，未经测试。三个R92

听起来你的问题与你所问的不同。你是说你有几个形状相同但颜色不同的网格？为什么你认为你只需要一次抽签？@TheJim01，嗨，对不起，可能是我的英语不好带来了误会。我有很多这样的网格，和大量的绘图调用，这使得我的画布滞后。因为它们都是一样的，我想知道是否有一种方法可以通过一次抽签来实现。由于我只需要更改颜色，可能有什么诀窍吗？您可以尝试使用顶点颜色，我目前没有任何代码，正在尝试找出用户友好的方法。您也可以尝试实例化，您可以像应用顶点颜色一样应用实例化属性。如果有许多不同的网格，实例化将不起作用