Cesium Vue(三)— 相机配置

1. 坐标系转换

1.1 cesium使用到的坐标系

  1. 屏幕坐标系,二维的笛卡尔坐标系,API => Cartesian2
  2. 地理空间坐标系,WGS-84坐标系, API => Cartographic(经度,维度,高度)
  3. 三维笛卡尔空间直角坐标系,API => Cartesian3

1.2 坐标转换具体实现

  • 角度与弧度的转换
var radians=Cesium.Math.toRadians(90);
console.log("radians ==> "+radians);
  • 弧度转角度
var degrees=Cesium.Math.toDegrees(2*Math.PI);
console.log("degrees ==> "+degrees);
  • 将经纬度转成笛卡尔坐标系
var cartesian3=Cesium.Cartesian3.fromDegrees(89.5,//经度20.4,//纬度100//高度
);
console.log("cartesian3 ==> "+cartesian3);
  • 将笛卡尔坐标系转换为经纬度
var cartographic=Cesium.Cartographic.fromCartesian(cartesian3);
console.log("cartographic ==> "+cartographic);
//得到结果弧度,转成角度
var longitude=Cesium.Math.toDegrees(cartographic.longitude);
var latitude=Cesium.Math.toDegrees(cartographic.latitude);
console.log("LonLat ==> "+longitude+","+latitude);

在这里插入图片描述

2. 设置相机的位置和视角

  • 设置相机位置和视角
 // 设置相机视角瞬间到达指定位置,角度// (116.393428, 39.90923)生成position是天安门的位置var position = Cesium.Cartesian3.fromDegrees(116.393428, 39.90923, 100);viewer.camera.setView({// 指定相机位置destination: position,// 指定相机视角orientation: {// 指定相机的朝向,偏航角,相当于 X 角heading: Cesium.Math.toRadians(0),// 指定相机的俯仰角,0度是竖直向上,-90度是向下  相当于 y 角pitch: Cesium.Math.toRadians(-20),// 指定相机的滚转角,翻滚角   相当于 z 角roll: 0,},});

在这里插入图片描述

  • 设置带相机动画的位置和视角
// flyto,让相机飞往某个地方
viewer.camera.flyTo({destination: position,orientation: {heading: Cesium.Math.toRadians(0),pitch: Cesium.Math.toRadians(-20),roll: 0,},
});

3. 使用键盘控制相机的位置和视角

// 通过按键移动相机document.addEventListener("keydown", (e) => {// console.log(e);// 获取相机离地面的高度var height = viewer.camera.positionCartographic.height;var moveRate = height / 100;if (e.key == "w") {// 设置相机向前移动viewer.camera.moveForward(moveRate);} else if (e.key == "s") {// 设置相机向后移动viewer.camera.moveBackward(moveRate);} else if (e.key == "a") {// 设置相机向左移动viewer.camera.moveLeft(moveRate);} else if (e.key == "d") {// 设置相机向右移动viewer.camera.moveRight(moveRate);} else if (e.key == "q") {// 设置相机向左旋转相机viewer.camera.lookLeft(Cesium.Math.toRadians(0.1));} else if (e.key == "e") {// 设置相机向右旋转相机viewer.camera.lookRight(Cesium.Math.toRadians(0.1));} else if (e.key == "r") {// 设置相机向上旋转相机viewer.camera.lookUp(Cesium.Math.toRadians(0.1));} else if (e.key == "f") {// 设置相机向下旋转相机viewer.camera.lookDown(Cesium.Math.toRadians(0.1));} else if (e.key == "g") {// 向左逆时针翻滚viewer.camera.twistLeft(Cesium.Math.toRadians(0.1));} else if (e.key == "h") {// 向右顺时针翻滚viewer.camera.twistRight(Cesium.Math.toRadians(0.1));}});

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

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

相关文章

leetcode-279. 完全平方数

1. 题目链接 链接: 题目链接 2. 解答 #include <stdio.h> #include <stdlib.h> #include <stdbool.h>bool issquare(int n) {if (n 1 || n 4) return true;if (n 2 || n 3) return false;for (int i 3; i < n/2; i ) {if (n i*i) return true;}…

react使用echarts图表

要在React中使用Echarts图表库&#xff0c;可以按照以下步骤进行操作&#xff1a; 首先&#xff0c;确保你的React项目已经安装了Echarts库。可以通过运行以下命令来安装Echarts npm install echarts --save在你的组件文件中&#xff0c;导入Echarts库&#xff1a; import ech…

黑马程序员Java Web--14.综合案例--删除品牌功能实现

一、BrandMapper 添加删除单个数据的函数和sql语句 Delete("delete from tb_brand where id#{id}")void deleteById(int id);二、BrandService 定义一个删除单个数据的接口 void deleteById(int id);三、BrandServiceImpl 在BrandServiceImpl重写deleteById方法&a…

笔记本Win10系统一键重装操作方法

笔记本电脑已经成为大家日常生活和工作中必不可少的工具之一&#xff0c;如果笔记本电脑系统出现问题了&#xff0c;那么就会影响到大家的正常操作。这时候就可以考虑给笔记本电脑重装系统了。接下来小编给大家介绍关于一键重装Win10笔记本电脑系统的详细步骤方法。 推荐下载 系…

RabbitMQ高级知识点

以下是一些 RabbitMQ 的高级知识点&#xff1a; 1. Exchange&#xff1a; RabbitMQ 中的 Exchange 是消息路由器&#xff0c;用来接收消息并且转发到对应的 Queue 中。Exchange 有四种类型&#xff1a;Direct Exchange、Fanout Exchange、Topic Exchange 和 Headers Exchange。…

ftp靶机_获取shell

ftp靶机_获取shell 文章目录 ftp靶机_获取shellftp概念实验环境信息探测 发现漏洞优化shell ftp概念 FTP 是File Transfer Protocol(文件传输协议)的英文简称&#xff0c;而中文简称为“文传协议”。用于Internet上的控制文件的双向传输。同时&#xff0c;它也是一个应用程序(…

自动化测试框架指南

目录 定义测试自动化 不同类型的框架 以工具为中心的框架 面向项目的框架 关键字驱动的框架 完美测试自动化框架的主要组件 测试库 单元测试 集成和端到端测试 行为驱动开发 测试数据管理 mock&#xff0c;Stubs和虚拟化 实施模式的通用机制 测试结果报告 CI平台…

Java系列 | 如何讲自己的JAR包上传至阿里云maven私有仓库【云效制品仓库】

什么是云效 云效是云原生时代一站式 BizDevOps 平台&#xff0c;产研数字化同行者&#xff0c;支持公共云、专有云和混合云多种部署形态&#xff0c;通过云原生新技术和研发新模式&#xff0c;助力创新创业和数字化转型企业快速实现产研数字化&#xff0c;打造“双敏”组织&…

mysql——面试题初体验

查询环境 1、student&#xff08;学生表&#xff09; 2、课程表(course) 3、教师表(teacher) 4、成绩表(score) 问题 (1) 查询所有学生的学号、姓名、选课数、总成绩 mysql> select s.s_id as 学号,s.s_name as 姓名 from student as s; ---------------- | 学号 | 姓名…

对称(镜像)二叉树

之前写的比较两棵树是否相等&#xff0c;是左子树和左子树比&#xff0c;右子树和右子树比——利用这个思想镜像二叉树就是从第二层的两个节点作为两棵树的根&#xff0c;然后比较&#xff0c;这里的比较是左子树和右子树比&#xff0c;右子树和左子树比 ——也就是利用比较两个…

深入探析网络代理与网络安全

随着互联网的快速发展&#xff0c;网络安全问题日益突出&#xff0c;而网络代理技术正成为应对安全挑战的重要工具。本文将深入探讨Socks5代理、IP代理以及它们在网络安全、爬虫开发和HTTP协议中的关键作用&#xff0c;以期帮助读者更好地理解和应用这些技术。 1. Socks5代理&…

解决 MyBatis 一对多查询中,出现每组元素只有一个,总组数与元素数总数相等的问题

文章目录 问题简述场景描述问题描述问题原因解决办法 问题简述 笔者在使用 MyBatis 进行一对多查询的时候遇到一个奇怪的问题。对于笔者的一对多的查询结果&#xff0c;出现了这样的一个现象&#xff1a;原来每个组里有多个元素&#xff0c;查询目标是查询所查的组&#xff0c;…

深度学习:UserWarning: The parameter ‘pretrained‘ is deprecated since 0.13..解决办法

深度学习&#xff1a;UserWarning: The parameter ‘pretrained’ is deprecated since 0.13 and may be removed in the future, please use ‘weights’ instead. 解决办法 1 报错警告&#xff1a; pytorch版本&#xff1a;0.14.1 在利用pytorch中的预训练模型时&#xff0…

搭建Atlas2.2.0 集成CDH6.3.2 生产环境+kerberos

首先确保环境的干净&#xff0c;如果之前有安装过清理掉相关残留 确保安装atlas的服务器有足够的内存&#xff08;至少16G&#xff09;&#xff0c;有必要的hadoop角色 HDFS客户端 — 检索和更新Hadoop使用的用户组信息&#xff08;UGI&#xff09;中帐户成员资格的信息。对调…

Day2力扣打卡

打卡记录 无限数组的最短子数组&#xff08;滑动窗口&#xff09; 链接 思路&#xff1a;先求单个数组的总和&#xff0c;再对两个重复数组所组成的新数组上使用 不定长的滑动窗口 来求得满足目标的最小长度。 class Solution { public:int minSizeSubarray(vector<int>…

springBoot视频在线播放,支持快进,分片播放

1、主要是通过ResourceHttpRequestHandler类来实现&#xff0c;ResourceHttpRequestHandler本身支持分片加载&#xff0c;前端在请求头中携带Range: bytes 0-5001&#xff0c;就可以从后台自动截取对应大小视频内容。 第一步&#xff0c;先自定义实现一个ResourceHttpRequest…

项目经理每天,每周,每月的工作清单

很多不懂项目管理的伙伴问&#xff0c;项目经理每天每周每个月的工作是什么呢&#xff1f; 仿佛他们什么都管&#xff0c;但是又没有具体的产出&#xff0c;但是每天看他们比谁都忙&#xff0c;其实很简单&#xff0c;项目中的每个环节负责具体的事情&#xff0c;但是每个环节…

【1day】泛微e-office OA SQL注入漏洞学习

注:该文章来自作者日常学习笔记,请勿利用文章内的相关技术从事非法测试,如因此产生的一切不良后果与作者无关。 目录 一、漏洞描述 二、影响版本 三、资产测绘 四、漏洞复现

Ubuntu磁盘扩容

假如是主分区 apt install cloud-guest-utils 之后执行两个命令即可&#xff08;下面的1对应vda1&#xff0c;为系统盘的第一个分区扩容&#xff0c;即vda1&#xff09;growpart /dev/vda 1 resize2fs /dev/vda1假如是逻辑分区 lvdisplay查看逻辑分区信息执行命令lvextend -l…

使用服务器训练模型的注意事项

一、图像展示 1.1、用VS Code远程连接服务器时&#xff0c;当我们想用matplotlib库来进行图像展示的时候&#xff0c;需要设置DISPLAY变量。 # 用终端工具&#xff08;XShell&#xff09;SSH远程服务器&#xff0c;在终端上输入下列语句 # 如果使用了anaconda的虚拟环境&…