ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

cesium实现立体雷达扫描效果

2022-03-19 09:03:10  阅读:368  来源: 互联网

标签:扫描 var 立体 Cesium radius positionArr ._ cesium Math


文章目录


Cesium实战系列文章总目录传送门

1.实现效果

在这里插入图片描述

2.实现方法

2.1主要思路

首先,可以将立体雷达扫描拆分为三个部分实现,一是椭球体,二是扇形,三是扇形旋转
(1)椭球体
可以直接通过Cesium的ellipsoid接口实现,这里不过多赘述。
(2)扇形
可以通过wall接口和回调函数设置其高度完成。
(3)扇形旋转
不能直接使用旋转要素方法,这样会沿着扇形底面中点旋转,而非椭球圆心。
可以使用clock.onTick事件监听,在每帧刷新时调用:传送门
在这里插入图片描述

2.2核心代码

将主要代码放到了核心函数raderSolidScan中。
(1)核心函数:

/*
 * @Description: 立体雷达扫描效果(参考开源代码)
 * @Version: 1.0
 * @Author: Julian
 * @Date: 2022-03-05 10:22:01
 * @LastEditors: Julian
 * @LastEditTime: 2022-03-05 15:04:44
 */
function radarSolidScan(options) {
    this._viewer = options.viewer;
    // 半径
    this._radius = options.radius;
    // 扫描扇形颜色
    this._color = options.color;
    // 扫描速度
    this._speed = options.speed;
    // 中心点坐标经纬度
    this._cenLon = options.position[0];
    this._cenLat = options.position[1];

    // 先建立椭球体
    this._viewer.entities.add({
        position: new Cesium.Cartesian3.fromDegrees(this._cenLon, this._cenLat),
        name: "立体雷达扫描",
        ellipsoid: {
            radii: new Cesium.Cartesian3(this._radius, this._radius, this._radius),
            material: this._color,
            outline: true,
            outlineColor: new Cesium.Color(1.0, 1.0, 0.0, 1.0),
            outlineWidth: 1,
        }
    })

    let heading = 0;
    // 每一帧刷新时调用
    this._viewer.clock.onTick.addEventListener(() => {
        heading += this._speed;
        positionArr = calculatePane(113.9236839, 22.528061, 1000.0, heading);
    })

    // 创建1/4圆形立体墙
    let radarWall = this._viewer.entities.add({
        wall: {
            positions: new Cesium.CallbackProperty(() => {
                return Cesium.Cartesian3.fromDegreesArrayHeights(positionArr);
            }, false),
            material: this._color,
        }
    })

    // 计算平面扫描范围
    function calculatePane(x1, y1, radius, heading) {
        var m = Cesium.Transforms.eastNorthUpToFixedFrame(Cesium.Cartesian3.fromDegrees(x1, y1));
        var rx = radius * Math.cos(heading * Math.PI / 180.0);
        var ry = radius * Math.sin(heading * Math.PI / 180.0);
        var translation = Cesium.Cartesian3.fromElements(rx, ry, 0);
        var d = Cesium.Matrix4.multiplyByPoint(m, translation, new Cesium.Cartesian3());
        var c = Cesium.Cartographic.fromCartesian(d);
        var x2 = Cesium.Math.toDegrees(c.longitude);
        var y2 = Cesium.Math.toDegrees(c.latitude);
        return calculateSector(x1, y1, x2, y2);
    }

    // 计算竖直扇形
    function calculateSector(x1, y1, x2, y2) {
        let positionArr = [];
        positionArr.push(x1);
        positionArr.push(y1);
        positionArr.push(0);
        var radius = Cesium.Cartesian3.distance(Cesium.Cartesian3.fromDegrees(x1, y1), Cesium.Cartesian3.fromDegrees(x2, y2));
        // 扇形是1/4圆,因此角度设置为0-90
        for (let i = 0; i <= 90; i++) {
            let h = radius * Math.sin(i * Math.PI / 180.0);
            let r = Math.cos(i * Math.PI / 180.0);
            let x = (x2 - x1) * r + x1;
            let y = (y2 - y1) * r + y1;
            positionArr.push(x);
            positionArr.push(y);
            positionArr.push(h);
        }
        return positionArr;
    }
}

(2)代码调用:

 radarSolidScan({
     viewer: this.viewer,
     position: [113.9236839, 22.528061],
     radius: 1000.0,
     color: new Cesium.Color(1.0, 1.0, 0.0, 0.3),
     speed: 5.0
 })

标签:扫描,var,立体,Cesium,radius,positionArr,._,cesium,Math
来源: https://blog.csdn.net/weixin_45782925/article/details/123294411

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有