w我用畫畫來形容他們之間的關系

場景就是紙張

相機就是我們的眼睛

物體就是在我們腦海中構思的那個畫面

渲染器就是繪畫這個動作

場景(Scene):

　　初始化：var scene = new THREE.Scene();

　　添加物體：scene.add( 物體對象 );

　　刪除物體：scene.remove( 物體對象 );

　　獲取場景中所有子對象的列表：scene.children()

　　利用name屬性，獲取場景中某個特定的物體：scene.getChildByName()

　　簡單霧化：scene.fog = new THREE.Fog(0xffffff,100,120);//顏色 霧化開始的時候距離相機的位置,完全霧化距離相機的位置

　　直屬霧化：scene.fog = new THREE.FogExp2(0xffffff,0.02);//顏色,霧的濃度

相機(只介紹透視投影):

　　初始化：

　　　　var camera = THREE.PerspectiveCamera(fov, aspect, near, far);

　　　　　　//fov就是我們眼睛可以看多大範圍的物體,蒼蠅眼睛可以看到後面,對於蒼蠅來說fov基本上就是360了，我們人類差不多是120

　　　　　　//aspect 照相機水平方向和豎直方向長度

　　　　　　//near far：我是近視,基本上50米開外我就什麽也看不到了(就是看不到,不是看不清),我是遠視,1米之內 我也看不到(不是看不清,是看不到 純黑的那種),所以我的可視範圍是1米到50米，把1和50設置為near far,就相當於這個功能

　　設置相機位置:

　　　　camera.position.z = 5;camera.position.x = 5;camera.position.y = 5;

　　　　　　//我們可以把攝像機擺放在任何位置 理論上

　　設置相機的拍攝方向:

　　　　camera.lookAt(new THREE.Vector3(0, 0, 0));

　　　　　　//我可以向左前方看,可以向右前方看,我們看的方向是一條直線,更確切的說是一個向量,所以lookAt的參數是一個向量

　　設置相機的頂部朝向:

　　　　camera.up.x = 0;
　　　　camera.up.y = 0;
　　　　camera.up.z = 1;

　　　　　　//我們平常用手機拍照的時候,如果你把手機倒過來排,也就是讓手機的頭部向下來拍照,我們就說你設置了手機相機的頂部朝向為向下,理論上我們可以設置任意一個方向為手機相機的頂部所指向的方向

渲染器:

　　three.js提供很多中渲染器：CanvasRenderer，DOMRenderer，SVGRenderer，WebGLRenderer，WebGLRenderTarget，WebGLRenderTargetCube，WebGLShaders

　　　　//CanvasRenderer以canva方式渲染,

　　　　//SVGRenderer以svg方式渲染,

　　　　//WebGLRenderer則是以webGL方式渲染,（三種方式的區別相當於,我們可以用canvas實現繪圖,也可以用svg實現繪圖,您說 canvas繪圖與svg繪圖之間的區別是什麽？）

　　　　//WebGLRenderTarget是特有的表示渲染到其他物體上 而不是屏幕上

　　WebGLRenderTarget的具體用途:

　　　　renderer.render(bufferScene, camera, bufferTexture);//把bufferTexture以camera的視角渲染到bufferScene上，因為我們沒有渲染到屏幕上，所以我們什麽也看不到,那我們如何用他呢,

　　　　var boxMaterial = new THREE.MeshBasicMaterial({map:bufferTexture});//我們可以把bufferTexture當作一個紋理然後覆蓋在A物體上,當A物體被放到屏幕上,我們自然可以看到bufferTexture(MeshBasicMaterial以後會做介紹)

　　　　WebGLRenderTargetCube：？？？我目前也不清楚

　　　　WebGLShaders：？？？我目前也不清楚

　　WebGLRenderer初始化參數:　

　　　　antialias:true, //是否開啟反鋸齒 --true/false
　　　　precision:"highp", //著色精度選擇 --highp/mediump/lowp
　　　　alpha:true, //是否可以設置背景色透明 --true/false
　　　　premultipliedAlpha:false, //http://blog.csdn.net/mydreamremindme/article/details/50817294
　　　　stencil:false, //http://blog.csdn.net/a923164250/article/details/40393905
　　　　preserveDrawingBuffer:true, //是否保存繪圖緩沖 --若設為true，則可以提取canvas繪圖的緩沖
　　　　maxLights:1 //maxLights:最大燈光數--num

　　設置渲染大小：renderer.setSize(width,height)

　　追加生成的canvas元素到容器元素中：document.body.appendChild( renderer.domElement );

　　設置canvas背景色(clearColor)和背景色透明度（clearAlpha）：renderer.setClearColor(clearColor,clearAlpha);

　　物體留到下節說

three.js 第二篇:場景 相機 渲染器 物體之間的關系