许多具有相同几何形状和材料的网格，我可以更改它们的颜色吗? [英] Many meshes with the same geometry and material, can I change their colors?

问题描述

我有大量(约 1000 个)THREE.Mesh 对象，它们是从相同的 THREE.Geometry 和 THREE.MeshPhongMaterial(有地图).

I have a large number (~1000) of THREE.Mesh objects that have been constructed from the same THREE.Geometry and THREE.MeshPhongMaterial (which has a map).

我想分别为这些对象着色(着色).

I would like to tint (color) these objects individually.

天真地，我尝试更改 mesh.material.color 属性，但是更改任何对象的此属性会同时更改所有对象的颜色.这是有道理的，因为只有一种材料在所有对象之间共享.

Naïvely, I tried changing the mesh.material.color property, but changing this property on any of the objects changes the color of all the objects at once. This makes sense, since there is only one material that is shared among all the objects.

我的下一个想法是为每个对象创建一个单独的 THREE.MeshPhongMaterial.所以，现在我有大量的 THREE.Mesh 对象是从相同的 THREE.Geometry 构造的，但是有单独的 THREE.MeshPhongMaterials(共享相同的纹理).这允许我单独更改颜色，但性能更差.chrome 分析器显示该应用花费了大量时间来处理材质方面的事情，例如切换纹理.

My next idea was to create a separate THREE.MeshPhongMaterial for each object. So, now I have a large number of THREE.Mesh objects that been constructed from the same THREE.Geometry, but have individual THREE.MeshPhongMaterials (that share the same texture). This allows me to change the colors individually, but the performance is worse. The chrome profilier shows that the app is spending significant time doing material-things like switching textures.

材质颜色只是着色器中的统一.所以，更新制服应该很快.

The material color is just a uniform in the shader. So, updating that uniform should be quite quick.

问题:有没有办法从网格级别覆盖材质颜色?

question: Is there a way to override a material color from the mesh level?

如果有的话，我相信我可以在我的所有对象之间共享材料并恢复我的表现，同时仍然单独改变颜色.

If there was, I believe I could share the material among all my objects and get my performance back, while still changing the colors individually.

[我已经在 v49 和 v54 上测试过，它们具有相同的性能和降级]

[I have tested on v49 and v54, they have identical performance and degredation]

更新:我已经构建了一个测试用例，由此导致的性能下降比我想象的要小，但仍然可以衡量.

update: I have built a test case, and the performance drop due to this is smaller than I thought it was, but is still measurable.

这里有两个链接:

• http://danceliquid.com/docs/threejs/material-test/index.html?many-materials=false
• http://danceliquid.com/docs/threejs/material-test/index.html?many-materials=true

在第一种情况下，只有两种材质，在第二种情况下，每个立方体都有自己的材质.我在这台机器上测出第一种情况的帧率为53fps，第二种情况的帧率为46fps.这大约下降了 15%.

In the first case, there are only two materials, in the second case each cube has it's own material. I measure the framerate of the first case to be 53fps on this machine, and the framerate of the second is 46fps. This is about a 15% drop.

在这两种情况下，每个立方体的材质颜色每帧都会改变.在有很多材质的情况下，我们实际上看到每个立方体都有自己的颜色，在只有两种材质的情况下，我们看到它们都具有相同的颜色(如预期).

In both cases, the color of the material of every cube is changed every frame. In the case with many materials, we actually see each cube getting it's own color, in the case with only two materials, we see them all having the same color (as expected).

推荐答案

是的.每个对象，使用 material.clone() 克隆你的材质，修改它的 emissive 和 color，并将对象的材质设置为这个克隆.着色器和属性是通过引用复制的，所以不用担心每次都克隆整个材质；事实上，唯一被值复制的是uniforms(例如emissive 和color).因此，您可以针对单个对象更改这些设置.

Yes. Per object, clone your material using material.clone(), modify its emissive and color, and set the object's material to this clone. Shaders and attributes are copied by reference, so do not worry that you are cloning the entire material each time; in fact the only things that are copied by value are the uniforms (such as emissive and color). So you can change these per individual object.

我个人将原始材料存储在对象的一个​​单独的自定义属性上，以便以后可以轻松切换回它；取决于您的需求.

Personally I store the original material on a separate, custom property of the object so that I can easily switch back to it later; depends what your needs are.

这篇关于许多具有相同几何形状和材料的网格，我可以更改它们的颜色吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！