问题标签 [bump-mapping]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1450 浏览

three.js - 导出凹凸贴图和高光贴图

我已经看到了新的 MeshPhongMaterial Bump 和 Specular 高光,迫不及待地想将它们加入我的游戏引擎。目前我正在使用 python 转换器将 OBJ 文件转换为 .js 文件。然而,51 版出口商似乎无法处理这些材料。

我还担心我的大多数网格都有 2 种或更多材料,并且正在使用 MeshFaceMaterial。

更改为 MeshPhongMaterial 会破坏多个纹理吗?我应该使用不同的出口商来实现这一目标吗?使用凹凸贴图和高光贴图从 .3ds 文件转换的最佳工作流程是什么?我应该等待一段时间让这个话题平静下来吗?

0 投票
1 回答
2900 浏览

javascript - 重复凹凸贴图

我正在尝试将凹凸贴图应用于平面,以使用 Three.js r55 创建一个模糊的感觉表面。

这是我的代码:

请注意我如何将纹理设置为沿 x/y 轴重复两次。但是,我所看到的仅将纹理应用于一个象限:

我希望使用夹子/重复包装(或任何名称)来实现这一点,但我在RepeatWrapping这里提出了要求。

如何让凹凸贴图在飞机上正确重复任意次数。


编辑 - 完整代码

我着手制作一个简单的复制案例。这是非常小的,并且再现了下面的图像(从稍微不同的相机角度)。输出具有相同的问题。

这链接到 Three.js r55(缩小版)。

任何帮助表示赞赏。

0 投票
1 回答
1768 浏览

shader - 如何结合凹凸贴图法线和真实法线?

我正在尝试使用凹凸贴图创建着色器。

我有对象的真实法线,我有凹凸贴图采样法线。我想做的是旋转采样的法线,以便在采样的法线点上“向上”在真实法线的方向上。

我一直在做数学,但我似乎做错了...... Y 在这个世界上。

0 投票
0 回答
2660 浏览

opengl - GLSL - 基于噪声的凹凸映射

我正在尝试在 GLSL 片段和顶点着色器中创建类似于下图的灰泥纹理。

在此处输入图像描述

我知道有多种方法可以做到这一点。但是,我想专注于根据我从噪声函数接收到的值来扰乱片段着色器中的表面法线。

我的思考过程如下..

  1. 将噪声函数发送到我当前位置按某个标量缩放。
  2. 一旦我有了噪声,我就可以扰动表面法线并将其与我的 Phong 着色模型一起使用。

但是,我不确定我从那里去哪里。

这是我到目前为止所拥有的。

顶点着色器 - 计算切线是基于对象范数构建切线向量的辅助方法。

片段着色器 - 到目前为止...

现在,我的实际问题。

  1. 我抵消什么正常?我会正常偏移物体吗?我一直在读到凹凸映射应该发生在对象空间中。

  2. 将偏移量应用于法线的最佳方法是什么?

一些系统信息:Mac OSX - OpenGL 3.2 - 着色器必须能够在不支持新 3.2 的旧 Mac 上工作。

0 投票
1 回答
1600 浏览

opengl - GLSL 法线贴图(Lambert 为 0.0 的区域被点亮)

当我使用模型的法线时,结果很好(有暗区和亮区,正如我对简单的朗伯漫反射着色器所期望的那样)

但是当我使用法线贴图时,黑暗区域会变亮!

我想使用法线贴图并且仍然像这些示例一样获得正确的漫射照明

这是有和没有法线映射的代码

这是使用法线贴图的代码

顶点着色器

片段着色器

注意:实际的法线贴图可以正常工作,如镜面高光所示

我使用 Assimp 加载模型(md5mesh)并使用 Assimp 计算切线,然后将其作为属性发送到着色器

这是问题的代码和屏幕截图的链接

https://dl.dropboxusercontent.com/u/32670019/code%20and%20screenshots.zip

这是代码中的问题还是我有误解?

更新的代码和屏幕截图

https://dl.dropboxusercontent.com/u/32670019/updated%20code%20and%20screenshots.zip

现在法线贴图与漫反射一起使用,但单独使用漫反射是不正确的

0 投票
1 回答
3336 浏览

opengl-es - 按照 Nvidia GPU Gems 第 1 章设置 GLSL 海洋水着色器

我正在关注关于使用着色器进行水模拟的Nvidia GPU Gems 第 1 章。我正在尝试按照本章在 OpenGL es 2.0 (iOS) 中使用 glsl 创建海水着色器。

我能够按照本章中的描述创建几何波,但是在创建纹理法线贴图时我遇到了麻烦。本章对于实际渲染到纹理渲染目标的内容有些不清楚。我应该渲染法线贴图还是高度贴图?在文本中,它建议将法线作为 rgb 颜色渲染到目标,但同样,第 1.3 节“创作”下的图像 (b) 和 (d) 似乎表明应该将灰度高度图渲染到纹理目标. 本章还讨论了使用查找纹理作为纹理的 u 坐标,但我不清楚这如何适合渲染到纹理。是否有 2 种不同的纹理可供渲染?如果有人可以帮助澄清这些组件如何组合在一起,我将非常感激!

0 投票
2 回答
1982 浏览

c++ - 法线贴图和照明出错,无法正确显示

我正在实现法线映射,通过 ASSIMP 库计算切线向量。

法线映射似乎在模型矩阵接近单位矩阵的对象上工作得很好。只要我开始平移和缩放,我的灯光似乎就关闭了。正如您在图片中看到的,法线贴图在容器立方体上完美运行,但在大地板上照明失败(镜面反射光的方向应该朝向玩家,而不是朝向容器)。

光照在法线贴图上不起作用

只要我开始更改模型矩阵(通过翻译/缩放)。我发布了所有相关的代码,希望你们能以某种方式看到我丢失的东西,因为我已经盯着我的代码好几天了。

顶点着色器

片段着色器

OpenGL绘图代码

编辑 我现在使用启用了“aiProcess_CalcTangentSpace”标志的 ASSIMP 库加载我的对象,并相应地更改了我的着色器以适应新的更改。由于 ASSIMP 现在会自动计算正确的切向量,因此我应该有有效的切向量并且我的问题应该得到解决(正如 Nicol Bolas 所指出的),但我仍然遇到同样的问题,镜面照明表现得很奇怪,并且漫反射照明没有真正出现. 我想还有其他东西不能正常工作。我将您的答案取消标记为正确答案 Nicol Bolas(目前)并相应地更新了我的代码,因为我仍然缺少一些东西。

应该和翻译有关吧。一旦我向模型矩阵添加一个平移(y 方向上的 -22.0f),它就会对奇怪的光照做出反应。只要地板(实际上是一个立方体)没有平移,照明看起来就很好。

0 投票
1 回答
1264 浏览

c++ - 法线贴图和平移打乱了我的光照

我遇到了法线贴图问题。我在通过 ASSIMP 库加载的每个模型上都有一个纹理和一个普通纹理。我在 ASSIMP 库的帮助下计算每个对象上的切向量,所以这些应该没问题。这些对象与法线贴图完美配合,但是一旦我开始平移其中一个对象(从而通过平移影响模型矩阵),照明就会失败。正如您在图像中看到的那样,地板(沿 y 轴平移)似乎失去了大部分漫反射光照,并且其镜面光照方向错误(它应该在灯泡和玩家位置之间)

法线贴图出错

它可能与正常矩阵有关(尽管应该丢失翻译),也可能与着色器中使用的错误矩阵有关。我没有想法,希望你能对这个问题有所了解。

顶点着色器:

片段着色器

编辑

编辑着色器代码以计算世界空间中的所有内容,而不是在世界和相机空间之间进行乒乓球(更容易理解且不易出错)。

0 投票
1 回答
1067 浏览

opengl - 模型、切线或相机空间中的光计算(着色)?

我目前正在尝试实现需要有“切线空间”的凹凸贴图。我通读了一些教程,特别是以下两个:

两个教程都避免在片段着色器中进行昂贵的矩阵计算,如果阴影计算照常发生在相机空间中(至少我已经习惯了),这将是必需的。

它们引入了切线空间,每个顶点可能不同(如果表面平滑,甚至每个片段)。如果我理解正确,为了有效的凹凸映射(即最小化片段着色器中的计算),他们使用顶点着色器将光计算所需的一切转换到这个切线空间。但我想知道模型空间是否是计算光照着色的好选择。

我关于这个话题的问题是:

  • 对于切线空间中的着色计算,我在顶点着色器和片段着色器之间究竟传递了什么?我真的需要转换切线空间中的灯光位置,需要O(number of lights)不同的变量吗?例如,这不适用于延迟着色,或者如果由于顶点着色器中的某些其他原因不知道灯光位置。必须有一个(仍然有效的)替代方案,我猜这是模型空间中的着色计算。

  • 如果我通过模型空间变化,是否仍然在切线空间中执行着色计算是一个好主意,即在片段着色器中转换光位置?还是在模型空间中执行着色计算更好?哪个会更快?(在这两种情况下,我都需要一个 TBN 矩阵,但一种情况需要模型到切线的变换,另一种是切线到模型的变换。)

  • 我目前将每个顶点法线、切线和双切线(正交法线)传递给顶点着色器。如果我理解正确,则仅当我想快速构建模型到切线空间矩阵时才需要正交化,该矩阵需要反转包含 TBN 向量的矩阵。如果它们是正交的,这只是一个转置。但是,如果我不需要切线空间中的向量,我不需要求逆,而只需要矩阵中的原始 TBN 向量,然后是模型的切线矩阵。这不会简化一切吗?

0 投票
1 回答
8105 浏览

javafx - JavaFX 材质的凹凸和规格图

当 JavaFX8 代码加载颜色、凹凸和规格贴图时,颜色和规格按预期工作,但凹凸贴图会导致奇怪的效果。这三个都是地球的墨卡托地图。通常,凹凸贴图不会添加 3d 效果。凹凸贴图只会导致喜马拉雅山和安第斯山脉在地球的明亮一侧显示为带有闪亮边框的黑色区域,而在彩色地图上显示为阴影一侧。我究竟做错了什么?

作为 3d 的新手,我的第一个想法是应该有某种将凹凸贴图的像素颜色值缩放为高程的方式,我错过了这一点。