[cesium] 绘制雷达扫描

﹏ヽ暗。殇╰゛Y 2021-12-10 11:43 1868阅读 0赞

### 效果 ###

![20200727175443955.gif][]

### 实现 ###

片元着色器

代码

var id = options.id 
    , cartesian = options.position               
    , radius = options.radius
    , color = options.color
    , duration = options.duration, $this = this;
    // 
                        var cartesian3Center = cartesian
                        var cartesian4Center = new Cesium.Cartesian4(
                            cartesian3Center.x,
                            cartesian3Center.y,
                            cartesian3Center.z,
                            1
                        )
                        var position = this.transformCartesianToWGS84(cartesian)
                        var cartesian3Center1 = this.transformWGS84ToCartesian(
                            {
                                lng: position.lng,
                                lat: position.lat,
                                alt: position.alt + 500
                            }
                        )
                        var cartesian4Center1 = new Cesium.Cartesian4(
                            cartesian3Center1.x,
                            cartesian3Center1.y,
                            cartesian3Center1.z,
                            1
                        )
    
                        var cartesian3Center2 = this.transformWGS84ToCartesian(
                            {
                                lng: position.lng + 0.001,
                                lat: position.lat,
                                alt: position.alt
                            }
                        )
                        var cartesian4Center2 = new Cesium.Cartesian4(
                            cartesian3Center2.x,
                            cartesian3Center2.y,
                            cartesian3Center2.z,
                            1
                        )
                        var _time = new Date().getTime()
                        var _RotateQ = new Cesium.Quaternion()
                        var _RotateM = new Cesium.Matrix3()
                        var _scratchCartesian4Center = new Cesium.Cartesian4()
                        var _scratchCartesian4Center1 = new Cesium.Cartesian4()
                        var _scratchCartesian4Center2 = new Cesium.Cartesian4()
                        var _scratchCartesian3Normal = new Cesium.Cartesian3()
                        var _scratchCartesian3Normal1 = new Cesium.Cartesian3()
                        var radarScan = new Cesium.PostProcessStage({
                            name: id,
                            fragmentShader: fs,
                            uniforms: {
                                u_scanCenterEC: function () {
                                    return Cesium.Matrix4.multiplyByVector(
                                        $this._viewer.camera._viewMatrix,
                                        cartesian4Center,
                                        _scratchCartesian4Center
                                    )
                                },
                                u_scanPlaneNormalEC: function () {
                                    var temp = Cesium.Matrix4.multiplyByVector(
                                        $this._viewer.camera._viewMatrix,
                                        cartesian4Center,
                                        _scratchCartesian4Center
                                    )
                                    var temp1 = Cesium.Matrix4.multiplyByVector(
                                        $this._viewer.camera._viewMatrix,
                                        cartesian4Center1,
                                        _scratchCartesian4Center1
                                    )
                                    _scratchCartesian3Normal.x = temp1.x - temp.x
                                    _scratchCartesian3Normal.y = temp1.y - temp.y
                                    _scratchCartesian3Normal.z = temp1.z - temp.z
                                    Cesium.Cartesian3.normalize(
                                        _scratchCartesian3Normal,
                                        _scratchCartesian3Normal
                                    )
                                    return _scratchCartesian3Normal
                                },
    
                                u_scanLineNormalEC: function () {
                                    var temp = Cesium.Matrix4.multiplyByVector(
                                        $this._viewer.camera._viewMatrix,
                                        cartesian4Center,
                                        _scratchCartesian4Center
                                    )
                                    var temp1 = Cesium.Matrix4.multiplyByVector(
                                        $this._viewer.camera._viewMatrix,
                                        cartesian4Center1,
                                        _scratchCartesian4Center1
                                    )
                                    var temp2 = Cesium.Matrix4.multiplyByVector(
                                        $this._viewer.camera._viewMatrix,
                                        cartesian4Center2,
                                        _scratchCartesian4Center2
                                    )
    
                                    _scratchCartesian3Normal.x = temp1.x - temp.x
                                    _scratchCartesian3Normal.y = temp1.y - temp.y
                                    _scratchCartesian3Normal.z = temp1.z - temp.z
    
                                    Cesium.Cartesian3.normalize(
                                        _scratchCartesian3Normal,
                                        _scratchCartesian3Normal
                                    )
    
                                    _scratchCartesian3Normal1.x = temp2.x - temp.x
                                    _scratchCartesian3Normal1.y = temp2.y - temp.y
                                    _scratchCartesian3Normal1.z = temp2.z - temp.z
    
                                    var tempTime =
                                        ((new Date().getTime() - _time) % duration) / duration
                                    Cesium.Quaternion.fromAxisAngle(
                                        _scratchCartesian3Normal,
                                        tempTime * Cesium.Math.PI * 2,
                                        _RotateQ
                                    )
                                    Cesium.Matrix3.fromQuaternion(_RotateQ, _RotateM)
                                    Cesium.Matrix3.multiplyByVector(
                                        _RotateM,
                                        _scratchCartesian3Normal1,
                                        _scratchCartesian3Normal1
                                    )
                                    Cesium.Cartesian3.normalize(
                                        _scratchCartesian3Normal1,
                                        _scratchCartesian3Normal1
                                    )
                                    return _scratchCartesian3Normal1
                                },
                                u_radius: radius,
                                u_scanColor: color
                            }
                        })
    
           this._viewer.scene.postProcessStages.add(radarScan)

[20200727175443955.gif]: /images/20211210/0934a3573dd349d992bf1e9c9eeb8a9b.png