91 Three.js Texture纹理属性详解
构造函数
Texture( image, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy )
案例
// load a texture, set wrap mode to repeat
var texture = new THREE.TextureLoader().load( "textures/water.jpg" );
texture.wrapS = THREE.RepeatWrapping;
texture.wrapT = THREE.RepeatWrapping;
texture.repeat.set( 4, 4 );
案例查看地址:http://www.wjceo.com/blog/threejs/2018-04-27/154.html
属性
名称 | 描述 |
---|---|
id | 此纹理实例的唯一编号。 |
uuid | 此对象实例的UUID。这会自动分配,所以不应该编辑。 |
name | 对象的名称,可以重复,默认值为空字符串 |
image |
一个Image对象,通常使用 ImageUtils 或 ImageLoader 类来创建。Image 对象可以包括图像 (比如 PNG, JPG, GIF, DDS), 视频 (e.g., MP4, OGG/OGV), 或者六幅图像的集合用于一个立方体贴图。 要使用视频作为一个纹理,你需要把一个HTML5视频元素作为纹理图像的源,并在视频播放时不断更新这个纹理-VideoTexture 类会自动处理。
|
mipmap | 用户指定的mipmap数组(可选) |
mapping |
如何将图像应用到对象。默认为 UV贴图(THREE.UVMapping)类型,这里U,V 坐标用来应用映射,要求是单个纹理。 其他类型包括: THREE.CubeReflectionMapping:立方体反射映射 THREE.CubeRefractionMapping:立方体折射映射 THREE.EquirectangularReflectionMapping:圆柱反射映射 THREE.EquirectangularRefractionMapping:圆柱折射映射 THREE.SphericalReflectionMapping:球面反射映射 |
wrapS |
缺省为 THREE.ClampToEdgeWrapping, 表示边缘被夹到纹理单元(texels)的外边界。THREE.ClampToEdgeWrapping:夹边。超过1.0的值被固定为1.0。超过1.0的其它地方的纹理,沿用最后像素的纹理。用于当叠加过滤时,需要从0.0到1.0精确覆盖且没有模糊边界的纹理。其他两个选项是: THREE.RepeatWrapping:平铺重复。超过1.0的值都被置为0.0。纹理被重复一次。在渲染具有诸如砖墙之类纹理的物体时,如果使用包含一整张砖墙的纹理贴图会占用较多的内存,通常只需载入一张具有一块或多块砖瓦的较小的纹理贴图,再把它按照重叠纹理寻址模式在物体表面映射多次,就可以达到和使用整张砖墙贴图同样的效果。 THREE.MirroredRepeatWrapping:镜像重复。每到边界处纹理翻转,意思就是每个1.0 u或者v处纹理被镜像翻转。 |
wrapT |
缺省为 THREE.ClampToEdgeWrapping, 表示边缘被夹到纹理单元(texels)的外边界。其他两个选项是 THREE.RepeatWrapping 和 THREE.MirroredRepeatWrapping。注意: 平铺图像纹理仅在图像尺寸是2的幂次方(2,4,8,16,32,64,128,256,512,1024,2048,…)时工作。每个维度的值不一定是相同的,但每一个维度都必须是2的幂次方。这是WebGL的限制,不是Three.js的。
|
magFilter | 该属性定义当一个纹理单元(texel)覆盖多个像素点时纹理如何采样。缺省为 THREE.LinearFilter,表示获取4个最近的纹理单元执行双向线性插值计算(显示效果好)。另外的选项是 THREE.NearestFilter, 表示使用最近的texel(性能优)。 |
minFilter |
该属性定义当一个纹理单元(texel)不足以覆盖单个像素点时纹理如何采样。缺省为 THREE.LinearMipMapLinearFilter, 表示使用多级纹理贴图(mipmapping)以及一个三线性滤波器。 其他选项是: THREE.NearestFilter:最近滤镜。在纹理基层上执行最邻近过滤。 THREE.NearestMipMapNearestFilter:选择最临近的mip层,并执行最临近的过滤。 THREE.NearestMipMapLinearFilter:在mip层之间执行线性插补,并执行最临近的过滤。 THREE.LinearFilter:在纹理基层上执行线性过滤。 THREE.LinearMipMapNearestFilter:选择最临近的mip层,并执行线性过滤。 THREE.LinearMipMapLinearFilter:在mip层之间执行线性插补,并执行线性过滤。 |
anisotropy | 表示纹理的各向异性。沿纹理单元密度最高方向的轴线所取样本数。默认情况下,这个值为1。较高的值比基础MipMap要更清晰,但需要更多的采样。 使用renderer.getMaxAnisotropy()方法来找到GPU最大有效各向异性值;这个值通常是2的幂次方。 |
format |
缺省纹理格式为THREE.RGBAFormat。其他格式有: THREE.AlphaFormat:对应于GL_ALPHA。Alpha 值 THREE.RGBFormat:Red, Green, Blue 三原色值 THREE.RGBAFormat:Red, Green, Blue 和 Alpha 值 THREE.LuminanceFormat:灰度值 THREE.LuminanceAlphaFormat:灰度值和 Alpha 值 THREE.RGBEFormat |
type |
缺省纹理格式为THREE.RGBAFormat。其他格式有: THREE.UnsignedByteType:无符号8位整形值(1个字节) THREE.ByteType:带符号8位整形值(1个字节) THREE.ShortType:带符号16位整形值(2个字节) THREE.UnsignedShortType:无符号16未整形值(2个字节) THREE.IntType:带符号32位整形值(4个字节) THREE.UnsignedIntType:无符号32位整形值(4个字节) THREE.FloatType:单精度浮点型(4个字节) THREE.HalfFloatType:半浮点型 |
offset | 在U和V方向上,纹理在模型表面上重复绘制时的偏移。通常范围是0.0 到 1.0。注意: offset属性是一个便捷修饰符,仅影响Texture对模型上第一组UV的应用。如果纹理用作需要额外UV集的贴图(例如,大多数库存材料的aoMap或lightMap),则必须手动分配这些UV以获得所需的偏移量。 |
repeat |
纹理在整个表面上重复多少次,在每个方向U和V上。如果在任一方向上repeat设置为大于1,则相应的Wrap参数也应设置为 THREE.RepeatWrapping 或THREE.MirroredRepeatWrapping 以实现所需的平铺影响。注意: repeat属性是一个便捷修饰符,仅影响Texture对模型上第一组UV的应用。如果纹理用作需要额外UV集的贴图(例如,大多数库存材料的aoMap或lightMap),则必须手动分配这些UV以实现所需的重复。
|
rotation | 纹理围绕中心点旋转多少,以弧度表示。正值是逆时针的。缺省值是0。 |
center | 旋转发生的点。值(0.5,0.5)对应于纹理的中心。默认值是(0,0),左下角。 |
matrixAutoUpdate | 是否更新纹理的UV-变换.matrix从纹理特性.offset,.repeat, .rotation和.center。默认情况下为真。如果直接指定uv-transform矩阵,则将其设置为false。 |
matrix | 纹理的uv转换矩阵。从质地特性渲染更新.offset,.repeat, .rotation和.center当纹理的.matrixAutoUpdate属性为true。当.matrixAutoUpdate属性为false时,可以手动设置此矩阵。默认值是单位矩阵。 |
generateMipmaps | 是否为纹理生成mipmap(如果可能)。默认情况下为真。如果您手动创建mipmap,请将其设置为false。 |
premultiplyAlpha | 在默认情况下,这是PNG图像的标准。如果RGB值已被预乘alpha,则设置为true。 |
flipY | 默认为真。翻转图像的Y轴以匹配WebGL纹理坐标空间。 |
unpackAlignment | 默认值为4。指定内容中每个像素行起点的对齐要求。有效值有 1 (字节对齐byte-alignment), 2 (行起点按偶数字节对齐), 4 (字对齐word-alignment), 和 8(行起点按双字对齐)。参阅:glPixelStorei 以了解更多信息。 |
encoding | 编码方式。默认设置为 THREE.LinearEncoding,但是支持 sRGB, RGBE, RGBM, RGBD, LogLuv 和 Gamma。 重要:如果纹理中的这个值在材料已用后被改变,则需要触发一个Material.needsUpdate操作,以便该值在着色器中得到实现。 |
version | 从0开始计算needsUpdate更新次数 |
onUpdate | 一个回调函数,当纹理被更新时调用(例如,当needsUpdate被设置为true并且纹理被使用时)。 |
needsUpdate | 将其设置为true以在下次使用纹理时触发更新。对于设置换行模式尤为重要。 |
方法
名称 | 描述 |
---|---|
.updateMatrix () | 更新纹理的UV-变换.matrix从纹理特性.offset,.repeat, .rotation和.center。 |
.clone( texture : Texture ) | 制作纹理的副本。请注意,这不是“深层复制”,图像是共享的。 |
.toJSON( meta ) |
meta - 包含元数据的可选对象。 将材质转换为three.js JSON格式。 |
.dispose () |
使用一个’dispose’事件类型来调用 EventDispatcher.dispatchEvent 方法(自定义事件类)。
|
.transformUv ( uv ) | 根据此纹理的.offset,.repeat, .wrapS,.wrapT和.flipY属性的值转换uv 。 |
91 Three.js Texture纹理属性详解相关推荐
- Unity 之 打包参数 -- Player面板属性详解
Unity 之 Project Setting -- Player 面板属性详解 前言 一,Player 1.1 属性说明 1.2 效果展示 二,ICON(图标) 2.1 属性说明 2.2 使用示例 ...
- layui添加复选框_对layui初始化列表的CheckBox属性详解,初始化属性
对layui初始化列表的CheckBox属性详解,初始化属性 通常layui前端页面完全按照layui官网的例子写所有的页面初始化都没有问题,但是那只是静态页面.当加入后台去动态加载页面的时候有写样式 ...
- Vue 中的 ref 属性详解
Vue 中的 ref 属性详解 我们先来读一下vue的官方文档 我们来分析官方文档 首先ref的引用是相当于一个DOM节点(如果是子组件则指向的是其实例),而且是一个string类型的值. 通俗的将就 ...
- Three.js - 摄像机的使用详解(透视投影摄像机、正交投影摄像机)
一.两种摄像机的区别与比较 Three.js 库提供了两种不同的摄像机:透视投影摄像机和正交投影摄像机. 透视投影摄像机:这种摄像机的效果更贴近真实世界.也就是物体离摄像机越远,它们就会被渲染得越小. ...
- computed用发_Vue.js中computed使用详解
这次给大家带来Vue.js中computed使用详解,Vue.js中computed使用的注意事项有哪些,下面就是实战案例,一起来看一下. JS属性: JavaScript有一个特性是Object.d ...
- mixins php,vue的mixins属性详解
这篇文章主要介绍了vue的mixins属性详解,现在分享给大家,也给大家做个参考. 首先先给出官网 https://vuejs.org/v2/guide/mixins.html 今天在开发项目的时候要 ...
- jquery方法属性详解
jquery方法属性详解! 1.jquery简介 jquery是什么,作用是什么? jquery用来简化js操作DOM元素 jquery不能用DOM的方法,DOM不能用jquery的方法 各种选择器的 ...
- 【input 标签的 type 属性详解】
input 标签的 type 属性详解 1. input 输入标签的 type 属性 1.1 input 标签的 type类型 属性的常用属性值 ⑴ 单行文本框: type="text&qu ...
- html css data-,HTML+CSS入门 HTML自定义data属性详解
本篇教程介绍了HTML+CSS入门 HTML自定义data属性详解,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门.< 可以在HTML标签上添加任意以 "data-&q ...
最新文章
- 网易伏羲论文入选 CVPR:AI 感知表情能力或实现巨大突破!
- RedHat Enterprise LInux 6.3 安装Oracle Database 11g
- uboot 命令使用
- nginx 中location中root和alias的区别
- vue页面引入多个组件的方法
- float型数据与字节数组的转化
- 用mplfinance库定制A股常用的K线、均线图
- mysql dump锁表_mysqldump 锁表和解锁语句
- 循环buffer的实现_Go语言源码阅读之bytes.Buffer
- python简单实战项目:《冰与火之歌1-5》角色关系图谱构建——人物关系可视化
- Spring Boot 国际化踩坑指南
- win10 快捷键大全(集合)
- Centos7配置AirPrint(解决手机执行多次打印后搜索不到打印机的情况)
- java pdf 水印 加密_Java生成PDF 加密 水印
- CIO40: IT中年男修身修性修心之王阳明
- 一个女程序员的工作感悟
- ★「C++游戏」BattleOfPhantom:大乱斗游戏升级版
- vue spa php,在Vue中有关SPA首屏加载优化(详细教程)
- 如何查看别人通过百度云盘分享的文件
- 梁宁——用户体验地图和用户故事(阅读总结)