1.Three三大基本元素：
scene：場景
camera：相機
renderer：渲染器
新建html文件：
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>My first three.js app</title>
<style>
body { margin: 0; }
canvas { width: 100%; height: 100% }
</style>
</head>
<body>
<script src="js/three.js"></script>
<script>
// Our Javascript will go here.
</script>
</body>
</html>基本js代碼：
var scene = new THREE.Scene();//設置場景
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );//設置相機
var renderer = new THREE.WebGLRenderer();//設置渲染器
renderer.setSize( window.innerWidth, window.innerHeight );//設置大小
document.body.appendChild( renderer.domElement );//將渲染器元素添加到dom中創建幾何體：
1.幾何體
2.材質
二.三大基本元素講解
1.scene 保存所有物體、光源、攝像機以及渲染所需的其他對象,繼承自Three.object3D的對象
屬性：
| 方法 | 描述 |
| add（object） | 用於向場景中添加對象。使用該方法還可以創建對象組。 |
| children | 用於返回一個場景中所有對象的列表，包括攝像機和光源 |
| getObjectByName(name,recursive) | 在創建對象時可以指定唯一的標識 name，使用該方法可以查找特定名字的對象。
|
| remove(object) | object 爲場景中對象的引用，使用該方法可以將對象從場景中移除 |
| traverse(function) | 該方法也可以遍歷調用者和調用者的所有後代，function 參數是一個函數，被調用者和每一個後代對象調用 function 方法。 |
| fog | 使用該屬性可以爲場景添加霧化效果，可以產生隱藏遠處物體的濃霧效果。 |
| overrideMaterial | 使用該屬性可以強制場景中的所有物體使用相同的材質。 |
2.camera
分爲正交相機和透視相機，正交投影理解爲到面的投影，投影線垂直於投影面進行投影，因此物體投影之後的比例是保持不變的。而對於透 視 投影我們可以理解爲到點的投影，所有的投影線最後都將匯聚於一點，透視投影的特點就是近大遠小。
如圖；
a>OrthographicCamera( left, right, top, bottom, near, far )
left就是視錐左側面，
right就是視錐右側面，
top就是視錐上側面，
而bottom就是視錐下側面。
near是到距離相機較近的那一面的距離，
far是離距離相機較遠的那一面的距離，這六個投影面圍成的區域就是相機投影的可見區域。
b>PerspectiveCamera( fov, aspect, near, far )
fov：角度
aspect：
near：最近距離
far：最遠距離
屬性：
position:設置相機位置
lookAt（）看向某個位置;例如：lookAt（{x:0,y:0,z:0}）
up，指向上的方向爲某個軸（設置爲1，則爲向上方向）camera.up.x=1
3.three.js渲染器分支：
renderers：
a.CanvasRenderer
b.DOMRenderer
c.SVGRenderer
d.WebGLRenderer
e.WebGLRenderTarget
f.WebGLRenderTargetCube
g.WebGLShaders
我們把canvasRenderer和webglRenderer進行比較
區別：
1.調用方式不同：
canvasRenderer：renderer=new THREE.CanvasRenderer();
WebGLRenderer：renderer=new THREE.WebGLRenderer();
2.效果圖對比：
WebGL在渲染效果上更勝一籌，WebGL的渲染能夠最大程度表現你製作精美的場景
CanvasRenderer擁有更好的兼容性4.燈光
有四種常見燈光：1》環境光（AmbientLight）籠罩在整個空間無處不在的光
2》點光源（PointLight）3》聚光燈（SpotLight）4》平行光（DirectinalLight）
還有半球光光源( HemisphereLight )，平面光光源( AreaLight )
相對於能產生陰影：平行光>聚光燈>點光源