Cesium倾斜相机视角观察物体

news2024/11/23 21:34:01

先看效果:
在这里插入图片描述
在cesium中,我们有时需要倾斜相机视角去观察物体,如相机俯视45观察物体。
cesium的api提供了倾斜相机视角的配置,但是直接使用cesium的api不能达到我们想要的效果。
函数如下:

function flyToBox() {
  let longitude = -114;
  let latitude = 40;
  let pitch = -45;
  let height = 4000;

  // 创建一个蓝色盒子
  const blueBox = viewer.entities.add({
    name: "Blue box",
    position: Cesium.Cartesian3.fromDegrees(longitude, latitude, height / 2),
    box: {
      dimensions: new Cesium.Cartesian3(1000.0, 1000.0, 1000.0),
      material: Cesium.Color.BLUE,
    },
  });
  
  let center = Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
  // 相机飞行到指定位置
  viewer.camera.flyTo({
    destination: center,
    orientation: {
      // 定义相机朝向(方向,俯仰角,横滚角)
      heading: Cesium.Math.toRadians(360),
      pitch: Cesium.Math.toRadians(pitch),
      roll: Cesium.Math.toRadians(0),
    },
    duration: 2,
  });
}

效果如下在这里插入图片描述
可以看到物体已经不在视口范围内了。
why?
原因很简单,我们看到了视野都是相机的视野。
cesium相机默认的角度(picth=-90)如下:
在这里插入图片描述
在这里插入图片描述

当配置了orientation,将相机偏移了-45度,因此物体超出了相机的视野,我们也就看不到物体了。
在这里插入图片描述

想要看到物体也很简单,将相机平移x距离即可。回忆一下高中的知识,在直角三角形中,已知了一个角α和边h,可以求x。即:

x = tanα * h

接下来又是另一个难题。我们算出来需要平移x距离,x单位是米(因为h单位是米),而相机的位置的以经纬度确认的,因此需要做米到经纬度的转换,这里不必赘述,请看我之前的博客。完整代码如下:

function flyToBox() {
  let longitude = -114;
  let latitude = 40;
  let pitch = -45;
  let height = 4000;

  // 创建一个蓝色盒子
  const blueBox = viewer.entities.add({
    name: "Blue box",
    position: Cesium.Cartesian3.fromDegrees(longitude, latitude, 0),
    box: {
      dimensions: new Cesium.Cartesian3(1000.0, 1000.0, 1000.0),
      material: Cesium.Color.BLUE,
    },
  });

  // 计算相机的偏移量
  let offset = tan(90 + pitch) * height * 1;
  // 向南偏移,计算新的经纬度
  let { latitude: newLat, longitude: newLon } = offsetToLatLon(
    latitude,
    longitude,
    0,
    offset
  );
  let center = Cesium.Cartesian3.fromDegrees(newLon, newLat, height);
  //   let center = Cesium.Cartesian3.fromDegrees(longitude, latitude, height);

  // 相机飞行到指定位置
  viewer.camera.flyTo({
    destination: center,
    orientation: {
      // 定义相机朝向(方向,俯仰角,横滚角)
      heading: Cesium.Math.toRadians(360),
      pitch: Cesium.Math.toRadians(pitch),
      roll: Cesium.Math.toRadians(0),
    },
    duration: 2,
  });
}

/**
 * 计算给定角度的正切值
 * 
 * @param {number} degrees 输入的角度值
 * @returns {number} 返回计算得到的正切值
 */
function tan(degrees) {
  // 将角度转换为弧度
  const angleInRadians = degrees * (Math.PI / 180);
  return Math.tan(angleInRadians);
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2046179.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

XSS反射性

目录 1.URL 编码 "javascript:alert(1)" 2.HTML字符实体编码 &#;"javascript" 和 URL 编码 "alert(2)" 3.URL 编码 ":" 就是%3a 4.HTML字符实体编码 < 和 > 5.HTML字符实体编码 < 和 > 6.<s…

UGUI合批个人学习心得

从目前学到的知识上看&#xff0c;合批就是最基础的条件就是需要贴图和材质相同&#xff0c;这两个一样才有可能合批&#xff0c;UGUI合批是以Canvas为单位的。 UGUI的合批就是把某个Canvas下满足合批规则的UI控件的网格合并为一个大的网格&#xff0c;然后将这些网格合并在一起…

MyBatis首篇-入门第一文

目录 MyBatis关键特性和概念使用步骤简单示例 核心组件主要特点常见使用情景常见优化策略 MyBatis MyBatis是一个优秀的半自动化持久层框架&#xff0c;它支持定制化SQL、存储过程以及高级映射。MyBatis避免了大部分JDBC代码和手动设置参数以及获取结果集的繁琐性。用户只需要…

机器学习/深度学习——模型的欠拟合和过拟合,正则化方法详解

机器学习/深度学习——模型的欠拟合和过拟合&#xff0c;正则化方法 详解 搭配以下文章进行学习&#xff1a; 卷积神经网络&#xff1a; 深度学习——卷积神经网络&#xff08;convolutional neural network&#xff09;CNN详解&#xff08;一&#xff09;——概述. 步骤清晰…

WHD温湿度控制器:智能守护,让电力设备远离“温湿”困扰,安全运行每一刻

​在电力系统的庞大网络中&#xff0c;中高压开关柜、端子箱、环网柜及箱变等关键设备&#xff0c;其稳定运行直接关系到电力供应的安全与效率。WHD系列温湿度控制器以智能化、精准化的温湿管理方案&#xff0c;为电力设备筑起了一道坚不可摧的安全防线。 WHD系列温湿度控制器搭…

【Spring Boot】全局异常处理

目录 背景 前言 设计步骤 1.定义异常信息类&#xff1a; 2.自定义异常&#xff1a; 3.创建全局异常处理类 4.在控制器中抛出异常 5.输出 捕获 Valid 校验异常 背景 去面试的时候被问到SpringBoot项目中&#xff0c;如何处理全局异常的&#xff0c;也就是如何捕获全局异…

软件包管理器以及NFS

一.YUM 1.1 YUM介绍 学习YUM 软件仓库&#xff0c;可以完成安装、卸载、自动升级 rpm 软件包等任务&#xff0c;能够自动 查找并解决 rpm 包之间的依赖关系&#xff0c;而无须管理员逐个、手工地去安装每个 rpm 包&#xff0c;使管 理员在维护大量 Linux 服务 器时更加轻松自…

MS Visual Studio使用ACLLib库

目录 前言 二、MS Visual Studio使用ACLLib库 1.拿到库文件 2.新建VS项目 1&#xff09;打开VS Studio 2&#xff09;新建Windos 桌面向导文件 3&#xff09;创建 4&#xff09;选择空项目 5&#xff09; 新建main.c文件 3.将得到的acllib.c 与 acllib.h文件复制到项目…

HNU-2024计算机系统-小班讨论6

写在前面&#xff1a; 本次讨论课的选题主要围绕着程序性能优化章节中的分支预测部分&#xff0c;我个人感觉这板块是CSAPP教材中最不好理解的部分&#xff0c;需要大家多看教材&#xff0c;多讨论分析。 本文所有题目由全组同学共同完成&#xff0c;感谢每一位同学的支持与付…

【C++】序列与关联容器(二)序列容器

【C】序列与关联容器&#xff08;二&#xff09;序列容器 一、C 标准库中的序列容器模板二、array 容器模板三、vector元素模板 一、C 标准库中的序列容器模板 每种容器的实现方法的难易不同&#xff0c;特性不同&#xff0c;适用的应用场景不同 array &#xff1a;元素个数固…

11.4.软件系统分析与设计-算法的分析与设计

算法的分析与设计 涉及到的考点&#xff1a; C语言数据结构(树、链表)–考的不多时间复杂度和空间复杂度的计算排序算法四大经典算法 程序设计语言的基本成分 数据成分&#xff1a;指一种程序设计语言的数据和数据类型。数据分为常量&#xff08;程序运行时不可改变&#x…

让IP实现https访问的方法

IP SSL证书是主要保护公网ip地址的一种专属信任SSL证书&#xff0c;相比而言IP SSL证书体现的定位很明确。 IP SSL证书是一种数字证书&#xff0c;用于保护网络服务器和网络浏览器之间的通信。它是由受信任的证书颁发机构(CA)颁发的安全套接字层(SSL)证书。证书用于验证服务器…

day 26网络编程—协议

1、协议&#xff1a;通信双方约定的一套标准 2、国际网络通信协议标准&#xff1a; 1.OSI协议&#xff1a; 应用层 发送的数据内容 表示层 数据是否加密 会话层 是否建立会话连接 传输层 数据传输的…

丑数的计算

丑数 就是只包含质因数 2、3 和 5 的正整数。 给你一个整数 n &#xff0c;请你判断 n 是否为 丑数 。如果是&#xff0c;返回 true &#xff1b;否则&#xff0c;返回 false 。 示例 1&#xff1a; 输入&#xff1a;n 6 输出&#xff1a;true 解释&#xff1a;6 2 3 示…

Linux---DHCP和FTP(原理+实操)

文章目录 DHCP和FTP&#xff08;原理实操&#xff09;DHCP使用DHCP&#xff08;自动分配IP&#xff09;的好处分配方式租约过程第一次重新登录更新租约DHCP服务可分配的地址信息主要包括 DHCP安装和配置实验目的实验环境:网络环境:系统环境:具体操作实操注意一、将三台虚拟机网…

数据结构——排序(4):归并排序+计数排序

目录 一、归并排序 &#xff08;1&#xff09;思想 &#xff08;2&#xff09;过程图示 &#xff08;3&#xff09;代码实现 (4) 代码解释 &#xff08;5&#xff09;复杂度 二、非比较排序&#xff08;计数排序&#xff09; &#xff08;1&#xff09;操作步骤 &#x…

《新一代数据可视化分析工具应用指南》正式开放下载

2024年8月12日&#xff0c;由DataEase开源项目组编写的《新一代数据可视化分析工具应用指南》白皮书正式面向广大用户开放下载。 《新一代数据可视化分析工具应用指南》是DataEase开源项目组为了支持企业落地并推广BI工具、推进企业数据可视化建设而编著的指导手册。通过本白皮…

【生成式人工智能-十二-影像生成原理】

文字生成影像的原理 影像生成的应用影像 是怎么生成的图片生成图片&#xff1a;影像生成影像文字生成图片按照文字AT的方式生成NAT 文字生成视频 怎么评价影像生成的好坏引入CLIP模型文字生成图片的难点文字生成视频的难点解决办法减少attention数目分迭代生成 前段时间sora生成…

前端字体没有授权,字体版权检测(是否为方正字体)

1.截图系统中的首页和登录页面&#xff0c;主要是有字体的地方 2.在线字体版权检测地址&#xff1a;字体版权自动检测-求字体网 3.上传照片&#xff0c;开始对图片进行检测&#xff0c;每个账号有三次免费次数 4.检测完&#xff0c;直接查看检测报告即可&#xff0c; 报告中…

[Spring] Spring事务与事务的传播

&#x1f338;个人主页:https://blog.csdn.net/2301_80050796?spm1000.2115.3001.5343 &#x1f3f5;️热门专栏: &#x1f9ca; Java基本语法(97平均质量分)https://blog.csdn.net/2301_80050796/category_12615970.html?spm1001.2014.3001.5482 &#x1f355; Collection与…