Three.js中的Texture纹理

3D模型在线预览提供多种低代码平台3D模型在线预览解决方案，实现了将多种3D模型格式无缝集成到低代码业务表单中。这意味着用户可以在不离开低代码平台的情况下，直接查看和操作3D模型，极大地提升了数据可视化的效果和用户交互体验。

Texture 的三十二个属性

• id : Integer 只读 - 表示该纹理实例的唯一数字。
• isTexture : Boolean 判断是纹理
• 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（映射模式常量）来了解其他映射类型。 // 以下是常用属性列表

• channel : Integer 在 Three.js 等图形渲染系统中， .channel 属性可以用来选择纹理所映射到的 UV 坐标集。使用不同的 UV 通道，可以灵活地对同一个模型应用多种纹理映射方式。

• wrapS : number 在 Three.js 中，wrapS 属性用于控制纹理在水平方向（S 轴，即 U 轴）上的重复方式。它指定了当纹理超出原始 UV 范围 [0, 1] 时，应该如何处理纹理的显示。 // 以下是常用属性列表

• wrapT : number 在 Three.js 中，wrapT 属性用于控制纹理在垂直方向（T 轴，即 V 轴）上的重复方式。它定义了当纹理的 UV 超出 [0, 1] 范围时，如何处理纹理在垂直方向的显示效果。 // 以下是常用属性列表

• magFilter : number 在 Three.js 中，magFilter 属性用于控制当纹理被放大显示（像素比纹理分辨率更大）时的采样方式。它决定了纹理放大时的清晰度或模糊度。 // 以下是常用属性列表

• minFilter : number 在 Three.js 中，minFilter 属性用于控制当纹理缩小显示（纹理的像素比纹理分辨率更小）时的采样方式。它决定了在渲染时如何处理缩小的纹理，以提高视觉效果。 // 以下是常用属性列表

• anisotropy : number 在 Three.js 中，anisotropy 属性用于控制纹理的各向异性过滤程度。各向异性过滤是一种用于提高纹理在斜视角度下（即与观察方向呈现角度时）的清晰度和细节的方法。通过增加各向异性过滤级别，可以显著改善纹理的视觉质量，尤其是在斜视或低视角观察时。

• format : number在 Three.js 中，format 属性用于定义纹理的存储格式。它决定了纹理的颜色数据是如何被存储和处理的。这对于纹理的性能和渲染效果有着重要影响。 // 以下是常用属性列表

• internalFormat : String 在 Three.js 中，internalFormat 属性用于指定纹理的内部格式。这一属性主要用于 WebGL 中纹理的创建和渲染，定义了如何在 GPU 中存储纹理数据。它与纹理的可用格式和性能密切相关。 此项的默认值由.format和.type混合并决定。如果要主动设置困难度较高  // 以下是常用属性列表。

• type : number 在Three.js中，type 属性用于指定纹理数据的类型。它通常用于控制纹理在GPU中的存储格式。type 属性的可选值包括不同的数字常量，每个常量都对应不同的数据类型。

• offset : Vector2 在Three.js中，offset 属性用于定义纹理的偏移量，通常是一个 Vector2 对象。这个属性允许开发者在UV坐标上对纹理进行平移，从而实现纹理的移动效果。

• repeat : Vector2 在Three.js中，repeat 属性用于控制纹理的重复次数，通常也是一个 Vector2 对象。通过设置 repeat 属性，开发者可以定义纹理在UV坐标上的重复频率，以实现纹理的平铺效果。

• rotation : number 在Three.js中，rotation 属性用于控制纹理的旋转角度，单位为弧度。通过设置 rotation 属性，开发者可以对纹理进行旋转，从而实现多种视觉效果。

• center : Vector2 旋转中心点。(0.5, 0.5)对应纹理的正中心。默认值为(0,0)，即左下角。
• matrixAutoUpdate : Boolean 是否从纹理的.offset、.repeat、.rotation和.center属性更新纹理的UV变换矩阵（uv-transform .matrix）。 默认值为true。 如果你要直接指定纹理的变换矩阵，请将其设为false。
• matrix : Matrix3 在Three.js中，matrix 属性用于存储纹理的变换矩阵。它是一个 Matrix3 对象，通常用于进行复杂的纹理变换，如旋转、缩放和偏移。通过设置 matrix 属性，开发者可以对纹理进行更高效的变换操作，而不必分别设置 offset、repeat、rotation 等属性。

• generateMipmaps : Boolean 是否为纹理生成mipmap（如果可用）。默认为true。 如果你手动生成mipmap，请将其设为false。
• premultiplyAlpha : Boolean 如果设置为true并且alpha通道存在的话，上传到GPU时alpha的数值将会与颜色通道的数值相乘。默认为false。注意此项属性不会影响到ImageBitmap。 如果你想要则需要在bitmap创建的时候进行配置，如何配置请查看ImageBitmapLoader。
• flipY : Boolean 如果设置为true，纹理在上传到GPU的时候会进行纵向的翻转。默认值为true。注意此项属性不会影响到ImageBitmap。 如果你想要则需要在bitmap创建的时候进行配置，如何配置请查看ImageBitmapLoader。
• unpackAlignment : number 在Three.js中，unpackAlignment 属性用于控制纹理在GPU中解包时的对齐方式。它是一个数字，通常用于确保纹理数据在内存中的排列方式符合GPU的要求。这对于优化纹理的加载和处理速度非常重要。默认值：4  指定内存中每个像素行起点的对齐要求。 允许的值为1（字节对齐）、2（行对齐到偶数字节）、4（字对齐）和8（行从双字边界开始）。 请参阅glPixelStorei来了解详细信息。

• colorSpace : string 在Three.js中，colorSpace 属性用于指定纹理的颜色空间。它主要用于在处理纹理时确定颜色值的解释方式。这对于确保颜色在不同设备和环境中的一致性尤为重要。// 以下是常用属性列表

• version : Integer 这个值起始值为0，计算 .needsUpdate : Boolean被设置为true的次数。
• onUpdate : Function 一个回调函数，在纹理被更新后调用。 （例如，当needsUpdate被设为true且纹理被使用。）

• needsUpdate : Boolean 将其设置为true，以便在下次使用纹理时触发一次更新。 这对于设置包裹模式尤其重要。
• userData : Object 保存关于纹理的自定义信息的对象。不应该放函数引用，因为函数不会拷贝。

• source : Source 纹理的数据源信息。可以在不同的纹理之间引用相同的数据源，这在使用精灵表的情况下很好用，因为在这种情况下不同的纹理只是使用了不同的偏移，但是其数据源是相同的。

Texture 的五个方法

• updateMatrix () : undefined 从纹理的.offset、.repeat、 .rotation和.center属性来更新纹理的UV变换矩阵（uv-transform .matrix）。
• clone () : Texture 拷贝纹理。请注意。这不是“深拷贝”，图像是共用的。 除此之外，拷贝一个纹理并不会将此纹理自动标记并上传。你需要在图片的属性变更或者源数据完全加载完的时候并准备好的时候将Texture.needsUpdate设置为true。
• toJSON ( meta : Object ) : Object meta -- 可选，包含有元数据的对象。 将Texture对象转换为 three.js JSON Object/Scene format（three.js JSON 物体/场景格式）。
• dispose () : undefined 使用“废置”事件类型调用EventDispatcher.dispatchEvent。
• transformUv ( uv : Vector2 ) : Vector2 基于纹理的.offset、.repeat、 .wrapS、.wrapT和.flipY属性值来变换uv。