法线贴图NormalMap的DDS压缩

关于normal map的dds压缩,有一张图可以说明问题:

可以注意到普通的dtx5压缩后,那些颗粒的光照细节丢失得比较厉害,同时栅格现象也很严重。

同时可以看到DXT5_NM在相同文件大小的情况下,细节保存得不错。

使用Swizzled DXT5格式:基本上还是DXT5格式,但是把X值放到A,把Y值放到G,R/B channel可忽略,理由是DXT5压缩特性使得A/G channel压缩品质比较高。品质会比直接把DXT5存XYZ的方式好很多。

使用3Dc:目前只有AMD(ATI)的GPU支援。效果应该比Swizzled DXT5好。(由于手边沒有ATI的卡,所以无从比较)

The DXT1 compressed normal map on the right shows noticeable
blocking artifacts compared to the original normal map on the left.

The DXT5 compressed normal map on the right
compared to the original normal map on the left.

The DXT5 compressed normal map with re-normalization on
the right compared to the original normal map on the left.

此时引入关键字:3Dc dxt5_nm swizzle

我在D3D里没看到有对DXT5_NM的直接支持,在使用nvtt生成dxt5_nm格式的normalMap,因为xy=ag,r=1,所以颜色是桔黄的。

shader中作相应处理

float3 fvNormal;
fvNormal.xy = (tex2D( normalMap, texCoord ).ag * 2.0f - 1.0f);
fvNormal.z = sqrt(1.0 - dot(fvNormal.xy, fvNormal.xy));

渲染效果 

链接:

http://codefield.blogspot.com/2007/04/normal-map_6771.html

oZone3D.Net Tutorials - Normal Map Compression S3TC DXT5 swizzling ATI 3Dc GL_ATI_texture_compression_3dc OpenGL GLSL glCompressedTexImage2D

http://code.google.com/p/nvidia-texture-tools/wiki/NormalMapCompression

http://developer.nvidia.com/object/real-time-normal-map-dxt-compression.html

原文:normalMap的DDS压缩 - 千里马肝 - 博客园

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
PixiJS 6.5的Texture Loader默认不支持DDS压缩纹理的加载,但可以通过使用pixi-compressed-textures插件来实现。这个插件可以让你加载BC1-5、ETC1、PVRTC等压缩纹理格式。 首先,你需要安装该插件。你可以通过npm安装它: ``` npm install pixi-compressed-textures ``` 安装完后,你需要在你的代码中导入它并将其添加到PixiJS的Loader中: ```javascript import { CompressedTextureLoader } from 'pixi-compressed-textures'; import { Loader } from 'pixi.js'; // 将 CompressedTextureLoader 添加到 PixiJS Loader Loader.registerPlugin(CompressedTextureLoader); ``` 现在你可以使用PixiJS的Loader加载DDS纹理了: ```javascript import { Loader } from 'pixi.js'; // 加载dds纹理 Loader.shared.add('myTexture', 'path/to/myTexture.dds'); Loader.shared.load(() => { const texture = Loader.shared.resources.myTexture.texture; // 使用纹理 }); ``` 你需要注意的是,由于不同的设备和浏览器支持的压缩纹理格式不同,因此需要使用不同的纹理格式来保证兼容性。你可以使用CompressedTextureLoader的getSupportedFormats()方法获取当前设备支持的所有格式。例如,如果你想使用PVRTC格式来加载纹理: ```javascript import { CompressedTextureLoader } from 'pixi-compressed-textures'; import { Loader } from 'pixi.js'; Loader.registerPlugin(CompressedTextureLoader); const supportedFormats = CompressedTextureLoader.getSupportedFormats(); if (supportedFormats.pvrtc) { // 加载PVRTC格式的纹理 Loader.shared.add('myTexture', 'path/to/myTexture.pvr'); } else { // 加载普通的非压缩纹理 Loader.shared.add('myTexture', 'path/to/myTexture.png'); } Loader.shared.load(() => { const texture = Loader.shared.resources.myTexture.texture; // 使用纹理 }); ``` 希望对你有所帮助!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值