three.js是JavaScript編寫的WebGL第三方庫。提供了很是多的3D顯示功能。Three.js 是一款運行在瀏覽器中的 3D 引擎,你能夠用它建立各類三維場景,包括了攝影機、光影、材質等各類對象。c++
接觸了幾個Three.js 開發的例子,感受功能仍是很強大的。好久以前,也曾雄心勃勃的向學習Opengl ,還專門買了《Opengl 權威指南》第六版, 由於opengl 的擴展庫,以及使用c++ 建立windows 窗口等過程過於複雜,使得本來想好好學習opengl 遇到了不少困難。不過如今機會來了,webGL 使得三維程序能夠很好的在瀏覽器上運行,開發起來與操做系統也沒有太多聯繫。學習起來要容易得多。git
本人業餘開發學習,沒有什麼人指導,徹底野生狀態。初步瞭解了threejs 之後給本身定了一個 學習的計劃。HTML5 + CSS3+ ThreeJS 。我想經過實際程序的學習應該是一個不錯的途徑。github
在網上搜索一番,找到些不錯的資料。羅列一下:web
(1)20個 three.js 案例
http://tutorialzine.com/2013/09/20-impressive-examples-for-learning-webgl-with-three-js/chrome
Find even more impressive WebGL demos here:json
http://www.chromeexperiments.com/tag/webgl/
http://threejs.org/
http://www.mrdoob.com/windows
(2)Examples created by Yomotsu using THREE.js
http://yomotsu.github.io/threejs-examples/瀏覽器
(3)ShowWebGL tomcat
這是一個能夠顯示3D模型的網站,支持的模型格式簡直讓人沒法想一想:webstorm
http://showwebgl.com
obj, ive, 3ds, dae, ply, osg2, osgb, osgt, osgx, osgs, gem, geo, mdl, rgb, lws, dxf, tgz, osgterrain, shp, zae, stl, sta, bvh, ac, flt, ogr, osga, md2, x, json, txp, dw, osgtgz, 3dc, asc, lw, lwo, gdal, bsp, osg
1、開發工具
工欲善其事,必先利器。找到一個不錯的開發工具 webstorm 。 百度一下不少下載地址。
2、學習網站
http://www.hewebgl.com/ 找到這個學習網站,當時還小激動了一下,不過,看完第一部分,就要交學費了。 內心很不爽,不過做爲起步,也推薦你們看看,不過畢竟人家花了很大的精力來寫教程,並且詳細的了得,也很佩服這些個哥們~
3、調試工具
雖然webstorm 也有本身的調試工具,不過網上通常推薦使用 chrome 自帶的調試工具更好,你們這麼推薦,相信不會不錯。試了一下,真不錯~
開發chrome ,按下F12 ,哈哈~ 看看效果。還能夠斷點,google 太偉大了~~
4、選擇一個好的例子程序。 我選擇了 The WebGL earth 。 網址: http://www.chromeexperiments.com/globe
還有不少好的例子程序, (1)20個 three.js 案例 ,你們能夠本身google。
5、 安裝tomcat ,下載代碼文件,放在工程目錄裏面,這個你們都會。下面看看我從本地打開的效果。