Three.jsのBoxGeometryは長方形だから頂点の数は8つだと思っていたら全然違っているのでその理由を想像してみる。
1つのGeometryにつきてっきり8つだと思っていたので、大量のBoxGeometryを描く場合はその数の8倍の頂点数になると想像していた。しかし思ったよりも少ない数でフレームレートが落ちるようだったので調べてみた。
BufferGeometryの頂点座標は以下に記述されている。
geometry.attributes.position.array
1つの頂点あたりxyzの3座標が含まれているため8頂点なら要素数は24になるはず、しかしここには72要素が含まれている。おかしい。Geometryの表側と裏側で実際には2つのBoxが描かれているのかとも思ったが、その場合でも16頂点で要素数は48にならないとおかしい。
そして行き着いた結果は面ごとにそれぞれ別物として描かれているということ。そう考えると1つの面につき頂点数は4で面の数が6、1頂点あたりxyzの3要素となると全部で72頂点になる。
自前で頂点座標とインデックスバッファを構築しても、Three.jsの基本機能は動作するんだろうか。