three.js 纹理(Texture)、深度纹理(DepthTexture)、视频纹理(VideoTexture)

纹理(Texture)

创建一个纹理贴图,将其应用到一个表面,或者作为反射/折射贴图。

构造函数

Texture( image, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy, encoding )

// load a texture, set wrap mode to repeat
const texture = new THREE.TextureLoader().load( "textures/water.jpg" );
texture.wrapS = THREE.RepeatWrapping;
texture.wrapT = THREE.RepeatWrapping;
texture.repeat.set( 4, 4 );

属性

.id : Integer

只读 - 表示该纹理实例的唯一数字。

.uuid : String

该对象实例的UUID。 这个值是自动分配的,因此不应当对其进行编辑。

.name : String

该对象的名称,可选,且无需唯一。默认值是一个空字符串。

.image : Image

一个图片对象,通常由TextureLoader.load方法创建。 该对象可以是被three.js所支持的任意图片(例如PNG、JPG、GIF、DDS)或视频(例如MP4、OGG/OGV)格式。

要使用视频来作为纹理贴图,你需要有一个正在播放的HTML5 Video元素来作为你纹理贴图的源图像, 并在视频播放时不断地更新这个纹理贴图。——VideoTexture 类会对此自动进行处理。

.mipmaps : Array

用户所给定的mipmap数组(可选)。

.mapping : number

图像将如何应用到物体(对象)上。默认值是THREE.UVMapping对象类型, 即UV坐标将被用于纹理映射。
请参阅texture constants(映射模式常量)来了解其他映射类型。

.wrapS : number

这个值定义了纹理贴图在水平方向上将如何包裹,在UV映射中对应于U
默认值是THREE.ClampToEdgeWrapping,即纹理边缘将被推到外部边缘的纹素。 其它的两个选项分别是THREE.RepeatWrapping和THREE.MirroredRepeatWrapping。 请参阅texture constants来了解详细信息。

.wrapT : number

这个值定义了纹理贴图在垂直方向上将如何包裹,在UV映射中对应于V
可以使用与.wrapS : number相同的选项。

请注意:纹理中图像的平铺,仅有当图像大小(以像素为单位)为2的幂(2、4、8、16、32、64、128、256、512、1024、2048、……)时才起作用。 宽度、高度无需相等,但每个维度的长度必须都是2的幂。 这是WebGL中的限制,不是由three.js所限制的。

.magFilter : number

当一个纹素覆盖大于一个像素时,贴图将如何采样。默认值为THREE.LinearFilter, 它将获取四个最接近的纹素,并在他们之间进行双线性插值。 另一个选项是THREE.NearestFilter,它将使用最接近的纹素的值。
请参阅texture constants页面来了解详细信息。

.minFilter : number

当一个纹素覆盖小于一个像素时,贴图将如何采样。默认值为THREE.LinearMipmapLinearFilter, 它将使用mipmapping以及三次线性滤镜。

请参阅texture constants页面来了解所有可能的选项。

.anisotropy : number

沿着轴,通过具有最高纹素密度的像素的样本数。 默认情况下,这个值为1。设置一个较高的值将会产生比基本的mipmap更清晰的效果,代价是需要使用更多纹理样本。 使用renderer.getMaxAnisotropy() 来查询GPU中各向异性的最大有效值;这个值通常是2的幂。

.format : number

默认值为THREE.RGBAFormat, 但TextureLoader将会在载入JPG图片时自动将这个值设置为THREE.RGBFormat。

请参阅texture constants页面来了解其它格式。

.internalFormat : String

The default value is obtained using a combination of .format and .type.
The GPU format allows the developer to specify how the data is going to be stored on the GPU.

See the texture constants page for details regarding all supported internal formats.

.type : number

这个值必须与.format相对应。默认值为THREE.UnsignedByteType, 它将会被用于绝大多数纹理格式。

请参阅texture constants来了解其它格式。

.offset : Vector2

How much a single repetition of the texture is offset from the beginning, in each direction U and V. Typical range is 0.0 to 1.0.

The below texture types share the first uv channel in the engine. The offset (and repeat) setting is evaluated according to the following priorities and then shared by those textures:

  1. color map
  2. specular map
  3. displacement map
  4. normal map
  5. bump map
  6. roughness map
  7. metalness map
  8. alpha map
  9. emissive map
  10. clearcoat map
  11. clearcoat normal map
  12. clearcoat roughnessMap map

The below texture types share the second uv channel in the engine. The offset (and repeat) setting is evaluated according to the following priorities and then shared by those textures:

  1. ao map
  2. light map

.repeat : Vector2

How many times the texture is repeated across the surface, in each direction U and V. If repeat is set greater than 1 in either direction, the corresponding Wrap parameter should also be set to THREE.RepeatWrapping or THREE.MirroredRepeatWrapping to achieve the desired tiling effect. Setting different repeat values for textures is restricted in the same way like .offset.

.rotation : number

纹理将围绕中心点旋转多少度,单位为弧度(rad)。正值为逆时针方向旋转,默认值为0

.center : Vector2

旋转中心点。(0.5, 0.5)对应纹理的正中心。默认值为(0,0),即左下角。

.matrixAutoUpdate : Boolean

是否从纹理的.offset、.repeat、.rotation和.center属性更新纹理的UV变换矩阵(uv-transform .matrix)。 默认值为true。 如果你要直接指定纹理的变换矩阵,请将其设为false。

.matrix : Matrix3

纹理的UV变换矩阵。 当纹理的.matrixAutoUpdate属性为true时, 由渲染器从纹理的.offset、.repeat、.rotation和.center属性中进行更新。 当.matrixAutoUpdate属性为false时,该矩阵可以被手动设置。 默认值为单位矩阵。

.generateMipmaps : Boolean

是否为纹理生成mipmap(如果可用)。默认为true。 如果你手动生成mipmap,请将其设为false。

.premultiplyAlpha : Boolean

If set to true, the alpha channel, if present, is multiplied into the color channels when the texture is uploaded to the GPU. Default is false.

Note that this property has no effect for ImageBitmap. You need to configure on bitmap creation instead. See ImageBitmapLoader.

.flipY : Boolean

If set to true, the texture is flipped along the vertical axis when uploaded to the GPU. Default is true.

Note that this property has no effect for ImageBitmap. You need to configure on bitmap creation instead. See ImageBitmapLoader.

.unpackAlignment : number

默认为4。指定内存中每个像素行起点的对齐要求。 允许的值为1(字节对齐)、2(行对齐到偶数字节)、4(字对齐)和8(行从双字边界开始)。 请参阅glPixelStorei来了解详细信息。

.encoding : number

默认值为THREE.LinearEncoding。 请参阅texture constants来了解其他格式的详细信息。

请注意,如果在材质被使用之后,纹理贴图中这个值发生了改变, 需要触发Material.needsUpdate,来使得这个值在着色器中实现。

.version : Integer

这个值起始值为0,计算.needsUpdate : Boolean被设置为true的次数。

.onUpdate : Function

一个回调函数,在纹理被更新后调用。 (例如,当needsUpdate被设为true且纹理被使用。)

.needsUpdate : Boolean

将其设置为true,以便在下次使用纹理时触发一次更新。 这对于设置包裹模式尤其重要。

方法

EventDispatcher方法在这个类上可以使用。

.updateMatrix () : null

从纹理的.offset、.repeat、 .rotation和.center属性来更新纹理的UV变换矩阵(uv-transform .matrix)。

.clone () : Texture

拷贝纹理。请注意。这不是“深拷贝”,图像是共用的。

.toJSON ( meta : Object ) : Object

meta -- 可选,包含有元数据的对象。
将Texture对象转换为 three.js JSON Object/Scene format(three.js JSON 物体/场景格式)。

.dispose () : null

使用“废置”事件类型调用EventDispatcher.dispatchEvent。

.transformUv ( uv : Vector2 ) : Vector2

基于纹理的.offset、.repeat、 .wrapS、.wrapT和.flipY属性值来变换uv。

深度纹理(DepthTexture)

构造函数

DepthTexture( width : Number, height : Number, type : Constant, wrapS : Constant, wrapT : Constant, magFilter : Constant, minFilter : Constant, anisotropy : Number, format : Constant )

width -- 纹理的宽度。
height -- 纹理的高度。
type -- Default is THREE.UnsignedShortType when unsing DepthFormat and THREE.UnsignedInt248Type when using DepthStencilFormat. 请参阅type constants(类型常量)来了解其他选项。
mapping -- 请参阅mapping mode constants(映射模式常量)来了解其他选项。
wrapS -- 默认值是THREE.ClampToEdgeWrapping. 请参阅wrap mode constants(包裹模式常量)来了解其他选项。
wrapT -- 默认值是THREE.ClampToEdgeWrapping. 请参阅wrap mode constants(包裹模式常量)来了解其他选项。
magFilter -- 当一个纹素覆盖大于一个像素时,贴图将如何采样。 其默认值为THREE.LinearFilter。请参阅magnification filter constants(放大滤镜常量)来了解其它选项。
minFilter -- 当一个纹素覆盖小于一个像素时,贴图将如何采样。 其默认值为THREE.LinearMipMapLinearFilter。请参阅minification filter constants(缩小滤镜常量)来了解其它选项。
anisotropy -- 沿着轴,通过具有最高纹素密度的像素的样本数。 默认情况下,这个值为1。设置一个较高的值将会产生比基本的mipmap更清晰的效果,代价是需要使用更多纹理样本。 使用renderer.getMaxAnisotropy() 来查询GPU中各向异性的最大有效值;这个值通常是2的幂。

format -- 这个值必须是DepthFormat(默认值)或者DepthStencilFormat。 请参阅format constants(格式常量)来了解详细信息。

属性

共有属性请参见其基类Texture。 —— 以下属性也是texture类中的一部分,但在这里默认值不同。

.format

DepthFormat(默认值)或者DepthStencilFormat中的一个。 请参阅format constants来了解详细信息。

.type

Default is THREE.UnsignedShortType when unsing DepthFormat and THREE.UnsignedInt248Type when using DepthStencilFormat. 请参阅format constants来了解详细信息。

.magFilter

当一个纹素覆盖大于一个像素时,贴图将如何采样。 其默认值为THREE.NearestFilter。 请参阅magnification filter constants(放大滤镜常量)来了解其他选项。

.minFilter

当一个纹素覆盖小于一个像素时,贴图将如何采样。 其默认值为THREE.NearestFilter。 请参阅minification filter constants(缩小滤镜常量)来了解其他选项。

.flipY

深度贴图不需要被翻转,因此其默认值为false

.generateMipmaps

深度贴图不使用mipmap。

方法

共有方法请参见其基类Texture。

视频纹理(VideoTexture)

创建一个使用视频来作为贴图的纹理对象。

它和其基类Texture几乎是相同的,除了它总是将needsUpdate设置为true,以便使得贴图能够在视频播放时进行更新。自动创建mipmaps也会被禁用

// assuming you have created a HTML video element with id="video"
const video = document.getElementById( 'video' );
const texture = new THREE.VideoTexture( video );

构造函数

VideoTexture( video : Video, mapping : Constant, wrapS : Constant, wrapT : Constant, magFilter : Constant, minFilter : Constant, format : Constant, type : Constant, anisotropy : Number )

video -- 将被作为纹理贴图来使用的Video元素。
mapping -- 纹理贴图将被如何应用(映射)到物体上,它是THREE.UVMapping中的对象类型。 请参阅mapping constants(映射模式常量)来了解其他选项。
wrapS -- 默认值是THREE.ClampToEdgeWrapping. 请参阅wrap mode constants(包裹模式常量)来了解其他选项。
wrapT -- 默认值是THREE.ClampToEdgeWrapping. 请参阅wrap mode constants(包裹模式常量)来了解其他选项。
magFilter -- 当一个纹素覆盖大于一个像素时,贴图将如何采样。 其默认值为THREE.LinearFilter。请参阅magnification filter constants(放大滤镜常量)来了解其它选项。
minFilter -- 当一个纹素覆盖小于一个像素时,贴图将如何采样。 其默认值为THREE.LinearMipmapLinearFilter。请参阅minification filter constants(缩小滤镜常量)来了解其它选项。
format -- 在纹理贴图中使用的格式。 请参阅format constants(格式常量)来了解各个选项。
type -- 默认值是THREE.UnsignedByteType. 请参阅type constants(类型常量)来了解其他选项。
anisotropy -- 沿着轴,通过具有最高纹素密度的像素的采样数。 默认情况下,这个值为1。设置一个较高的值将会比基本的mipmap产生更清晰的效果,代价是需要使用更多纹理样本。 使用renderer.getMaxAnisotropy() 来查询GPU中各向异性的最大有效值;这个值通常是2的幂。
 

属性

共有属性请参见其基类Texture。

.needsUpdate : Boolean

在这里,你不必手动设置这个值,因为它是由update方法来进行控制的。

方法

共有方法请参见其基类Texture。

.update () : null

在每一次新的一帧可用时,这个方法将被自动调用, 并将.needsUpdate : Boolean设置为true

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

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

相关文章

Chrome和Firefox哪款浏览器的密码管理更安全

在当今数字化时代,浏览器已成为我们日常生活中不可或缺的工具。其中,谷歌Chrome和Mozilla Firefox是两款广受欢迎的浏览器。除了浏览网页外,它们还提供了密码管理功能,帮助用户保存和管理登录凭证。然而,关于哪款浏览器…

预览 PDF 文档

引言 在现代Web应用中,文件预览功能是非常常见的需求之一。特别是在企业级应用中,用户经常需要查看各种类型的文件,如 PDF、Word、Excel 等。本文将详细介绍如何在Vue项目中实现 PDF 文档的预览功能。 实现原理 后端API 后端需要提供一个…

web前端多媒体标签设置(图片,视频,音频)以及图片热区(usemap)的设置

多媒体标签运用 在HTML中有以下常见多媒体标签&#xff1a; <img> &#xff08;图像标签&#xff09; - 作用&#xff1a;用于在网页中嵌入图像。 - 示例&#xff1a; <img src"image.jpg" alt"这是一张图片"> 。其中 src 属性指定图像的…

结合无监督表示学习与伪标签监督的自蒸馏方法,用于稀有疾病影像表型分类的分散感知失衡校正|文献速递-基于生成模型的数据增强与疾病监测应用

Title 题目 Hybrid unsupervised representation learning and pseudo-label supervisedself-distillation for rare disease imaging phenotype classification with dispersion-aware imbalance correction 结合无监督表示学习与伪标签监督的自蒸馏方法&#xff0c;用于稀…

【C++】入门C++

1.C的第一个程序 之前写的C语言文件都是后缀为.c的文件&#xff0c;进入C后就要把后缀改为.c了&#xff0c;vs编译器看到是.cpp就会调⽤C编译器编译。C兼容C语言的绝大多数语法&#xff0c;所以C语言的 hallo word 依旧可以在C下使用。 //test.cpp //c语言的hallo world #inc…

紫光同创——盘古 50KN 网口板

本原创文章由深圳市小眼睛科技有限公司创作&#xff0c;版权归本公司所有&#xff0c;如需转载&#xff0c;需授权并注明出处&#xff08;www.meyesemi.com) 一、开发系统介绍 盘古 50KN 网口板开发板&#xff08;MES50H-Ethernet&#xff09;采用了核心板扩展板的结 构&#…

本篇文章来介绍下dockerfile

我开始玩儿docker的时候&#xff0c;都是通过docker pull命令把基础镜像拉取到本地&#xff0c;然后在跑成容器&#xff0c;在操作容器&#xff0c;做一些自己的事情&#xff0c;比如安装个java环境什么的&#xff0c;直到我接触到了dockerfile&#xff0c;我发现dockerfile真是…

一款基于.NET8开源且免费的中小型酒店管理系统

项目介绍 TopskyHotelManagerSystem是一款基于.NET8开源、免费&#xff08;MIT License&#xff09;的中小型酒店管理系统&#xff0c;为中小型酒店提供全面的酒店管理系统解决方案&#xff0c;帮助酒店提高运营效率&#xff0c;优化客户体验。 开发目的 在现如今发展迅速的酒…

【本科毕业设计】基于单片机的智能家居防火防盗报警系统

基于单片机的智能家居防火防盗报警系统 源码下载摘要Abstract第1章 绪论1.1课题的背景1.2 研究的目的和意义 第2章 系统总体方案设计2.1 设计要求2.2 方案选择和论证2.2.1 单片机的选择2.2.2 显示方案的选择 第3章 系统硬件设计3.1 整体方案设计3.1.1 系统概述3.1.2 系统框图 3…

【测试平台】打包 子节点ios环境配置

主要记录如何配置ios打包机环境&#xff0c;ios环境相对来说比较简单的&#xff0c;研发配置好证书可以本地打包&#xff0c;接入流程比较简单了。 打包机系统升级 1.升级mac OS系统 一般升级好几个小时&#xff0c;可以晚上下载好 2.下载xcode并安装 Appstroe 下载安装xco…

分布式光伏是什么意思?如何高效管理?

分布式光伏系统是指在用户现场或靠近用电现场配置较小的光伏发电供电系统&#xff0c;以满足特定用户的需求。根据通知&#xff0c;分布式光伏系统主要有以下几类定义&#xff1a; 10kV以下电压等级接入&#xff0c;且单个并网点总装机容量不超过6MW的分布式电源&#xff1a;这…

初识WebGL

思路&#xff1a; 构建<canvas>画布节点&#xff0c;获取其的实例。使用getWebGLContext() 拿到画布上下文。拿到上下文用clearColor() 设置背景颜色。最后清空canvas画布,是为了清除颜色缓冲区。 html结构&#xff1a; <!DOCTYPE html> <html lang"en&…

微信小程序时间弹窗——年月日时分

需求 1、默认当前时间2、选择时间弹窗限制最大值、最小值3、每次弹起更新最大值为当前时间&#xff0c;默认值为上次选中时间4、 minDate: new Date(2023, 10, 1).getTime(),也可以传入时间字符串new Date(2023-10-1 12:22).getTime() html <view class"flex bb ptb…

redis部署手册

文章目录 一、 环境配置资源配置操作系统资源配置服务器1服务器2服务器3 目录规划 二、Redis软件部署2.1 上传相关软件包2.2 安装软件2.3 修改配置文件2.3.1 修改redis.conf2.3.2 修改sentinel.conf2.3.3 启动2.3.4 安装完成 三、Redis的哨兵恢复3.1 现象3.2 解决方法 一、 环境…

SD-WAN分布式组网:构建高效、灵活的企业网络架构

随着企业数字化转型的深入&#xff0c;分布式组网逐渐成为企业网络架构中的核心需求。无论是跨区域的分支机构互联&#xff0c;还是企业与云服务的连接&#xff0c;如何在不同区域实现高效、低延迟的网络传输&#xff0c;已成为业务成功的关键。SD-WAN&#xff08;软件定义广域…

#PCIE#基础知识分解之 CC/SRNS/SRIS 时钟架构

参考资料为PCIe Base Spec和CEM Spec。 1.1 时钟架构分类 PCIe参考时钟的三种架构&#xff1a; Common Refclk (Shared Refclk) ArchitectureData Clocked Rx ArchitectureSeparate Refclk Architecture 下面&#xff0c;我们来简单地聊一聊前面说到的三种参考时钟架构&…

开源一款前后端分离的企业级网站内容管理系统,支持站群管理、多平台静态化,多语言、全文检索的源码

大家好&#xff0c;我是一颗甜苞谷&#xff0c;今天分享一款前后端分离的企业级网站内容管理系统&#xff0c;支持站群管理、多平台静态化&#xff0c;多语言、全文检索的源码。 前言 在当今的数字化时代&#xff0c;企业网站和个人博客已成为信息传播和品牌建设的重要渠道。…

Linux系统基础-多线程超详细讲解(2)_线程控制

个人主页&#xff1a;C忠实粉丝 欢迎 点赞&#x1f44d; 收藏✨ 留言✉ 加关注&#x1f493;本文由 C忠实粉丝 原创 Linux系统基础-多线程超详细讲解(2)_线程控制 收录于专栏[Linux学习] 本专栏旨在分享学习Linux的一点学习笔记&#xff0c;欢迎大家在评论区交流讨论&#x1f4…

「C/C++」C/C++ 之 判断语句

✨博客主页何曾参静谧的博客&#x1f4cc;文章专栏「C/C」C/C程序设计&#x1f4da;全部专栏「VS」Visual Studio「C/C」C/C程序设计「UG/NX」BlockUI集合「Win」Windows程序设计「DSA」数据结构与算法「UG/NX」NX二次开发「QT」QT5程序设计「File」数据文件格式「PK」Parasoli…

2024年10月HarmonyOS应用开发者基础认证全新题库

注意事项&#xff1a;切记在考试之外的设备上打开题库进行搜索&#xff0c;防止切屏三次考试自动结束&#xff0c;题目是乱序&#xff0c;每次考试&#xff0c;选项的顺序都不同 这是基础认证题库&#xff0c;不是高级认证题库注意看清楚标题 高级认证题库地址&#xff1a;20…