3.1 基本幾何形狀
圓柱體（CylinderGeometry）
構造函數：
1 THREE.CylinderGeometry(radiusTop, radiusBottom, height, radiusSegments, heightSegments, openEnded)
radiusTop：頂面的半徑；
radiusBottom：底面的半徑；
height：是圓柱體的高度；
radiusSegments：兩底面的分段切片；
heightSegments：側面的分段切片；
openEnded：是一個布爾值，表示是否沒有頂面和底面，缺省值為false，表示有頂面和底面。
標准圓柱體
例如，new THREE.CylinderGeometry(2, 2, 4, 20, 20, false)，將創建一個上下底面半徑為2，高度為4，其各面的切片為20，有底面。
一點說明：
由於圓柱體的參數特性，我們可以想，其實可以組合出很多其他的圖形
例如：
圓台
例如，new THREE.CylinderGeometry(2, 3, 4, 18, 3)，將創建一個上底面半徑為2，下地面半徑為3，高度為4，底面的分段切片為18，側面為3。
圓錐
例如，new THREE.CylinderGeometry(0, 3, 6, 18, 3, false)
棱錐
等等.....
一個標准圓柱體的代碼示例demo以及效果圖
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script type="text/javascript" src="./three.js"></script>
<title>Document</title>
</head>
<body onload="init()">
<!-- 頁面加載觸發init()初始化函數， -->
<script>
function init() {
//渲染器
var renderer = new THREE.WebGLRenderer();
renderer.setSize(800, 600);
document.getElementsByTagName('body')[0].appendChild(renderer.domElement);
renderer.setClearColor(0x00000);
//場景
var scene = new THREE.Scene();
var aspect = window.innerWidth / window.innerHeight;
//相機
var camera = new THREE.OrthographicCamera(-4 * aspect, 4 * aspect, -3 * aspect, 3 * aspect, 1, 500);
camera.position.set(0, 0, 200);
camera.lookAt(new THREE.Vector3(0, 0, 0));
scene.add(camera);
var circle = new THREE.Mesh(new THREE.CircleGeometry(3, 50, Math.PI, Math.PI / 3 * 4),
new THREE.MeshBasicMaterial({
color: 0xff0000,
wireframe: true
})
)
scene.add(circle)
//觸發渲染
renderer.render(scene, camera);
}
</script>
</body>
</html>
