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

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

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

相关文章

Excel:vba实现生成随机数

Sub 生成随机数字()Dim randomNumber As IntegerDim minValue As IntegerDim maxValue As Integer 设置随机数的范围(假入班级里面有43个学生,学号是从1→43)minValue 1maxValue 43 生成随机数(在1到43之间生成随机数)randomNumber Application.WorksheetFunctio…

element 按钮变形 el-button样式异常

什么都没动,element UI的按钮变形了,莫名其妙,连官网的也变形了,换了其它浏览器又正常, 难道这是element UI的问题?NO,是浏览器的插件影响到了!去扩展插件里面一个个关闭扩展&#x…

时间序列预测(十)——长短期记忆网络(LSTM)

目录 一、LSTM结构 二、LSTM 核心思想 三、LSTM分步演练 (一)初始化 1、权重和偏置初始化 2、初始细胞状态和隐藏状态初始化 (二)前向传播 1、遗忘门计算(决定从上一时刻隐状态中丢弃多少信息) 2、…

CSS 样式 box-sizing: border-box; 用于控制元素的盒模型如何计算宽度和高度

文章目录 box-sizing: border-box; 的含义默认盒模型 (content-box)border-box 盒模型 在微信小程序中的应用示例 在微信小程序中,CSS 样式 box-sizing: border-box; 用于控制元素的盒模型如何计算宽度和高度。具体来说, box-sizing: border-box; 会改…

使用TimeShift备份和恢复Ubuntu Linux

您是否曾经想过如何备份和恢复您的Ubuntu或Debian系统?TimeShift是一个强大的备份和还原工具。TimeShift允许您创建系统快照,提供了一种在出现意外问题或系统故障时恢复到先前状态的简便方式。您可以使用RSYNC或BTRFS创建快照。 有了这个介绍&#xff0…

SSM 图书馆借还系统-计算机设计毕业源码24465

目 录 摘要 1 绪论 1.1 研究背景 1.2 研究意义 1.3论文章节安排 2相关技术介绍 2.1 B/S结构 2.2 SSM框架 2.3 MySQL数据库 3系统分析 3.1 可行性分析 3.2 系统功能性分析 3.3.非功能性分析 3.4 系统用例分析 3.5系统流程分析 3.5.1 用户登录流程 3.5.2 数据删…

中小企业设备资源优化:Spring Boot系统实现

2相关技术 2.1 MYSQL数据库 MySQL是一个真正的多用户、多线程SQL数据库服务器。 是基于SQL的客户/服务器模式的关系数据库管理系统,它的有点有有功能强大、使用简单、管理方便、安全可靠性高、运行速度快、多线程、跨平台性、完全网络化、稳定性等,非常…

ruoyi域名跳转缓存冲突问题(解决办法修改:session名修改session的JSESSIONID名称)

【版权所有,文章允许转载,但须以链接方式注明源地址,否则追究法律责任】【创作不易,点个赞就是对我最大的支持】 前言 仅作为学习笔记,供大家参考 总结的不错的话,记得点赞收藏关注哦! 目录 前…

Prism 四事件聚合器

#1024程序员节|征文# 不废话,直接上代码一个简单的示例。 1、事件聚合 创建一个文件夹EventBLL,添加EventDemo.cs,代码如下。 using System; using System.Collections.Generic; using System.Linq; using System.Text; using …

linux中级wed服务器(https搭建加密服务器)

一。非对称加密算法: 公钥:公共密钥,开放 私钥:私有密钥,保密 1.发送方用自己的公钥加密,接受方用发送方的私钥解密:不可行 2.发送方用接受方的公钥加密,接受方用自己的私钥解密…

SpringMVC实战:构建高效表述层框架

文章目录 1. SpringMVC简介和体验1.1 介绍1.2 主要作用1.3 核心组件和调用流程1.4 快速体验 2. SpringMVC接收数据2.1 访问路径设置2.2 接收参数2.2.1 param和json参数比较2.2.2 param参数接收2.2.3 路径参数接收2.2.4 json参数接收 2.3 接收cookie数据2.4 接收请求头数据2.5 原…

【开源免费】基于SpringBoot+Vue.JS在线文档管理系统(JAVA毕业设计)

本文项目编号 T 038 ,文末自助获取源码 \color{red}{T038,文末自助获取源码} T038,文末自助获取源码 目录 一、系统介绍二、演示录屏三、启动教程四、功能截图五、文案资料5.1 选题背景5.2 国内外研究现状5.3 可行性分析 六、核心代码6.1 查…

CryoEM - 冷冻电镜 基于深度学习的 从头重构(Ab-initio Reconstruction) 开源项目 教程

欢迎关注我的CSDN:https://spike.blog.csdn.net/ 本文地址:https://spike.blog.csdn.net/article/details/143162494 免责声明:本文来源于个人知识与公开资料,仅用于学术交流,欢迎讨论,不支持转载。 来源于 CryoDragon 算法 冷冻电镜(CryoEM) 是一种成像方式,为蛋白质和…

AOT漫谈专题(第六篇): C# AOT 的泛型,序列化,反射问题

一:背景 1. 讲故事 在 .NET AOT 编程中,难免会在 泛型,序列化,以及反射的问题上纠结和反复纠错尝试,这篇我们就来好好聊一聊相关的处理方案。 二:常见问题解决 1. 泛型问题 研究过泛型的朋友应该都知道…

论文笔记:通用世界模型WorldDreamer

整理了WorldDreamer: Towards General World Models for Video Generation via Predicting Masked Tokens 论文的阅读笔记 背景模型实验 背景 现有的世界模型仅限于游戏或驾驶等特定场景,限制了它们捕捉一般世界动态环境复杂性的能力。针对这一挑战,本文…

qt QHBoxLayout详解

QHBoxLayout 是 Qt 框架中用于创建水平布局的类。它将子控件以横向的方式排列,并自动调整大小,以适应父窗口的尺寸变化。 重要方法 QHBoxLayout(QWidget *parent nullptr):创建一个 QHBoxLayout 对象,并指定其父窗口部件。addWi…

【ArcGIS微课1000例】0125:ArcGIS矢量化无法自动完成面解决方案

文章目录 一、坐标系统问题二、正确使用自动完成面工具一、坐标系统问题 1. 数据库坐标系 arcgis矢量化的过程中,无法自动完成面,可能是因为图层要素没有坐标系造成的。双击数据库打开数据库属性,可以查看当前数据框的坐标系。 2. 图层坐标系 双击图层,打开图层属性,切…

深度学习——线性神经网络(五、图像分类数据集——Fashion-MNIST数据集)

目录 5.1 读取数据集5.2 读取小批量5.3 整合所有组件 MNIST数据集是图像分类中广泛使用的数据集之一,但是作为基准数据集过于简单,在本小节将使用类似但更复杂的Fashion-MNIST数据集。 import torch import torchvision from torch.utils import data fr…

前端零基础入门到上班:【Day3】从零开始构建网页骨架HTML

HTML 基础入门&#xff1a;从零开始构建网页骨架 目录 1. 什么是 HTML&#xff1f;HTML 的核心作用 2. HTML 基本结构2.1 DOCTYPE 声明2.2 <html> 标签2.3 <head> 标签2.4 <body> 标签 3. HTML 常用标签详解3.1 标题标签3.2 段落和文本标签3.3 链接标签3.4 图…

使用Python来下一场深夜雪

效果图&#xff1a;&#xff08;真实情况是动态的&#xff09; 完整代码&#xff1a; import turtle import random# 初始化画布 turtle.bgcolor("#001f3f") # 偏深蓝色的背景 turtle.title("下雪的画面") turtle.speed(0) turtle.hideturtle() turtle.t…