sdk4.0/src/Obj/Analysis/ViewShed2/index.js

// ViewShed.js
import glsl from './glsl'
import Event from "../../../Event";
import MouseTip from "../../../MouseTip";
import Tools from "../../../Tools";
import Controller from "../../../Controller";
import Dialog from '../../../BaseDialog';
import { html } from "./_element";
/**
 * @constructor
 * @description 可视域分析(测试中)
 * @param sdk
 * @param {Object} options 选项。
 * @param {Cesium.Cartesian3} options.viewPosition 观测点位置。
 * @param {Cesium.Cartesian3} options.viewPositionEnd 最远观测点位置（如果设置了观测距离，这个属性可以不设置）。
 * @param {Number} options.viewDistance 观测距离（单位`米`）。
 * @param {Number} options.viewHeading 航向角（单位`度`）。
 * @param {Number} options.viewPitch 俯仰角（单位`度`）。
 * @param {Number} options.horizontalViewAngle=90 可视域水平夹角（单位`度`）。
 * @param {Number} options.verticalViewAngle=60 可视域垂直夹角（单位`度`）。
 * @param {String} options.visibleAreaColor=#008000 可视区域颜色（默认值`绿色`）。
 * @param {String} options.invisibleAreaColor=#FF0000 不可视区域颜色（默认值`红色`）。
 */
class ViewShedStage extends Tools {

    constructor(sdk, options = {}, _Dialog = {}) {
        super(sdk, options)

        // if (Object.hasOwn(options.viewPosition, 'lng') && Object.hasOwn(options.viewPosition, 'lat') && Object.hasOwn(options.viewPosition, 'alt')) {
        //     this.error = '请提供观测点位置！'
        //     window.ELEMENT && window.ELEMENT.Message({
        //         message: '请提供观测点位置！',
        //         type: 'warning',
        //         duration: 1500
        //     });
        //     return
        // }

        this.viewer = sdk.viewer;
        this.options = {}
        this.options.viewPosition = options.viewPosition;
        this.options.viewPositionEnd = options.viewPositionEnd;
        this.options.horizontalViewAngle = (options.horizontalViewAngle || options.horizontalViewAngle === 0) ? options.horizontalViewAngle : 90.0;
        this.options.verticalViewAngle = (options.verticalViewAngle || options.verticalViewAngle === 0) ? options.verticalViewAngle : 60.0;
        this.options.visibleAreaColor = options.visibleAreaColor || '#008000';
        this.options.invisibleAreaColor = options.invisibleAreaColor || '#FF0000';
        // this.enabled = (typeof options.enabled === "boolean") ? options.enabled : true;
        // this.softShadows = (typeof options.softShadows === "boolean") ? options.softShadows : true;
        // this.size = options.size || 10240; // 2048
        this.ids = []
        this.Dialog = _Dialog
        this.html = null
        YJ.Analysis.AnalysesResults.push(this)
        ViewShedStage.create(this)
        // ViewShedStage.edit(this)
        // this.update();
    }

    get viewPosition() {
        return this.options.viewPosition
    }

    set viewPosition(v) {
        this.options.viewPosition = v
        this.ids[0] && (this.viewer.entities.getById(this.ids[0]).position = new Cesium.Cartesian3.fromDegrees(v.lng, v.lat, v.alt))
        this.update()
        // let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt)
    }

    get viewPositionEnd() {
        return this.options.viewPositionEnd
    }

    set viewPositionEnd(v) {
        this.options.viewPositionEnd = v
        this.ids[1] && (this.viewer.entities.getById(this.ids[1]).position = new Cesium.Cartesian3.fromDegrees(v.lng, v.lat, v.alt))
        this.update()
        // let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt)
        // this.viewDistance = this.viewPositionEnd ? Cesium.Cartesian3.distance(this.viewPosition, this.viewPositionEnd) : (options.viewDistance || 100.0);
    }

    get horizontalViewAngle() {
        return this.options.horizontalViewAngle
    }

    set horizontalViewAngle(v) {
        this.options.horizontalViewAngle = v
        if (this._DialogObject && this._DialogObject._element && this._DialogObject._element.content) {
            let contentElm = this._DialogObject._element.content
            let e_horizontalViewAngle = contentElm.querySelector("input[name='horizontalViewAngle']")
            e_horizontalViewAngle.value = v
            let rangeNodeActive = contentElm.getElementsByClassName('range-node-active')[0]
            let rangeNodeActiveText = rangeNodeActive.getElementsByClassName('range-node-active-text')[0]
            rangeNodeActiveText.innerHTML = v + '°';
            let rangeProcess = contentElm.getElementsByClassName('range-process')[0]
            rangeProcess.style.width = v / 180 * 100 + '%'
        }
        this.update()
    }

    get visibleAreaColor() {
        return this.options.visibleAreaColor
    }

    set visibleAreaColor(v) {
        this.options.visibleAreaColor = v
        this.update()
    }

    get invisibleAreaColor() {
        return this.options.invisibleAreaColor
    }

    set invisibleAreaColor(v) {
        this.options.invisibleAreaColor = v
        this.update()
    }

    get verticalViewAngle() {
        return this.options.verticalViewAngle
    }

    set verticalViewAngle(v) {
        this.options.verticalViewAngle = v
        this.update()
    }

    get viewDistance() {
        let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt)
        let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt)
        let distance = Cesium.Cartesian3.distance(viewPosition3, viewPositionEnd3)
        return distance
    }

    get viewHeading() {
        let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt)
        let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt)
        let heading = getHeading(viewPosition3, viewPositionEnd3)
        if (this.html) {
            let e_viewHeading = this.html.querySelector("span[name='viewHeading']")
            e_viewHeading.innerHTML = Number(heading.toFixed(8))
        }
        return heading
    }

    get viewPitch() {
        let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt)
        let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt)
        let pitch = getPitch(viewPosition3, viewPositionEnd3)
        if (this.html) {
            let e_viewPitch = this.html.querySelector("span[name='viewPitch']")
            e_viewPitch.innerHTML = Number(pitch.toFixed(8))
        }
        return pitch
    }

    static create(that) {
        let count = 0;
        if (!YJ.Measure.GetMeasureStatus()) {
            that.event = new Event(that.sdk)
            that.tip = new MouseTip('左键选择观测点位置，右键取消', that.sdk)
            YJ.Measure.SetMeasureStatus(true)
            that.event.mouse_left((movement, cartesian) => {
                if (!that.viewPosition) {
                    that.options.viewPosition = that.cartesian3Towgs84(cartesian, that.viewer)
                    that.ids.push(ViewShedStage.create_point(that, cartesian))
                    that.tip.set_text("左键选择最远观测点位置，右键取消")
                }
                count++
                if (count === 2) {
                    that.options.viewPositionEnd = that.cartesian3Towgs84(cartesian, that.viewer)
                    that.ids.push(ViewShedStage.create_point(that, cartesian))
                    end()
                    that.update()
                }
            })
            that.event.mouse_move((movement, cartesian) => {
                that.tip.setPosition(cartesian, movement.endPosition.x, movement.endPosition.y)
            })
            that.event.mouse_right((movement, cartesian) => {
                that.ids.forEach(id => {
                    that.viewer.entities.removeById(id)
                })
                that.ids = []
                end()
            })
            that.event.gesture_pinck_start((movement, cartesian) => {
                let startTime = new Date()
                that.event.gesture_pinck_end(() => {
                    let endTime = new Date()
                    if (endTime - startTime >= 500) {
                        that.ids.forEach(id => {
                            that.viewer.entities.removeById(id)
                        })
                        that.ids = []
                        end()
                    }
                })
            })
        }
        else {
            console.log('上一次测量未结束')
        }

        function end() {
            that.ids.forEach(id => {
                let entity = that.viewer.entities.getById(id)
                entity.show = false
            })
            YJ.Measure.SetMeasureStatus(false)
            that.tip.destroy()
            that.event.destroy()
            that.tip = null
            that.event = null
            if (count === 2) {
                ViewShedStage.edit(that)
            }
        }
    }

    static create_point(that, cartesian) {
        let id = that.randomString()
        let p = that.cartesian3Towgs84(cartesian, that.viewer)
        let params = {
            id: id,
            position: Cesium.Cartesian3.fromDegrees(p.lng, p.lat, p.alt),
            billboard: {
                image: that.getSourceRootPath() + '/img/point.png',
                verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
                disableDepthTestDistance: Number.POSITIVE_INFINITY,
                color: Cesium.Color.WHITE.withAlpha(0.99)
            }
        }
        that.viewer.entities.add(
            new Cesium.Entity(params)
        )
        return id
    }


    add() {
        this.createLightCamera();
        this.createShadowMap();
        this.createPostStage();
        this.drawFrustumOutline();
        this.drawSketch();
    }

    update() {
        this.clear();
        this.add();
    }

    static async edit(that) {
        if (that._DialogObject && that._DialogObject.close) {
            that._DialogObject.close()
            that._DialogObject = null
        }
        that._DialogObject = await new Dialog(that.sdk.viewer._container, {
            title: '可视域分析', left: '180px', top: '100px',
            closeCallBack: () => {
                that.Dialog.closeCallBack && that.Dialog.closeCallBack()
                YJ.Measure.SetMeasureStatus(false)
                that.editevent && that.editevent.destroy()
                that.ControllerObject && that.ControllerObject.destroy()
                that.ids.forEach(id => {
                    that.viewer.entities.removeById(id)
                })
            },
        })
        await that._DialogObject.init()
        that._DialogObject._element.body.className = that._DialogObject._element.body.className + ' view-shed'
        let contentElm = document.createElement('div');
        contentElm.innerHTML = html()
        that._DialogObject.contentAppChild(contentElm)
        let resetBtn = that._DialogObject._element.body.getElementsByClassName('edit')[0];
        resetBtn.addEventListener('click', () => {
            that.nodeEdit()
        })
        that.html = contentElm
        //经度值
        let e_lng = contentElm.querySelector("span[name='lng']")
        e_lng.innerHTML = Number(that.options.viewPosition.lng.toFixed(8))

        //纬度值
        let e_lat = contentElm.querySelector("span[name='lat']")
        e_lat.innerHTML = Number(that.options.viewPosition.lat.toFixed(8))

        //高度值
        let e_alt = contentElm.querySelector("span[name='alt']")
        e_alt.innerHTML = Number(that.options.viewPosition.alt.toFixed(8))

        //偏航角
        let e_viewHeading = contentElm.querySelector("span[name='viewHeading']")
        e_viewHeading.innerHTML = Number(that.viewHeading.toFixed(8))

        //俯仰角
        let e_viewPitch = contentElm.querySelector("span[name='viewPitch']")
        e_viewPitch.innerHTML = Number(that.viewPitch.toFixed(8))

        //视域夹角
        let e_horizontalViewAngle = contentElm.querySelector("input[name='horizontalViewAngle']")
        e_horizontalViewAngle.value = that.options.horizontalViewAngle
        let rangeNodeActive = contentElm.getElementsByClassName('range-node-active')[0]
        let rangeNodeActiveText = rangeNodeActive.getElementsByClassName('range-node-active-text')[0]
        let rangeProcess = contentElm.getElementsByClassName('range-process')[0]
        let percentage = that.horizontalViewAngle / 180 * 100
        rangeNodeActive.style.left = percentage + '%';
        rangeProcess.style.width = percentage + '%'
        rangeNodeActiveText.innerHTML = that.horizontalViewAngle + '°';
        let timeout
        e_horizontalViewAngle.addEventListener('input', () => {
            let percentage = e_horizontalViewAngle.value / 180 * 100
            rangeNodeActive.style.left = percentage + '%';
            rangeProcess.style.width = percentage + '%';
            rangeNodeActiveText.innerHTML = e_horizontalViewAngle.value + '°';
        })
        e_horizontalViewAngle.addEventListener('change', () => {
            clearTimeout(timeout)
            timeout = setTimeout(() => {
                that.horizontalViewAngle = e_horizontalViewAngle.value;
            }, 300);
        });
    }

    clear() {
        YJ.Measure.SetMeasureStatus(false)
        this.tip && this.tip.destroy()
        this.event && this.event.destroy()
        this.tip = null
        this.event = null
        if (this.sketch) {
            this.viewer.entities.removeById(this.sketch.id);
            this.sketch = null;
        }
        if (this.frustumOutline) {
            this.frustumOutline.destroy();
            this.frustumOutline = null;
        }
        if (this.FrustumBottomSurface) {
            this.FrustumBottomSurface.destroy();
            this.FrustumBottomSurface = null;
        }
        if (this.postStage) {
            this.viewer.scene.postProcessStages.remove(this.postStage);
            this.postStage = null;
        }

    }

    destroy() {
        this.clear()
        this.editevent && this.editevent.destroy()
        this.ControllerObject && this.ControllerObject.destroy()
        this.ids.forEach(id => {
            this.viewer.entities.removeById(id)
        })
        YJ.Measure.SetMeasureStatus(false)
    }

    nodeEdit() {
        if (YJ.Measure.GetMeasureStatus()) {
            console.log('上一次测量未结束')
        }
        else {
            this.editevent && this.editevent.destroy()
            this.ids.forEach(id => {
                let entity = this.viewer.entities.getById(id)
                entity.show = true
            })
            let selectPoint
            YJ.Measure.SetMeasureStatus(true)
            // this.tip = new MouseTip('左键选择要操作的观测点，右键取消', this.sdk)
            this.editevent = new Event(this.sdk)
            this.editevent.mouse_left((movement, cartesian) => {
                let pick = this.viewer.scene.pick(movement.position);
                if (pick && pick.id && pick.id.id && this.ids.indexOf(pick.id.id) != -1 && (!selectPoint || selectPoint.id != pick.id.id)) {
                    selectPoint = pick.id
                    // this.event.destroy()
                    // this.tip.destroy()
                    this.viewer.entities.getById(this.ids[0]).position = new Cesium.Cartesian3.fromDegrees(this.viewPosition.lng, this.viewPosition.lat, this.viewPosition.alt)
                    this.viewer.entities.getById(this.ids[1]).position = new Cesium.Cartesian3.fromDegrees(this.viewPositionEnd.lng, this.viewPositionEnd.lat, this.viewPositionEnd.alt)
                    this.viewPosition
                    this.ControllerObject && this.ControllerObject.destroy()
                    console.log(this.cartesian3Towgs84(selectPoint.position._value, this.sdk.viewer))
                    this.ControllerObject = new Controller(this.sdk, { position: { ...this.cartesian3Towgs84(selectPoint.position._value, this.sdk.viewer) } })
                    this.ControllerObject.controllerCallBack = (params, status) => {
                        if (params.position.alt < 0) {
                            params.position.alt = 0
                        }
                        selectPoint.position = new Cesium.Cartesian3.fromDegrees(params.position.lng, params.position.lat, params.position.alt)
                        if (status) {
                            if (this.ids.indexOf(pick.id.id) == 0) {
                                this.viewPosition = params.position
                            }
                            else {
                                this.viewPositionEnd = params.position
                            }
                            YJ.Measure.SetMeasureStatus(true)
                        }
                    }
                    this.ControllerObject.editTranslational()
                }
            })
            this.editevent.mouse_right((movement, cartesian) => {
                YJ.Measure.SetMeasureStatus(false)
                this.editevent && this.editevent.destroy()
                this.ControllerObject && this.ControllerObject.destroy()
                this.ids.forEach(id => {
                    let entity = this.viewer.entities.getById(id)
                    entity.show = false
                })
                selectPoint = null
            })
            this.editevent.mouse_move((movement, cartesian) => {
                // this.tip.setPosition(
                //     cartesian,
                //     movement.endPosition.x,
                //     movement.endPosition.y
                // )
            })

            this.editevent.gesture_pinck_start((movement, cartesian) => {
                let startTime = new Date()
                this.editevent.gesture_pinck_end(() => {
                    let endTime = new Date()
                    if (endTime - startTime >= 500) {
                        YJ.Measure.SetMeasureStatus(false)
                        this.editevent && this.editevent.destroy()
                        this.ControllerObject && this.ControllerObject.destroy()
                        this.ids.forEach(id => {
                            let entity = this.viewer.entities.getById(id)
                            entity.show = false
                        })
                        selectPoint = null
                    }
                })
            })

        }

    }

    createLightCamera() {
        let _this = this
        this.lightCamera = new Cesium.Camera(this.viewer.scene);
        this.lightCamera.position = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt);
        // if (this.viewPositionEnd) {
        //     let direction = Cesium.Cartesian3.normalize(Cesium.Cartesian3.subtract(this.viewPositionEnd, this.viewPosition, new Cesium.Cartesian3()), new Cesium.Cartesian3());
        //     this.lightCamera.direction = direction; // direction是相机面向的方向
        // }
        this.lightCamera.frustum.near = this.viewDistance * 0.001;
        this.lightCamera.frustum.far = this.viewDistance;
        const hr = Cesium.Math.toRadians(this.horizontalViewAngle);
        const vr = Cesium.Math.toRadians(this.verticalViewAngle);
        const aspectRatio =
            (this.viewDistance * Math.tan(hr / 2) * 2) /
            (this.viewDistance * Math.tan(vr / 2) * 2);
        this.lightCamera.frustum.aspectRatio = aspectRatio;
        if (hr > vr) {
            this.lightCamera.frustum.fov = hr;
        } else {
            this.lightCamera.frustum.fov = vr;
        }
        this.lightCamera.setView({
            destination: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt),
            orientation: {
                heading: Cesium.Math.toRadians(this.viewHeading || 0),
                pitch: Cesium.Math.toRadians(this.viewPitch || 0),
                roll: 0
            }
        });
    }

    createShadowMap() {
        this.shadowMap = new Cesium.ShadowMap({
            context: (this.viewer.scene).context,
            lightCamera: this.lightCamera,
            enabled: true,
            isPointLight: true,
            pointLightRadius: this.viewDistance,
            cascadesEnabled: false,
            size: 2048, // 2048
            softShadows: true,
            normalOffset: false,
            fromLightSource: false
        });
        this.viewer.scene.shadowMap = this.shadowMap;
    }

    createPostStage() {
        const fs = glsl
        const postStage = new Cesium.PostProcessStage({
            fragmentShader: fs,
            uniforms: {
                shadowMap_textureCube: () => {
                    this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState"));
                    return Reflect.get(this.shadowMap, "_shadowMapTexture");
                },
                shadowMap_matrix: () => {
                    this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState"));
                    return Reflect.get(this.shadowMap, "_shadowMapMatrix");
                },
                shadowMap_lightPositionEC: () => {
                    this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState"));
                    return Reflect.get(this.shadowMap, "_lightPositionEC");
                },
                shadowMap_normalOffsetScaleDistanceMaxDistanceAndDarkness: () => {
                    this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState"));
                    const bias = this.shadowMap._pointBias;
                    return Cesium.Cartesian4.fromElements(
                        bias.normalOffsetScale,
                        this.shadowMap._distance,
                        this.shadowMap.maximumDistance,
                        0.0,
                        new Cesium.Cartesian4()
                    );
                },
                shadowMap_texelSizeDepthBiasAndNormalShadingSmooth: () => {
                    this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState"));
                    const bias = this.shadowMap._pointBias;
                    const scratchTexelStepSize = new Cesium.Cartesian2();
                    const texelStepSize = scratchTexelStepSize;
                    texelStepSize.x = 1.0 / this.shadowMap._textureSize.x;
                    texelStepSize.y = 1.0 / this.shadowMap._textureSize.y;

                    return Cesium.Cartesian4.fromElements(
                        texelStepSize.x,
                        texelStepSize.y,
                        bias.depthBias,
                        bias.normalShadingSmooth,
                        new Cesium.Cartesian4()
                    );
                },
                camera_projection_matrix: this.lightCamera.frustum.projectionMatrix,
                camera_view_matrix: this.lightCamera.viewMatrix,
                helsing_viewDistance: () => {
                    return this.viewDistance;
                },
                helsing_visibleAreaColor: Cesium.Color.fromCssColorString(this.visibleAreaColor),
                helsing_invisibleAreaColor: Cesium.Color.fromCssColorString(this.invisibleAreaColor),
                shadowMap: this.shadowMap,
                far: () => {
                    return this.viewDistance;
                },
            }
        });
        this.postStage = this.viewer.scene.postProcessStages.add(postStage);
    }

    drawFrustumOutline() {
        const scratchRight = new Cesium.Cartesian3();
        const scratchRotation = new Cesium.Matrix3();
        const scratchOrientation = new Cesium.Quaternion();
        const position = this.lightCamera.positionWC;
        const direction = this.lightCamera.directionWC;
        const up = this.lightCamera.upWC;
        let right = this.lightCamera.rightWC;
        right = Cesium.Cartesian3.negate(right, scratchRight);
        let rotation = scratchRotation;
        Cesium.Matrix3.setColumn(rotation, 0, right, rotation);
        Cesium.Matrix3.setColumn(rotation, 1, up, rotation);
        Cesium.Matrix3.setColumn(rotation, 2, direction, rotation);
        let orientation = Cesium.Quaternion.fromRotationMatrix(rotation, scratchOrientation);

        let instance = new Cesium.GeometryInstance({
            geometry: new Cesium.FrustumOutlineGeometry({
                frustum: this.lightCamera.frustum,
                origin: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt),
                orientation: orientation
            }),
            id: Math.random().toString(36).substr(2),
            attributes: {
                color: Cesium.ColorGeometryInstanceAttribute.fromColor(
                    Cesium.Color.YELLOWGREEN//new Cesium.Color(0.0, 1.0, 0.0, 1.0)
                ),
                show: new Cesium.ShowGeometryInstanceAttribute(true)
            }
        });

        let frustum = this.lightCamera.frustum.clone()
        frustum.near = frustum.far - 100
        let instance2 = new Cesium.GeometryInstance({
            geometry: new Cesium.FrustumGeometry({
                frustum: frustum,
                origin: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt),
                orientation: orientation,
                vertexFormat: Cesium.VertexFormat.POSITION_ONLY,
            }),
            id: Math.random().toString(36).substr(2),
            attributes: {
                color: Cesium.ColorGeometryInstanceAttribute.fromColor(
                    Cesium.Color.YELLOWGREEN//new Cesium.Color(0.0, 1.0, 0.0, 1.0)
                ),
                show: new Cesium.ShowGeometryInstanceAttribute(true)
            }
        });

        this.frustumOutline = this.viewer.scene.primitives.add(
            new Cesium.Primitive({
                geometryInstances: [instance],
                appearance: new Cesium.PerInstanceColorAppearance({
                    flat: true,
                    translucent: false
                })
            })
        );

        const radius = this.viewDistance;
        const angle = this.viewHeading;

        let Ea = 6378137; //   赤道半径
        let Eb = 6356725; // 极半径
        const lng = this.options.viewPosition.lng,
            lat = this.options.viewPosition.lat;
        let positionArr = [];
        let boundaryPoints = [];
        positionArr.push(lng, lat);
        boundaryPoints.push([lng, lat]);
        //正北是0°
        let start = angle + 45 > 360 ? angle - 45 - 360 : angle - 45;
        let end = start + 90;
        for (let i = start; i <= end; i++) {
            let dx = radius * Math.sin((i * Math.PI) / 180.0);
            let dy = radius * Math.cos((i * Math.PI) / 180.0);
            let ec = Eb + ((Ea - Eb) * (90.0 - lat)) / 90.0;
            let ed = ec * Math.cos((lat * Math.PI) / 180);
            let BJD = lng + ((dx / ed) * 180.0) / Math.PI;
            let BWD = lat + ((dy / ec) * 180.0) / Math.PI;
            positionArr.push(BJD, BWD);
        }



        let polygon = new Cesium.PolygonGeometry({
            polygonHierarchy: new Cesium.PolygonHierarchy(
                Cesium.Cartesian3.fromDegreesArray(positionArr)
            ),
            height: 0.0,
            extrudedHeight: 0.0,
            vertexFormat: Cesium.PerInstanceColorAppearance.VERTEX_FORMAT,
            stRotation: 0.0, // 纹理的旋转坐标（以弧度为单位）,正旋转是逆时针方向
            ellipsoid: Cesium.Ellipsoid.WGS84,
            granularity: Cesium.Math.RADIANS_PER_DEGREE, // 每个纬度和经度之间的距离（以弧度为单位）,确定缓冲区中的位置数
            perPositionHeight: false, // 每个位置点使用的高度
            closeTop: true,
            closeBottom: true,
            // NONE 与椭圆表面不符的直线;GEODESIC 遵循测地路径;RHUMB	遵循大黄蜂或恶魔般的道路。
            arcType: Cesium.ArcType.GEODESIC, // 多边形边缘线型
        });
        let polygonInstance = new Cesium.GeometryInstance({
            geometry: polygon,
            name: "ViewershedPolygon",
            attributes: {
                color: Cesium.ColorGeometryInstanceAttribute.fromColor(
                    Cesium.Color.BLUE
                ),
                show: new Cesium.ShowGeometryInstanceAttribute(true), //显示或者隐藏
            },
        });
        // this.FrustumBottomSurface = this.viewer.scene.primitives.add(
        //     new Cesium.GroundPrimitive({
        //         geometryInstances: polygonInstance,
        //         appearance: new Cesium.PerInstanceColorAppearance({
        //             translucent: true, //false时透明度无效
        //             closed: false,
        //         }),
        //     })
        // );
    }

    drawSketch() {
        this.sketch = this.viewer.entities.add({
            name: 'sketch',
            position: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt),
            orientation: Cesium.Transforms.headingPitchRollQuaternion(
                Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt),
                Cesium.HeadingPitchRoll.fromDegrees(this.viewHeading - 90, this.viewPitch, 0.0)
            ),
            ellipsoid: {
                radii: new Cesium.Cartesian3(
                    this.viewDistance,
                    this.viewDistance,
                    this.viewDistance
                ),
                // innerRadii: new Cesium.Cartesian3(2.0, 2.0, 2.0),
                minimumClock: Cesium.Math.toRadians(-this.horizontalViewAngle / 2),
                maximumClock: Cesium.Math.toRadians(this.horizontalViewAngle / 2),
                minimumCone: Cesium.Math.toRadians(this.verticalViewAngle + 7.75),
                maximumCone: Cesium.Math.toRadians(180 - this.verticalViewAngle - 7.75),
                fill: false,
                outline: true,
                subdivisions: 256,
                stackPartitions: 64,
                slicePartitions: 64,
                outlineColor: Cesium.Color.YELLOWGREEN
            }
        });
    }

}

function getHeading(fromPosition, toPosition) {
    let finalPosition = new Cesium.Cartesian3();
    let matrix4 = Cesium.Transforms.eastNorthUpToFixedFrame(fromPosition);
    Cesium.Matrix4.inverse(matrix4, matrix4);
    Cesium.Matrix4.multiplyByPoint(matrix4, toPosition, finalPosition);
    Cesium.Cartesian3.normalize(finalPosition, finalPosition);
    return Cesium.Math.toDegrees(Math.atan2(finalPosition.x, finalPosition.y));
}

function getPitch(fromPosition, toPosition) {
    let finalPosition = new Cesium.Cartesian3();
    let matrix4 = Cesium.Transforms.eastNorthUpToFixedFrame(fromPosition);
    Cesium.Matrix4.inverse(matrix4, matrix4);
    Cesium.Matrix4.multiplyByPoint(matrix4, toPosition, finalPosition);
    Cesium.Cartesian3.normalize(finalPosition, finalPosition);
    return Cesium.Math.toDegrees(Math.asin(finalPosition.z));
}

export default ViewShedStage;