instancedMesh中的分离材料反应三种纤维

Question

我实际上有一堆几何图形，我需要显示唯一和更新文本。

我一直用来显示文本的方法是使用画布材料(以及网格位置)在useFrame中不断更新。

然而，我唯一能够让纹理工作的方法如下，所有的几何形状显然都是共享的。

<instancedMesh ref={meshRef} args={[null, null, intervalData.length]}>
<circleBufferGeometry args={[sizes.radius ?? 0.6, sizes.segments ?? 48]}>
<instancedBufferAttribute attachObject={['attributes', 'color']} args={[colorArray, 3]} />
</circleBufferGeometry>
<meshStandardMaterial vertexColors={THREE.VertexColors} map={texture}/>
</instancedMesh>

如何设置每个实例的纹理?是否有地方可以存储纹理数组并将它们分配给网格?

Answer 1

对你来说可能已经很晚了，但如果其他人被同样的问题困住了，也许就会这样。我已经这样解过了https://codesandbox.io/s/instancedmesh-with-different-textures-forked-iy5xh?file=/src/App.js虽然我单独传递每个纹理，但它有缺点，你只能传递16个纹理到单个着色器，所以也许你必须使用纹理图集(基本上是由多个纹理组成的单个纹理，你也传递了几个更多的属性来从整个纹理中裁剪特定的纹理部分)

Answer 2

使用Sprite可能会超过InstancedMesh的任何性能提升，更不用说更有用了。