簡介
1 .用來模擬難以重現(xiàn)的現(xiàn)象，例如火，煙，水，或者抽象的視覺效果，例如魔術(shù)閃光和仙塵
2 .實質(zhì)就是從一個區(qū)域發(fā)射非常多的粒子云來完成
3 .停止粒子系統(tǒng)將阻止創(chuàng)建新的粒子，但是現(xiàn)有粒子將繼續(xù)，如果要將系統(tǒng)重置為空狀態(tài)，還必須particleSystem.reset()
4 .
預先開啟
1 .可以提前渲染，以便讓我們在需要讓他顯示的時候第一時間出現(xiàn)
2 .system.preWarmCycles:在首次渲染前必須執(zhí)行多少周期。默認是0，沒有預熱
3 .system.preWarmStepOffset:指示在預熱模式下使用的時間步長倍數(shù)。
4 .
粒子紋理
1 .可以將紋理應(yīng)用于粒子
2 .要在場景中使用多個紋理,需要使用多個粒子系統(tǒng)
3 .
粒子發(fā)射器
1 .vector3定位發(fā)射器
2 .網(wǎng)格定位發(fā)射器
1 .如果發(fā)射器是網(wǎng)格的話，并且particleSystem.isLocal=true
2 .那么所有的粒子都將生成到網(wǎng)格局部空間中去
3 .
世界偏移
1 .particleSystem.worldOffset = new BABYLON.Vector3(100, 20, -453);
2 .這個可以用來為粒子設(shè)置世界偏移
3 .
位置
1 .發(fā)射器的粒子散布在一個盒子內(nèi)進行，該盒子的大小是通過設(shè)置下左前角和上右后角來確定的
2 .也可以是一個軸方向上折疊為一條線
3 .
微調(diào)粒子系統(tǒng)
1 .粒子生命周期:在給定范圍內(nèi)隨機生成
2 .粒子大小:在給定范圍內(nèi)隨機變化
1 .如果想要將徑粒改為非正方形，使用minScaleX，minScaleY來定義
2 .默認縮放是從粒子的中心開始的，如果需要從頂部或者底部改變縮放比例，調(diào)用 particleSystem.translationPivot = new BABYLON.Vector2(0, -0.5)
3 .粒子顏色
1 .兩種在粒子的生命周期內(nèi)進行混合
2 .第三種在粒子消失之前呈現(xiàn)
3 .定義顏色漸變
4 .顏色混合：這個有點看不懂
5 .粒子發(fā)射速度
1 .emitRate 確定每秒發(fā)射的粒子數(shù)量，數(shù)值越大，發(fā)出的粒子云越密集
2 .當粒子死亡時，他們被循環(huán)在排放，如果設(shè)置的存活時間足夠長，發(fā)射速度很快，總數(shù)設(shè)置的發(fā)射完了，這個時候粒子發(fā)射可能會出現(xiàn)空隙
6 .方向
1 .可以指定兩個方向，如果僅指定一個方向，則粒子將沿著給定的大致方向隨機傳播
2 .當給出兩個方向時，粒子通常會在兩個方向內(nèi)進行
3 .particleSystem.direction2 = new BABYLON.Vector3(7, 8, -3)
7 .重力
1 .可以使用重力值，如果在Y方向上為負，則粒子會做自由落體運動
2 .particleSystem.gravity = new BABYLON.Vector3(0, -9.81, 0);
8 .回轉(zhuǎn)
1 .定義粒子圍繞z軸的粒子角速度范圍
2 .這個怎么調(diào)他的參數(shù)也是沒發(fā)現(xiàn)有啥變化。。。這個參數(shù)到底是干啥的，看翻譯到是能理解，就是跟理解的實際效果不一樣
9 .粒子系統(tǒng)運動的時間量
1 .particleSystem.targetStopDuration = 5;
10 .速度
1 .發(fā)射出粒子的速度
particleSystem.minEmitPower = 1;
particleSystem.maxEmitPower = 3;
速度大小范圍
particleSystem.updateSpeed = 0.005;
//整體更新速度，更新速度越快，動畫速度越快
//這倆屬性使用一個就可以了
2 .隨時間變化的速度:使用梯度定義了隨時間變化的速度
particleSystem.addVelocityGradient(0, 3, 5);
particleSystem.addVelocityGradient(1.0, -5, -10);
//注意這里是負值，也即是速度在最后會變成復制，有一個回彈效果
particleSystem.addVelocityGradient(0, 0.5, 0.8);
//可以為每隔梯度提供兩個
particleSystem.removeVelocityGradient(0.5)
//刪除漸變
3 .隨時間限制速度:使用梯度定義隨時間變化的速度極限，此限制將用于檢測粒子的當前速度，如果達到該限制，將會減速
particleSystem.addLimitVelocityGradient(1.0, 3, 4);
particleSystem.removeLimitVelocityGradient(0.5)
//刪除漸變
11 .阻力系數(shù)
1 .可以使用漸變定義隨時間變化的拖動因子。通過將阻力因子應(yīng)用于粒子方向，可以模擬空氣摩擦
2 .particleSystem.addDragGradient(0, 0.5)
3 .定義漸變的阻力
particleSystem.addDragGradient(0, 0.5, 0.8);
4 .刪除漸變
particleSystem.removeDragGradient(0.5)
12 .發(fā)射率隨時間變化
1 .使用漸變定義粒子的發(fā)射速率，隨著時間的推移，system.emitRate屬性值將被覆蓋
2 .particleSystem.addEmitRateGradient(1.0, 800, 1000);
3 .發(fā)射速率梯度僅在系統(tǒng)具有確定的使用壽命時才起作用，這意味著您必須定義system.targetStopDuration屬性
4 .particleSystem.removeEmitRateGradient(0.5) 刪除漸變
13 .隨著時間推移開始大小
1 .起始大小漸變僅在系統(tǒng)具有確定的使用壽命時才起作用，這意味著您必須定義system.targetStopDuration屬性
2 .particleSystem.addStartSizeGradient(0, 5, 10);
3 .刪除漸變particleSystem.removeStartSizeGradient(0.5)。
14 .alpha 漸變，這個功能很強大，但是現(xiàn)在好像看不懂
15 .對準
形狀發(fā)射器
1 .點發(fā)射器
var light0 = new BABYLON.PointLight("omni", new BABYLON.Vector3(-20, 30, 10), scene);
var camera = new BABYLON.ArcRotateCamera("ArcRotateCamera", 1, 1.25, 50, new BABYLON.Vector3(0, 0, 0), scene);
camera.attachControl(canvas, true);
var particleSystem=new BABYLON.ParticleSystem('particles',2000,scene)
particleSystem.particleTexture=new BABYLON.Texture('https://www.babylonjs-playground.com/textures/flare.png')
particleSystem.color1 = new BABYLON.Color4(0.7, 0.8, 1.0, 1.0);
particleSystem.color2 = new BABYLON.Color4(0.2, 0.5, 1.0, 1.0);
particleSystem.colorDead = new BABYLON.Color4(0, 0, 0.2, 0.0);
particleSystem.emitRate = 1000;
particleSystem.minSize = 0.1;
particleSystem.maxSize = 0.5;
particleSystem.minLifeTime = 0.3;
particleSystem.maxLifeTime = 1.5;
particleSystem.addVelocityGradient(0, 3, 5);
particleSystem.addVelocityGradient(1.0, -5, -10);
// particleSystem.createPointEmitter(new BABYLON.Vector3(-7,8,3),new BABYLON.Vector3(7,8,-3))
// 點狀發(fā)射器
// 箱式發(fā)射器
// particleSystem.createBoxEmitter(new BABYLON.Vector3(-7,8,3),new BABYLON.Vector3(7,8,-3),new BABYLON.Vector3(-1, 0, 0), new BABYLON.Vector3(1, 0, 0))
// var box=new BABYLON.MeshBuilder.CreateBox("box",{width:2,height:4,depth:5},scene)
// box.material=new BABYLON.StandardMaterial('mat',scene)
// box.material.wireframe=true
// 球形發(fā)射器
// var sphereEmitter=particleSystem.createSphereEmitter(15)
// sphereEmitter.radiusRange=0
// sphereEmitter.radius=15
// var sphere = BABYLON.MeshBuilder.CreateSphere("sphere", {diameter:4, segments: 8}, scene);
// sphere.material = new BABYLON.StandardMaterial("mat", scene);
// sphere.material.wireframe = true;
// 粒子沿著表面法線發(fā)射
// 具有方向的球形發(fā)射器
// var sphereEmitter=particleSystem.createDirectedSphereEmitter(2, new BABYLON.Vector3(-0.5, 1, -0.5), new BABYLON.Vector3(0.5, 1, 0.5));
// 半球發(fā)射器
// var hemisphericEmitter=particleSystem.createHemisphericEmitter(1.2)
// hemisphericEmitter.radiusRange=0;
// 圓柱體發(fā)射器
// 從圓柱體向外表面法線方向發(fā)射
// var yuanzhu=particleSystem.createCylinderEmitter(1,1,1,0)
// 半徑，高度,
// 沿半徑應(yīng)發(fā)射粒子的位置
// 隨機粒子方向的大小
// 有方向的圓柱發(fā)射器
// particleSystem.particleEmitterType = new BABYLON.CylinderDirectedParticleEmitter(1,1,1, new BABYLON.Vector3(1,0,0),new BABYLON.Vector3(1,0,0))
// 錐形發(fā)射器
// var radius = 2;
// var angle = Math.PI / 3;
// var height = radius / Math.tan(angle / 2);
// var cone = BABYLON.MeshBuilder.CreateCylinder("cone", {diameterBottom:0, diameterTop: 2 * radius, height: height}, scene);
// cone.position.y = height / 2;
// cone.material = new BABYLON.StandardMaterial("mat", scene);
// cone.material.wireframe = true;
// var coneEmitter = particleSystem.createConeEmitter(radius,angle)
// 半徑
// 弧度
// coneEmitter.radiusRange=1
// coneEmitter.heightRange=1
// 網(wǎng)格發(fā)射器
// 從網(wǎng)格表面發(fā)射粒子，粒子的方向?qū)⑹蔷W(wǎng)格表面的法線
// var box=BABYLON.MeshBuilder.CreateBox({width:100,height:100,depth:100},scene)
// var meshEmitter = new BABYLON.MeshParticleEmitter(box)
// meshEmitter.useMeshNormalsForDirection = false;
// // 關(guān)閉默認設(shè)置，自定義方向
// meshEmitter.direction1 = new BABYLON.Vector3(0, 1, 0);
// meshEmitter.direction2 = new BABYLON.Vector3(0, -1, 0);
// 自定義發(fā)射器
//
var customEmitter = new BABYLON.CustomParticleEmitter();
let id = 0;
customEmitter.particlePositionGenerator = (index, particle, out) => {
out.x = Math.cos(id) * 5;
out.y = Math.sin(id) * 5;
out.z = 1;
id += 0.01;
// 每一秒點的位置,從這個點發(fā)射出粒子
}
customEmitter.particleDestinationGenerator = (index, particle, out) => {
out.x = Math.cos(id);
out.y = 10;
out.z = 10;
// 注意是對應(yīng)上面每個粒子的最終位置
}
// 自定義需要申明一下發(fā)射
particleSystem.particleEmitterType=customEmitter
// particleSystem.minEmitPower=1
// particleSystem.maxEmitPower=3;
// particleSystem.updateSpeed=0.005
particleSystem.minSize=0.1
particleSystem.maxSize=0.3
// particleSystem.minLifeTime = 0.3;
particleSystem.maxLifeTime = 15;
particleSystem.start()
噪聲紋理
1 .噪波紋理“擾動”粒子的位置,改變粒子的方向，實現(xiàn)更加隨機的運動方式
2 .brightness:0-1最關(guān)鍵的參數(shù)，0-0.5，現(xiàn)在運動的反方向，0.5，不施加運動，0.5-1，規(guī)定運動的正方向
1 .上面的理解好像不對，需要查下api
2 .octaves:
3 .persistence:
3 .speed:影響的速度，值越大，發(fā)射粒子的速度越快
4 .noise strength.x,y,z:定義干擾的方向
5 .
GPU粒子
1 .可以使用GPU粒子，通過webGL2,你可以生成的粒子數(shù)量級別是幾千萬個,通常的是幾十萬
2 .GPU粒子不支持的地方
1 .不支持子發(fā)射器
2 .不支持自定義效果
3 .每隔梯度只有兩個值,不能隨機范圍內(nèi)選擇值
4 .不支持發(fā)射率梯度
5 .不支持起始尺寸漸變
6 .不支持網(wǎng)格發(fā)射器
