cesium粒子系统-火灾模拟

网上有很多教程,但是基本都是写了一半,某些代码丢失,对于初学者来说无法改出效果。因此经各人成功试验后精简了代码,方便初学者理解。

实现思路:

1 火灾得有一个发生地,那么 可以理解为粒子系统的发射源。故而我们首先应该定义一个发射源实体。

//粒子系统的起点,发射源
var staticPosition = Cesium.Cartesian3.fromDegrees(116.34516786934411,39.99753297677145,3.614538127977399);
var entity44 = viewer.entities.add({
    position : staticPosition
});

第二步:发射源已经有了,那么我们需要用cesium的粒子系统来将火星发射出来,那么这里面就涉及到很多问题。

火的颜色,火蔓延的快慢,火蔓延的方向,等等一系列属性,cesium给我们提供了很多属性。

可以看出粒子系统其实和其他的模型什么的没有任何区别,都是以primitive方式添加进入场景。

那么下面一步步解读需要的参数

viewer.scene.primitives.add(new Cesium.ParticleSystem({
    image : './Apps/SampleData/fire.png',
    startColor : Cesium.Color.RED.withAlpha(0.7),
    endColor : Cesium.Color.YELLOW.withAlpha(0.3),
    startScale : 0,
    endScale : 10,
//设定粒子寿命可能持续时间的最小限值(以秒为单位),在此限值之上将随机选择粒子的实际寿命。
    minimumParticleLife : 1,
    maximumParticleLife : 6,
    minimumSpeed :1,
    maximumSpeed : 4,
    imageSize : new Cesium.Cartesian2(55, 55),
    // Particles per second.
    emissionRate : 4,
    lifetime : 160.0,
//cesium内置的发射器,圆形发射器,因此参数是一个半径值
//还有锥形发射器,new Cesium.ConeEmitter(Cesium.Math.toRadians(45.0))
//长方形发射器,new Cesium.BoxEmitter(new Cesium.Cartesian3(1.0, 1.0, 1.0))
//半球发射器,new Cesium.SphereEmitter(0.5)
    emitter : new Cesium.CircleEmitter(5.0),
//将粒子系统从模型转换为世界坐标的4x4变换矩阵
    modelMatrix : computeModelMatrix(entity44),
//在粒子系统局部坐标系中变换粒子系统发射器的4x4变换矩阵。
    emitterModelMatrix : computeEmitterModelMatrix()

}));

再来看看这两个关键的转换函数到底是什么东西呢,不想去研究了,就是cesium提供给我们的一个接口。其实感觉不应该有这个接口的,entity已经是世界坐标的了,这根本没有传入任何有用的信息。如果以我理解,还是理解为粒子系统的发射源位置设置吧。其实应该封装为entity就可以了

function computeModelMatrix(entity) {
    var position = Cesium.Property.getValueOrUndefined(entity.position);
    let modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(position);
    return modelMatrix;
}

//这个相对容易理解一些,其实就是粒子散播的形态,其实状态,翻转角度等等

function computeEmitterModelMatrix() {
   let  hpr = Cesium.HeadingPitchRoll.fromDegrees(0, 0, 0);
    let trs = new Cesium.TranslationRotationScale();
    trs.translation = Cesium.Cartesian3.fromElements(2.5,4, 1);
    trs.rotation = Cesium.Quaternion.fromHeadingPitchRoll(hpr);
    let result=Cesium.Matrix4.fromTranslationRotationScale(trs);
    return result
}

可以看到很多文章采用了viewmodel的形式,实际上就是将这些参数统一管理了。

最后上一张效果图吧

猜你喜欢

转载自blog.csdn.net/A873054267/article/details/86251663