案例:Three 几何体建模9 旋转建模     状态:可编辑再运行    进入竖版
 运行结果 
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
var shape = new THREE.Shape();//创建Shape对象
23
var points = [//定位定点
24
    new THREE.Vector2(50,60),
25
    new THREE.Vector2(25,0),
26
    new THREE.Vector2(50,-60)
27
];
28
shape.splineThru(points);//顶点带入样条插值计算函数
29
var splinePoints = shape.getPoints(20);//插值计算细分数20
30
var geometry = new THREE.LatheGeometry(splinePoints,30);//旋转造型
31
      
32
var material=new THREE.MeshPhongMaterial({
33
    color:0x0000ff,//三角面颜色
34
    side:THREE.DoubleSide//两面可见
35
});//材质对象
36
material.wireframe = false;//线条模式渲染设置为false(查看细分数)
37
var mesh=new THREE.Mesh(geometry,material);//旋转网格模型对象
38
scene.add(mesh);//旋转网格模型添加到场景中
39
      
40
      
41
    /**
42
     * 光源设置
43
     */
44
    //点光源
45
    var point = new THREE.PointLight(0xffffff);
46
    point.position.set(400, 200, 300); //点光源位置
47
    scene.add(point); //点光源添加到场景中
48
    //环境光