threejs transparent color

Question

1つのメッシュで不透明度の変化する領域を持つことができるように、（vertColors配列で定義されている）色で特定の頂点透明度を設定したいと考えています。

特定の色として定義されているすべての頂点を透明にする簡単な方法はありますか？

私は考えました。 MeshBasicMaterialのシェーダを拡張/変更して、すべての黒い領域を透明に定義することは可能でしょうか？

これを行うには、このマテリアルの出力を2番目のシェーダーに渡すことができますか？

const geometry = new THREE.BufferGeometry(); 

const vertPositions = createVertPositions(); //Float32Array of positions 
const vertColors = createVertColors(); //Float32Array of colors 

geometry.addAttribute('position', new THREE.BufferAttribute(vertPositions, 3)); 
geometry.addAttribute('color', new THREE.BufferAttribute(vertColors, 3)); 

const material = new THREE.MeshBasicMaterial({ 
    transparent: true, 
    opacity: 0.5, 
    side: THREE.BackSide, 
    vertexColors: THREE.VertexColors 
}); 

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

ありがとうございました。

Answer 1

の.alphaMapプロパティを使用して、何をしようとしているかがドキュメントからわかります。 WebGLRendererでは、緑チャンネルをアルファチャンネルではなくアルファ値（RGB）として使用することに注意してください。

カラー配列を作成するためにループするときに、同時に色の値に応じてアルファマップ配列を作成できます。その配列をテクスチャに変換して.alphaMapプロパティに代入する必要があります。