Cesium 淹沒分析

用Cesium做淹沒分析原理其實很簡單,就是給viewer的entities加一個polygon然後通過設置extrudeHeight(拉伸高度)來實現。

網上看了很多帖子都是通過直接設置extrudeHeight來實現,如下面代碼中方式2,但是發現了一個問題,就是每次設置高度都會閃爍一下。最後通過查閱文檔發現一個特別好的方式就是通過Cesium.CallbackProperty這個屬性回調函數來設置高度,完美實現。

廢話不多,直接上代碼:

 drawWater(targetHeight, adapCoordi,waterHeight) {   //targetHeight 目標高度   adapCoordi 範圍座標[109.2039, 35.6042, 0, 109.2774 ,35.6025, 0,109.2766,35.5738, 0]   waterHeight  當前水高度
                let _data = this.insData();
                var entities = _data.viewer.entities;
                //方式1
                let entity = entities.add({
                    polygon : {
                        hierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(adapCoordi)),
                        perPositionHeight: true,
                        extrudedHeight: new Cesium.CallbackProperty(function () {  //此處用屬性回調函數,直接設置extrudedHeight會導致閃爍。
                            waterHeight+=3;
                         if(waterHeight>targetHeight){
                             waterHeight=targetHeight;//給個最大值
                         }
                         return waterHeight
                             },false),
                        material : new Cesium.Color.fromBytes(0,191,255,100),
                    }
                });
                //方式2  此方式會出現閃爍
//                let entity = entities.add({
//                    polygon : {
//                    hierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(adapCoordi)),
//                        perPositionHeight: true,
//                        extrudedHeight: waterHeight,
//                        material : new Cesium.Color.fromBytes(0,191,255,100),
//                }
//            });
//                this.timer = setInterval(() => {
//                    let incre = 3;
//                    if (waterHeight < targetHeight) {
//                        waterHeight += incre;
////                        let tempEntity = entities.add({
////                            polygon : {
////                                hierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(adapCoordi)),
////                                perPositionHeight: true,
////                                extrudedHeight: waterHeight,
////                                material : new Cesium.Color.fromBytes(0,191,255,50)
////                            }
////                        });
//                    if (waterHeight > targetHeight) {
//                        waterHeight = targetHeight
//                    }
//                    entity.polygon.extrudedHeight.setValue(waterHeight)
//                    }
//                }, 250)

            },

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章