Three.jsでキューブを切断する方法

Question

以前にこの特定の問題に遭遇したことがあるのだろうかと思います。 webglとthree.jsを使って3次元オブジェクトをどのように描いているかについて私が基本的に理解しているところでは、キューブジオメトリーからジオメトリを継承した並列配列を作成する方法は見つけられません（または、すべての角度が90度ではありません。結果は

-moz-transform: skew(0,-45.1deg); 

は、html要素のために何をするのかと非常に似なければなりません

：

私の目標は、このようなものを持っていることです。誰も私が解決策を見つけるのを助けることができますか？

ご理解いただきありがとうございます。

Answer 1

必要な作業は、キューブメッシュを作成し、のキューブのジオメトリにシェアマトリックスを適用することです。操作は、記述した方法でジオメトリを歪ませます。ここで

var geometry = new THREE.BoxGeometry(5, 5, 5); 

var matrix = new THREE.Matrix4(); 

matrix.set( 1, Syx, Szx, 0, 
      Sxy,  1, Szy, 0, 
      Sxz, Syz, 1, 0, 
       0,  0, 0, 1 ); 

geometry.applyMatrix(matrix); 

フィドルです：http://jsfiddle.net/4kHdQ/54/

EDIT：r.71