解答: 替換 createStairs() 內的程式:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
// 往上多少階
var stepPair;
var riserHeight = verticalStepHeight + stepThickness;
var riserDepth = horizontalStepDepth - stepThickness;
for ( stepPair = 0; stepPair < 6; stepPair++ ) {
    // 創造與移動垂直部分
    stepMesh = new THREE.Mesh( stepVertical, stepMaterialVertical );
    // 盒子中心位置
    // 你可以用 THREE.Vector3(x, y, z) 或是以下方式:
    stepMesh.position.x = 0; 
    stepMesh.position.y = verticalStepHeight / 2 + stepPair * riserHeight; 
    stepMesh.position.z = stepPair * riserDepth; 
    scene.add( stepMesh ); 

    // 創造與移動水平部分
    stepMesh = new THREE.Mesh( stepHorizontal, stepMaterialHorizontal );
    stepMesh.position.x = 0;
    // 往上推半個水平的厚度加上整個垂直的高度
    stepMesh.position.y = stepThickness / 2 + verticalStepHeight + stepPair * riserHeight;
    // 往前推半個水平的深度,再拉回半個垂直的厚度
    stepMesh.position.z = horizontalStepDepth / 2 - stepHalfThickness + stepPair * riserDepth;
    scene.add( stepMesh );
}