游戲已經做好，但是博客園不能支持哈，我在我的獨立博客里面加入了這個游戲。
加載時候會黑屏，等待數秒即可，點擊這里體驗試玩：FlappyBird3d游戲試玩
我們知道three.js有幾大件，掌握好這幾個類，那么就算入門了！
場景scene，攝像機camera，渲染器render。光源light、控制control、加載器loader
three.js的寫法由一個套路，基本上是
1.新建場景*
2.攝像機*
3.新建object3d，光源等（添加到場景）※
4.新建渲染器並渲染*（three.js-master\examples\js\renderers）
5.添加控制※(three.js-master\examples\js\controls)
6.游戲循環和動畫※
上面帶*的都是必須的，比較基礎這里不說了。下面說兩個3和5
下面說一下loader，我管他叫加載器，其實我覺得它實際干的是格式轉換的活。
因為three.js本身很難做出復雜的模型，因此復雜的人物模型都依靠加載js格式的3d模型，比如
var loader = new THREE.JSONLoader(); loader.load( "models/skinned/knight.js", function ( geometry, materials ) { createScene( geometry, materials, 0, FLOOR, -300, 60 ) // GUI initGUI(); } );
但是很多3d模型都不是js格式的，所以three.js提供了很多loader，說白了就是轉換工具，把其他3d模型轉換為js格式。目前支持的格式在我看來非常的多，3mf，obj，amf，awd....
在目錄three.js-master\examples\js\loaders里面非常多，同時可以在example里面看到很多示例，很好上手。以obj模型為例，加載obj模型的語法大概是這樣的
var loader = new THREE.OBJLoader( manager ); loader.load( 'obj/male02/male02.obj', function ( object ) { object.traverse( function ( child ) { if ( child instanceof THREE.Mesh ) { child.material.map = texture; } } );
這些代碼在example里面都有，這里不詳細展開了。依我看來，想要做出比較精細的模型，loader的使用是必不可少的，我認為他很重要。
還有一個我認為也十分重要的是control，如果你打開示例，你會發現很多例子都支持拖拽，鼠標移動視角，縮放或者旋轉等等。這些東西如果都用js單獨定義lisenter去實現顯得太麻煩了。
現在controls類來了，你只需要把control引用，然后添加到dom里面就可以了，非常方便。都有哪些control呢？你可以打開(three.js-master\examples\js\controls)很多。
就我個人而言，也是一個初學者，我接觸的control主要有兩個，第一個THREE.OrbitControls，這個很容易實現3d的縮放旋轉（鼠標旋轉，滾輪縮放）
它的用法很簡單，如下：
var controls = new THREE.OrbitControls(camera, renderer.domElement); controls.addEventListener('change', render); //旋轉的中心點 controls.target.set(0, 0, 0); controls.update(); function render() { renderer.render(scene, camera); }
通過上面的代碼，看出這是個繞點旋轉的control，比較簡單實用，遺憾的是不支持平移（鼠標右鍵的平移應該是繞點平移）。問題不大，還有很多其他的control，他們是支持平移的，可以參考，這是一種control類型。
還有一種，第一人稱視角的control，前一種說白了移動的是物體，第一人稱視角移動的是攝像頭。如果你建立一個世界模型，想做一個類似cs的查看方式，你需要的就是移動攝像頭。我首先找到了這個
firstPersonControls，用起來挺簡單的，和前一個差不多，只不過這個視角移動太low了，和cs游戲里面的差距不是一般的大！有興趣的可以去看看，簡單是簡單，效果不好。
然后我找到了PointerLockControls，這個就完全實現了cs游戲的效果了，缺點也是很明顯，貌似只能全屏，就我看到的例子和自己試驗，只能全屏...不過效果真的沒的說！代碼這里不貼了，給個地址吧
https://github.com/mrdoob/three.js/blob/master/examples/misc_controls_pointerlock.html
如果你下載了github代碼，打開這個three.js-master/examples/index.html#misc_controls_pointerlock就是了。
除了上面介紹的幾種control，還有很多，我也沒一一研究，大家可以根據自己的實際需要來用。對於一些簡單的，完全可以自己寫control，並不難！
博客園主頁的webgl，我直接偷懶使用了OrbitControls，沒有自己寫，畢竟自己寫要麻煩些，如果我只想左右旋轉，像這種情況，自己寫的效果要好於使用OrbitControls
end~