1.粒子（也叫精靈）
我們可以使用THREE.Sprite來手工創(chuàng)建粒子炉菲，它需要傳入唯一的參數(shù)材質(zhì)（THREE.SpriteMaterial或THREE.SpriteCanvasMaterial）
THREE.Sprite于THREE.Mesh一樣叠纷，都是THREE.Oject3D的子類握截，所以THREE.Sprite可以使用THREE.Mesh的大部分屬性
使用THREE.Sprite可以很容易創(chuàng)造粒子笛谦，但是創(chuàng)造大量的THREE.Sprite時(shí)，就會(huì)有嚴(yán)重的性能問題，因?yàn)槊總€(gè)THREE.Sprite對(duì)象都需要去管理彼硫，所以這時(shí)候就需要使用THREE.Points了吃溅，我們只需要使用THREE.points對(duì)象溶诞，就能夠?qū)崿F(xiàn)統(tǒng)一管理大量粒子
HTREE.PointsMaterial對(duì)象的所有可設(shè)置的屬性如下：
- color 粒子系統(tǒng)所有粒子的顏色
- map 可以在粒子中應(yīng)用某種材質(zhì)
- size 指定粒子大小，默認(rèn)1
- sizeAnnutation 如果該屬性為false决侈，那么所有粒子都將擁有相同尺寸螺垢，無論距離多遠(yuǎn)，如果為true颜及，粒子大小將取決于攝像機(jī)的遠(yuǎn)近
- vertexColors 一般來說甩苛，THREE.Points中的粒子顏色都是相同的，如果該屬性設(shè)置為THREE.VertexColors俏站，并且?guī)缀误w數(shù)組中的顏色也有值讯蒲，那么會(huì)使用數(shù)組中定義的顏色值，默認(rèn)THREE.NoColors
- opacity 定義粒子不透明底肄扎，默認(rèn)1完全不透明墨林，與transparent，配合使用
- transparent 如果設(shè)置為true犯祠，那么opacity生效
- blending 指定粒子渲染的融合程度
- fog 是否受場(chǎng)景中的霧化效果影響旭等，默認(rèn)true
在webGLRenderer中使用html5畫布
如果我們想要在WebGLRenderer中使用·canvas畫布，可以采用兩種方式衡载，可以使用THREE.PointsMaterial創(chuàng)建THREE.Points對(duì)象搔耕，或者使用THREE.Sprite和THREE.SpriteMaterial的map屬性
使用紋理化粒子
圖像樣式化粒子還可以使用THREE.TextureLoader().load()函數(shù)將圖像加載為THREE.Texture對(duì)象，然后將THREE.Texture分配給材質(zhì)的map屬性
2.幾何體的組合痰娱、合并和外部模型的加載
2-1.幾何體對(duì)象的組合
當(dāng)你創(chuàng)建多個(gè)網(wǎng)格對(duì)象時(shí)弃榨，你可以用THREE.Group將它們放到一個(gè)組中進(jìn)行管理
當(dāng)幾何體被放置在組中的時(shí)候，你可以對(duì)組進(jìn)行旋轉(zhuǎn)梨睁、平移鲸睛。縮放操作坡贺，這樣組里的所有對(duì)象都會(huì)發(fā)生變化
旋轉(zhuǎn)的中心是組的中心點(diǎn)官辈，也可以對(duì)組內(nèi)的某個(gè)對(duì)象單獨(dú)進(jìn)行操作箱舞，但是需要注意的是。所有定位拳亿、旋轉(zhuǎn)晴股、變形都是相對(duì)于父對(duì)象的
2-2.多個(gè)網(wǎng)格合并成一個(gè)網(wǎng)格
組可以管理大量網(wǎng)格，但對(duì)象·特別多的時(shí)候肺魁，性能就會(huì)到達(dá)瓶頸
因此我們可采用網(wǎng)格合并的方式队魏，來提高的性能，但合并后的網(wǎng)格就沒法操作單個(gè)網(wǎng)格進(jìn)行旋轉(zhuǎn)万搔、移動(dòng)操作
我們可以使用mergeBufferGeometries來實(shí)現(xiàn)多個(gè)mesh合并為一個(gè)mesh且可以使用多個(gè)Material
2-3.編碼時(shí)改變幾何體的位置進(jìn)行合并網(wǎng)格
使用applyMatrix4（）進(jìn)行向量矩陣變換胡桨，applyMatrix4()是三維向量Vector的方法
2-4.從外部資源加載幾何體
three.js可以讀取幾種三維文本文件格式，并從中導(dǎo)出幾何體網(wǎng)絡(luò)瞬雹，支持的文件格式如下
| 格式 | 描述 |
|---|---|
| json | three.js自己的json文件格式昧谊，你可以用它來聲明你的幾何體和場(chǎng)景，盡管它不正式酗捌，但是非常方便你去復(fù)用復(fù)雜的場(chǎng)景和幾何體 |
| OBJ或MTL | obj是一種簡(jiǎn)單的三維文件格式呢诬，由WavefrontTechnologies創(chuàng)建，它是使用最廣泛的三維文件格式胖缤，用來定義對(duì)象的幾何體尚镰。MTL文件常同obj文件一起使用，在一個(gè)mtl文件中哪廓，obj文件用來定義對(duì)象的材質(zhì)狗唉，thre.js還有一個(gè)可定制的obj導(dǎo)出器，叫做OBJExporter.js涡真，可以將three.js中的模型導(dǎo)出一個(gè)obj文件中 |
| Collada | Collada是一種用基于xml的格式定義的數(shù)字的內(nèi)容的格式分俯，也是一種被廣泛使用的格式，三維軟件和渲染引擎都支持這種格式 |
| STL | STL是STereoLithphy（立體成型術(shù)）的縮寫哆料，廣泛用于快速成型缸剪。如三維打印機(jī)的模型文件通常是STL文件。thress.js還有一個(gè)可定制的STL導(dǎo)出器东亦，叫做STLExporter.js,可以用來將three.js中的模型導(dǎo)出 |
| CTM | ctm是openCTM的一種文件格式杏节，可以用來壓縮格式存儲(chǔ)三維網(wǎng)格的三角形面 |
| VTK | vtk是由Visualization Toolkit創(chuàng)建一種文件格式，用來指定頂點(diǎn)和面典阵，vyk有兩種格式：二進(jìn)制 |
| AWD | 一種用于三維場(chǎng)景的二進(jìn)制格式奋渔，通常與away3d（away3d是falsh或flex上一個(gè)功能強(qiáng)大且實(shí)時(shí)的3D引擎，具有快速萄喳、高效卒稳、api清楚等優(yōu)點(diǎn)蹋半，但是會(huì)有三角型消失的問題）引擎一起使用他巨，這個(gè)加載程序不支持壓縮的AWD文件 |
| Assimp | Open asset import library（也稱為Assimp）是一種導(dǎo)入各種三維模型格式的標(biāo)準(zhǔn)方法 |
| VRML | VRML（Virtual Reality Modeling Language）是一種基于文本的格式，允許定義三維對(duì)象和世界 |
| Babylon | 一個(gè)三維javascript游戲庫(kù)，它以自己內(nèi)部格式存儲(chǔ)模型 |
| PDB | 由Protein Data bank（蛋白質(zhì)數(shù)據(jù)銀行）創(chuàng)建染突，用于定義蛋白質(zhì)的形狀 |
| PLY | 這種格式的全稱是（Polygon）文件格式捻爷，通常用來保存三維掃描儀的信息 |
| TDS | Autodesk 3DS格式 |
| 3MF | 3MF是3d打印的標(biāo)準(zhǔn)格式 |
| AMF | AMF是另一種3D打印的標(biāo)準(zhǔn)格式 |
| PlayCanvas | PlayCanvas是一款基于WebGL的開源游戲引擎，three.js可以加載基于該引擎的模型并在場(chǎng)景中使用 |
| Draco | Draco格式可以高效的保存幾何體和點(diǎn)云 |
| PEWM | PRWM（Packed Raw WenGL Model）WebGL模型原始數(shù)據(jù)包份企，這是一種專注于高效存儲(chǔ)和解析3D幾何體的模式 |
| GCODE | GCODE是計(jì)算機(jī)程序與3D打印機(jī)和CNC機(jī)器通信的標(biāo)準(zhǔn)模式之一也榄，打印模型時(shí)，計(jì)算機(jī)可以向3D打印機(jī)發(fā)送GCODE命令來控制打印機(jī) |
| NRRD | NRRD是一種存儲(chǔ)體素?cái)?shù)據(jù)的文件格式司志，它可以用于保存CT掃描數(shù)據(jù) |
| SVG | SVG是一種矢量圖形的標(biāo)準(zhǔn)格式甜紫，它可以被three.js加載器加載成Path對(duì)象，該對(duì)象可以被拉伸成3D幾何體骂远，也可以被當(dāng)做2D幾何體來渲染 |
2-4-1.使用JSON保存和加載模型
//保存模型囚霸，將場(chǎng)景中的對(duì)象轉(zhuǎn)換成json
scene.toJSON()
//將內(nèi)容轉(zhuǎn)換成JSON對(duì)象，然后使用ObjectLoader對(duì)象例的方法激才，將對(duì)象轉(zhuǎn)換成three.js可以識(shí)別的模型對(duì)象
let loader = new ObjectLoader()
let obj = loader.parse(json數(shù)據(jù))
2-4-2.引用obj
使用OBJLoader加載OBJ模型
注：three.js模型導(dǎo)入obj404報(bào)錯(cuò),因?yàn)閕is缺少M(fèi)IMI的文件映射
打開IIS拓型，點(diǎn)擊MIME類型，把obj添加進(jìn)去類型直接設(shè)置成text/html就可以了
3.three.js動(dòng)畫
3-1.簡(jiǎn)單動(dòng)畫
通過使用requestAnimationFrame修改物體的屬性來實(shí)現(xiàn)動(dòng)畫
