8.three.js相机详解

8.three.js相机详解

1、 认识相机

在Threejs中相机的表示是THREE.Camera,它是相机的抽象基类,其子类有两种相机,分别是正投影相机THREE.OrthographicCamera和透视投影相机THREE.PerspectiveCamera:

在这里插入图片描述

正投影和透视投影的区别是:透视投影有一个基本点,就是远处的物体比近处的物体小。

在这里插入图片描述

2.正投影相机

正投影相机:

new THREE.OrthographicCamera( left, right, top, bottom, near, far );

如图,定义一个正投影相机的可视范围,由left, right, top, bottom, near, far六个参数确定,图中灰色区域即相机可视部分,left, right, top, bottom确定了可视区域的矩形平面大小, near, far确定了可视区域的深度范围。

在这里插入图片描述

3.透视投影相机

透视投影相机:

let camera = new THREE.PerspectiveCamera( fov, aspect, near, far)

如图,定义一个透视投影相机的可视范围,由 fov, aspect, near, far四个参数可以确定,图中绿色平面到粉色平面的空间即为可视区域。

1、视角fov:这里可以理解为视野角度的大小,即,视角的大小,如果设置为0,相当你闭上眼睛了,所以什么也看不到,如果为180,那么可以认为你的视界很广阔,但是在180度的时候,往往物体很小,因为他在你的整个可视区域中的比例变小了。

2、近平面near:这个呢,表示你近处的裁面的距离。补充一下,也可以认为是眼睛距离近处的距离,假设为10米远,请不要设置为负值,Three.js就傻了,不知道怎么算了。

3、远平面far:这个呢,表示你远处的裁面,

4、纵横比aspect:实际窗口的纵横比,即宽度除以高度。这个值越大,说明你宽度越大

在这里插入图片描述

其它的参数介绍:

 camera.position.x = 0;
 camera.position.y = 0;
 camera.position.z = 1000;
 camera.up.x = 0;
 camera.up.y = 0;
 camera.up.z = 1;
 camera.lookAt({
 x: 0,
 y: 0,
 z: 0,
 });

position参数:定义相机的位置

up参数:相机的上方向,用于确定相机的摆放

lookAt参数:相机看向哪个位置

在这里插入图片描述

视频演示地址:https://www.bilibili.com/video/BV18HypYwEnr/?vd_source=0f4eae2845bd3b24b877e4586ffda69a

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

燕山大学23级经济管理学院 10.18 C语言作业

燕山大学23级经济管理学院 10.18 C语言作业 文章目录 燕山大学23级经济管理学院 10.18 C语言作业1C语言的基本数据类型主要包括以下几种:为什么设计数据类型?数据类型与知识体系的对应使用数据类型时需要考虑的因素 21. 逻辑运算符2. 真值表3. 硬件实现4…

最大公约数(公式法)

求多个数的最大公约数 采用连续求gcd的方式 题目 ACCODE #include<bits/stdc.h> using namespace std; long long num[4]; int main(){cin>>num[1]>>num[2]>>num[3];sort(num1,num4);// cout<<num[1]<<" "<<num[2]<&…

尚硅谷spark学习

p4 快速上手 -开发环境准备

Java多线程新手指南:从零开始学习多线程创建,有两下子!

咦咦咦&#xff0c;各位小可爱&#xff0c;我是你们的好伙伴 bug菌&#xff0c;今天又来给大家手把手教学Java SE系列知识点啦&#xff0c;赶紧出来哇&#xff0c;别躲起来啊&#xff0c;听我讲干货记得点点赞&#xff0c;赞多了我就更有动力讲得更欢哦&#xff01;所以呀&…

代码审计-Python Flask

1.Jinjia2模版注入 Flask是一个使用 Python 编写的轻量级 Web 应用框架。其 WSGI 工具箱采用 Werkzeug &#xff0c;模板引擎则使用 Jinja2。jinja2是Flask作者开发的一个模板系统&#xff0c;起初是仿django模板的一个模板引擎&#xff0c;为Flask提供模板支持&#xff0c;由于…

KASan部署、使用与原理分析

文章目录 前言1、概述2、使用方法3、测试用例3.1、检测加载的内核模块3.2、检测调用的内核模块3.3、通过系统调用检测3.4、检测编译到Linux内核中的内核模块 4、工作原理4.1、影子内存&#xff08;Shadow Memory&#xff09;4.2、内存状态&#xff08;Memory States&#xff09…

海南聚广众达电子商务咨询有限公司靠谱吗怎么样?

在当今这个数字化浪潮席卷全球的时代&#xff0c;抖音电商以其独特的魅力成为了众多商家争相入驻的新蓝海。而在这片浩瀚的电商海洋中&#xff0c;如何找到一家既专业又可靠的合作伙伴&#xff0c;成为了众多商家心中的一大难题。今天&#xff0c;我们就来深入剖析一下海南聚广…

爬虫日常实战

爬取美团新闻信息&#xff0c;此处采用两种方法实现&#xff1a; 注意点&#xff1a;因为此处的数据都是动态数据&#xff0c;所以一定要考虑好向下滑动数据包会更新的情况&#xff0c;不然就只能读取当前页即第一页数据&#xff0c;方法一通过更新ajax数据包网址页数&#xf…

转变软件交付方式:通过统一 API 和测试策略提高质量和速度

API 在当今的数字化转型中至关重要&#xff0c;但无缝交付也同样重要。然而&#xff0c;许多组织仍然分散其 API 开发和 UI 测试流程&#xff0c;导致问题检测延迟、发布时间延长&#xff0c;甚至遗漏错误。在快节奏的环境中&#xff0c;这种方法是不可持续的&#xff0c;因为上…

Java调用上传文件接口

以 QAnthing 上传文件&#xff08;POST&#xff09;接口为例&#xff0c;展示Java如何调用上传文件接口。 接口文档如下&#xff1a; QAnthign接口文档地址 上代码&#xff1a; RestTemplate 版 /** * * param url 接口地址 * param filePath 文件本地路径 */ public vo…

【C++】踏上C++学习之旅(三):“我“ 与 “引用“ 的浪漫邂逅

文章目录 前言1. "引用"的概念1.1 "引用"的语法 2. "引用"的特性3. "引用"的使用场景3.1 "引用"做参数3. 2 "引用"做返回值3.2.1 "引用"做返回值时需要注意的点 4. 常引用5. "引用"在底层的实…

【设计模式系列】命令模式

目录 一、什么是命令模式 二、命令模式的角色 三、命令模式的典型应用场景 四、命令模式在Runnable中的应用 一、什么是命令模式 命令模式&#xff08;Command Pattern&#xff09;是一种行为设计模式&#xff0c;它将一个请求或简单操作封装为一个对象。这个模式提供了一种…

在使用new Date()生成时间戳时,发现数据库中 的时间总是多出一秒钟。

项目汇报的时候&#xff0c;进一步研究问题 insert into t_tax_file(task_id, task_no, business_type, file_name, file_url, creator_id, created_time, modifier_id,modified_time)value (10, taskNo测试, 1, 文件名称, 文件地址, 1, 2024-10-21 10:25:21.889, 1, 2024-10-…

CCF-BDCI大数据与计算智能大赛TOP4-京东生鲜

2023 CCF 大数据与计算智能大赛《线上线下全场景生鲜超市库存履约一体化决策》top4南山论剑 摘要1 数据预处理1.1 数据整合1.2 数据划分 2 特征工程2.1 静态特征2.2 动态特征 3 方案设计3.1 数据构造3.2 模型训练3.3 模型融合3.4库存分配3.5 方案对比 链接: CCFBDCI-线上线下全…

对BSV区块链下一代节点Teranode的答疑解惑(上篇)

​​发表时间&#xff1a;2024年8月7日 2024年初BSV区块链研发团队揭晓了即将到来的Teranode更新的突破性特性&#xff0c;这些特性将显著提升网络的效率和处理速度&#xff0c;使BSV区块链能够达到百万级TPS。 Teranode的项目主管Siggi Oskarsson强调&#xff1a;“当你阅读这…

uniapp项目结构基本了解

基本结构的解释 App.vue&#xff1a;应用的根组件&#xff0c;定义全局布局和逻辑。pages/&#xff1a;存放各个页面的 .vue 文件&#xff0c;定义应用的具体页面和功能模块。main.js&#xff1a;应用入口文件&#xff0c;初始化应用&#xff0c;挂载 App.vue。manifest.json&…

[Linux进程概念]命令行参数|环境变量

目录 一、命令行参数 1.什么是命令行参数 2.为什么要有命令行参数 &#xff08;1&#xff09;书写的代码段 &#xff08;2&#xff09;实际的代码段 3.Linux中的命令行参数 二、环境变量 1.什么是环境变量&#xff1f; 2.获取环境变量 &#xff08;1&#xff09;指令…

基于Multisim电子配料秤电路设计(含仿真和报告)

【全套资料.zip】电子配料秤电路设计Multisim仿真设计数字电子技术 文章目录 功能一、Multisim仿真源文件二、原理文档报告资料下载【Multisim仿真报告讲解视频.zip】 功能 电子配料秤仿真功能: 准确测量物体重量&#xff0c;精确度0.1Kg使用两位数码管显示重量信息 使用拨码…

深度学习 基本函数01

np.dot 是 NumPy 库中的一个函数&#xff0c;用于计算两个数组的点积&#xff08;也称为内积或数量积&#xff09;。点积是两个向量的对应元素乘积之和。 np.random.normal 是 NumPy 库中的一个函数&#xff0c;用于生成符合正态分布&#xff08;也称为高斯分布&#xff09;的…

jmeter用csv data set config做参数化1

在jmeter中&#xff0c;csv data set config的作用非常强大&#xff0c;用它来做批量测试和参数化非常好用。 csv data set config的常用配置项如下&#xff1a; Variable Names处&#xff0c;写上源文件中的参数名&#xff0c;用于后续接口发送请求时引用 Ignore first line…