私は、すべての個別の小さなdivから作成された3Dで立方体を作成しようとしています。3*3*3 div の立方体があるとしましょう。すべてのdivについて与えられたもの:
- X、Y、Z 座標 (3D キューブの)
- X 軸と Y 軸を中心とした回転角度
立方体の 2D 透視投影を計算するには、技術的にはこれで十分です。問題は次のとおりです。各 div の X 座標と Y 座標を計算するにはどうすればよいですか?
Ps。このような立方体の同様の例は、次のリンクにあります: http://maettig.com/code/javascript/3d_dots.html。この例で気に入らない点は次の 2 つです。
- 立方体の回転方法。たとえば、マウスを下に押すと、立方体が上に回転します。また、マウスの水平方向の移動の場合、立方体は常に同じ軸を中心に回転し、マウスの垂直方向の移動の場合、立方体は水平方向の回転に対して相対的に回転します。
- 立方体の角に「+」しかありません。塗りつぶされた (巨大な) 立方体が必要です。