Three.js CylinderGeometry(円柱)
今回は、Three.jsの「CylinderGeometry(円柱)」について書きます。
CylinderGeometry(円柱)は、Three.jsのジオメトリ(形状)の一つです。
形はコレです。
円柱です。
こちらのジオメトリ(形状)は、少し値を変えれば、円錐などの形に変える事ができます。
こんな形に変える事ができます。
CylinderGeometryのコンストラクタです。
THREE.CylinderGeometry ( radiusTop, radiusBottom, height, radiusSegments, heightSegments, openEnded );
- radiusTop ・・・上面の半径です。0にすると円錐になります。
- radiusBottom ・・・底面の半径です。
- height ・・・高さです。
- radiusSegments ・・・円周の分割数です。
- heightSegments ・・・高さの分割数です。
- openEnded ・・・true:フタをしない,false:フタをする
実際のコードは、こちらです。
//マテリアルはMeshPhongMaterial, color: 0x00FF7F // 上面半径2,下面半径20,高さ40,円周分割数50 var Cylinder = new THREE.Mesh( new THREE.CylinderGeometry(20,20,40,50), new THREE.MeshPhongMaterial({ color: 0x00FF7F })); //sceneオブジェクトに追加 scene.add(Cylinder);
上のコードを実行すると、
こうなります。
円錐の形にするには、こうします。
上面の半径を0にします。
//マテリアルはMeshPhongMaterial, color: 0x00FF7F // 上面半径0,下面半径20,高さ40,円周分割数50 var Cylinder = new THREE.Mesh( new THREE.CylinderGeometry(0,20,40,50), new THREE.MeshPhongMaterial({ color: 0x00FF7F })); //sceneオブジェクトに追加 scene.add(Cylinder);
こういう形にするには、
new THREE.CylinderGeometry(20,60,40,50)
こうします。
これで終わりです。
ご不明な点などがありましたら、遠慮なくご質問ください。
ありがとうございました!