タグ付けされた質問 「three.js」

頂点シェーダーを使用して、他の独立したすべての（青い）三角形をオフセットする必要があります。三角形全体を操作するために、左（紫）と右（緑）の隣接する頂点を表す各頂点（赤）のカスタム（vec3）属性を作成しました。これから、隣接する両方のエッジから等距離にある（スクリーン空間で）オレンジのポイントを導出する必要があります。各三角形から派生したこのようなオレンジ色の点が3つあるため、処理された（オレンジ色の）三角形がフラグメントシェーダーに渡されます。 理想的には、オフセットが2番目の画像の2番目の三角形のように三角形内の使用可能なスペースを無効にする場合、三角形はカリングされます（背面/レンダリングされないなど）。 データ構造としてTHREE.BufferGeometry（）を使用しています。 これが私が目指している効果のスクリーンショットです：

8 shader  three.js