案例:Three 组对象Group、层级模型2-小机器人     状态:可编辑再运行    进入竖版
 运行结果 
x
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
  <meta charset="UTF-8">
5
  <style>
6
    body {
7
      margin: 0;
8
      overflow: hidden;
9
      /* 隐藏body窗口区域滚动条 */
10
    }
11
  </style>
12
  <!--引入three.js三维引擎-->
13
  <script src="/js/threejs/threer92.js"></script>
14
  <script src="/example/threejs/solarsystem/files/OrbitControls.js"></script>
15
</head>
16
17
<body>
18
  <script>
19
    //创建场景
20
    var scene = new THREE.Scene();
21
22
23
    // 头部网格模型和组
24
var headMesh = sphereMesh(10, 0, 0, 0);
25
headMesh.name = "脑壳"
26
var leftEyeMesh = sphereMesh(1, 8, 5, 4);
27
leftEyeMesh.name = "左眼"
28
var rightEyeMesh = sphereMesh(1, 8, 5, -4);
29
rightEyeMesh.name = "右眼"
30
var headGroup = new THREE.Group();
31
headGroup.name = "头部"
32
headGroup.add(headMesh, leftEyeMesh, rightEyeMesh);
33
// 身体网格模型和组
34
var neckMesh = cylinderMesh(3, 10, 0, -15, 0);
35
neckMesh.name = "脖子"
36
var bodyMesh = cylinderMesh(14, 30, 0, -35, 0);
37
bodyMesh.name = "腹部"
38
var leftLegMesh = cylinderMesh(4, 60, 0, -80, -7);
39
leftLegMesh.name = "左腿"
40
var rightLegMesh = cylinderMesh(4, 60, 0, -80, 7);
41
rightLegMesh.name = "右腿"
42
var legGroup = new THREE.Group();
43
legGroup.name = "腿"
44
legGroup.add(leftLegMesh, rightLegMesh);
45
var bodyGroup = new THREE.Group();
46
bodyGroup.name = "身体"
47
bodyGroup.add(neckMesh, bodyMesh, legGroup);
48
// 人Group