Glsl 基于位置纹理的WebGL法线计算

我试图通过顶点置换在webGL中创建一个带有“水波”的程序水坑。 我遇到的问题是,我听到一种无法解释的噪音 下面是第一个过程顶点着色器,我在其中计算顶点位置,稍后渲染到纹理,然后在第二个过程中使用 void main() { float damping = 0.5; vNormal = normal; // wave radius float timemod =

Glsl WebGL中工作项(着色器实例)内存的限制是什么?

我在我的WebGL顶点着色器中声明一个数组: 属性向量2位置 void main() { #define length 1024 float arr[length]; // use arr so that it doesn't get optimized away 这是可行的,但如果我将length增加到2048,那么gl.drawArrays什么也不做。没有错误-着色器编译、程序链接和过程gl.validateProgram。我猜我试图在堆栈上使用太多内存。有没有更好的编程方

Glsl WebGL着色器编译错误消息中的数字是什么意思?

比如说, ERROR: 0:137: 'blend2' : no matching overloaded function found ERROR: 0:137: '=' : dimension mismatch ERROR: 0:137: '=' : cannot convert from 'const mediump float' to 'highp 3-component vector of float' 0:137中的0是什么? 0:137中的137是什么? 为什么所有错误消息都以0开

Glsl 来自同一程序的多个输出纹理

我正在尝试学习如何利用gl.drawBuffer的功能在WebGL2中从同一个程序执行多个输出 我看了《OpenGL ES 3.0编程指南》一书,第11章列出了进行多输出所需的内容。但是,着色器源示例仅输出常量值非常简单 我想知道是否有人有更好的例子?或者,如果有人能解释纹理坐标发生了什么变化?在普通着色器代码中,我将使用它从输入中查找数据值并写出它们。现在面对多个布局,纹理坐标的变化如何对应每个布局?视口的尺寸会发生什么变化?这与哪个输出纹理相对应 以下是我理解它们的一些步骤: 创建颜色附件数

Glsl 如何避免碎片着色器中的额外计算

我正在尝试修复这个着色器。效果是围绕点位置的径向模糊,从阵列中的cpu传递。每个点的计算都很好,并生成de效果,但正如您在这张图片中看到的,对于每个循环,着色器都会保持生成采样,我不知道如何避免。我只想要阵列中每个点的模糊 #version 150 in vec2 varyingtexcoord; uniform sampler2DRect tex0; uniform int size; float exposure = 0.79; float decay = 0.9; float den

是否可以在WebGL GLSL ES 1.0中执行RGBA浮动和返回往返并读取像素?

我在尝试了大约一周的每一种可能的算法后提出了这个问题,并使用了stackoverflow之前的所有答案,但没有结果。所以,请善待并帮助GLSL学徒 我正在努力 将RGBA转换为浮点 进行一些计算 将浮点转换为RGBA 在GPU内部-初始RGBA通过Float32到Uint8的转换在javascript中定义 关键是在GPU中计算GIS距离和类似距离后,能够进行往返并读取浮点值,因为RGB的分辨率太低 我想通过gl.readPixels将结果读回javascript 我开始怀疑这种可能性的原因是:

glsl-pyOpenGL数组传递

我现在正在和glsl玩。为此,我需要将一个数组从opengl代码传递到gsls,然后gsls反过来计算数组中的新颜色。但不知怎么的,这对我不起作用。我没有得到整个数组,而是总是只使用第一个条目。 你能帮我说我做错了什么吗 import numpy as np \\... array = np.array([1.2,2.5,3.8,4.3,5.6, #....]) location = glGetUniformLocation(program,"arrayInShader") glUniform1

GLSL混合模式,创建附加透明度

我有一个小着色器,看起来像这样,有一个整洁的效果 uniform float beatScale; varying vec3 vPos; void main() { vec3 normPos = (normalize(vPos) + vec3(1, 1, 1)) / vec3(2, 2, 2); float alpha; if (normPos.y < beatScale - 0.1) { alpha = 0.0; } else if (normPos.y &

Glsl 光线跟踪立方体中的球体

我试图用光线追踪立方体中的球体。立方体由12个带法线的三角形构成 立方体具有单位坐标和单位法线。所以在它的局部空间内(介于-1和1之间),应该有一个半径为0.5的球体 所以我认为我应该在顶点着色器中计算光线:光线原点是插值的顶点位置,光线方向是顶点法线(或者它的相反方向,但我认为这不重要)。插值应该完成剩下的工作 然后在片段着色器中,我应该计算光线与球体的交点,如果存在交点,则更改片段的颜色 在立方体的正面和背面,结果似乎是正确的,但在左侧、右侧、顶部和底部,结果似乎来自错误的角度。我应该总是看

Glsl WebGL片段着色器可以有多大?

我正在WebGL片段着色器中进行光线跟踪,计划使用包含场景中对象的动态生成片段着色器。当我向场景中添加一个对象时,我将向片段着色器添加一些线,这样它可能会变得相当大。它能有多大,还能工作?它是否依赖于图形卡?您不希望创建大量碎片着色器,因为它们往往会很快耗尽性能。如果可能的话,您应该在CPU或顶点着色器中进行任何计算,但不是针对每个像素。安全的答案是,这取决于您的硬件和驱动程序,但实际上,它们可能非常大。JustSid所说的性能确实适用(更大的着色器==较慢的着色器),但听起来您的目标并不是60

Glsl 在int gl_VertexID中,使用three.js导致错误

我一直在使用gl_VertexID内置顶点索引时遇到问题,该索引是使用中的传递给Three.js的 我不知道为什么,因为文档中说它可以在所有版本的OpenGL中工作 我正在使用这个顶点着色器: uniform int freqData[64]; uniform int fftSize; in int gl_VertexID; void main() { vec3 norm = normalize(pos

Glsl 从webgl着色器生成的断开角度HLSL

我确定webgl着色器与角度有关,因为它只出现在Firefox或Chrome中的Windows上,如果我强制使用opengl(Chrome——使用gl=desktop),则不会发生 我已经展示了自定义着色器的角度生成HLSL。(要使hlsl转换在此JSFIDLE中工作,必须使用--enable privileged webgl extensions或其输出运行chrome) 因此,我有工作glsl和生成的hlsl编译,但没有做同样的事情。症状是,在窗口上,顶点显示在正确的初始位置,但不移动,尽管

是否可以将GLSL变量传递给javaScript。

我看到您可以将变量从javaScript传递到GLSL,但是否可以反过来呢。基本上,我有一个着色器,可以根据alpha通道将纹理转换为3种颜色:红色、绿色和蓝色 if (texture.a == 1.0) { gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0); } if (texture.a == 0.0) { gl_FragColor = vec4(0.0, 0.0, 1.0, 1.0); call0nce = 1; } if (t

GLSL纹理1d与纹理2d

我有一个非常简单的问题: 通过texture1D()访问采样器1d似乎比通过texture2D访问采样器2d慢。是否正确?与大多数性能问题一样,纹理提取操作的性能取决于平台

GLSL-禁用顶点着色器以进行颜色选择

我们正在学习GLSL中的颜色编码选择,以便分配任务。 我们还使用了一个顶点着色器,它可以更改要拾取的对象的颜色 给定一个布尔值,指示我们是否处于拾取模式(我们称之为selectionMode),如何确保着色器在尝试拾取对象时不会影响颜色 我正在考虑将布尔值传输到vertexShader.glsl文件,并根据布尔值更改对每个片段应用的操作。对吗?有没有更简单的方法 编辑 如果不是很清楚,我很抱歉。我会试着更好地解释我自己。问题归结为: 在main.cpp中,我们定义当用户右键单击屏幕时,我们检查

Glsl 使用顶点着色器手动修复镜头扭曲

需要使用顶点着色器手动修复镜头扭曲的帮助 我想添加镜头失真修复使用顶点着色器在这里可用 因为我没有使用UNITY引擎,所以我需要知道如何计算函数中的五个常量 float4x4 _Undistortion; float _MaxRadSq; float _NearClip; float4x4 _RealProjection; float4x4 _FixProjection; 如果有人能给我提供一些信息或解释,我将不胜感激 谢谢。以下是如何使用该着色器程序的示例。 我也不熟

Glsl 如何在WebGL(如sketchfab)中绘制全屏背景图像?

我知道如何绘制模型,但我不知道如何绘制全屏背景图像 我想我应该在相机的zfar处画。但我不知道如何计算它的大小 在sketchfab中,背景图像似乎可以实现css属性background size:cover。我注意到sketchfab没有通过css实现它 我真的很想知道如何实现这一点 如何以类似WebGL的样式绘制全屏背景图像背景尺寸:封面 创建一个绘制纹理的简单着色器,无需任何变换: 顶点着色器: precision mediump float; attribute vec2 inPos

防止webgl glsl自动内联功能?

在我的GLSL代码中,大型函数被多次调用 例如,在perlin noise函数中,我多次运行哈希函数 float perlinNoise (...) { ... float x0y0z0 = pcgUnit3(seedminX,seedminY,seedminZ); float x0y0z1 = pcgUnit3(seedminX,seedminY,seedmaxZ); float x0y1z0 = pcgUnit3(seedminX,seedmaxY,seedm

Glsl 为什么';Vulkan能认出我的SPIR-V着色器吗?

我正在编写一个简单的Vulkan应用程序来熟悉API。当我调用vkCreateGraphicsPipelines时,我的程序将“LLVM错误:无效SPIR-V幻数”打印到stderr并退出 SPIR-V规范(我认为第3章与此相关)指出,着色器模块被假定为一个字流,而不是字节流,我的SPIR-V文件是一个字节流 因此,我通过字节切换SPIR-V文件的前两个单词,它确实识别出了神奇的数字,但VKCreateGraphicsSpipelines退出时出现了错误代码-10000120000(VK_err

着色器太阳位置-glsl

我试图制作一个着色器,模拟太阳的位置和它在对象中反射的光 为了模拟太阳轨迹,我有一个计时器,灯光位置由以下公式定义: fvLightPosition.x=-cos(Time)*speed; fvLightPosition.y=sin(Time)*speed; fvLightPosition.z=100.0; 计时器是一个变量float Time0\u X 我几乎得到了正确的轨迹,除了它是颠倒的,而且看起来有点奇怪。有谁能告诉我如何以正确的方式模拟太阳的轨迹吗 我正在使用RenderMonkey

GLSL中的表达测序:增加后会发生什么

在C/C++中,有明确的规则定义“顺序点”/“排序在前”关系,例如以下表达式 int k = i-- * i; int p = j-- + --j; 调用未定义的行为 现在,我想知道在GLSL中管理这些表达式的规则是什么。我在OpenGL着色语言(4.40)规范中找不到任何定义类似于顺序点/在关系之前排序的概念的东西 在“5.9表达”一节中,它只说 预增量和预减量对其操作的表达式的内容加上或减去1或1.0,并且预增量或预减量表达式的值是该修改的结果值。增量后和减量后表达式对其操作的表达式的内容

Glsl Vulkan中均匀缓冲区中的动态大小数组

我最近重新编写了一些代码来使用OpenGL中的着色器存储缓冲区对象,将动态大小的数组发送到GLSL中,从而在绘制许多程序生成的对象时大大提高了性能 我得到的是几千点,对于每一点,我都会渲染一个程序生成的圆形广告牌。每个特征可以依次具有不同的颜色和半径,以及一些其他特征(表示为布尔或枚举) 我用这些位置填充一个向量,再加上半径和颜色。然后我上传它作为一个动态大小的着色器存储缓冲区对象。我创建了一个包含0个VBO的虚拟VAO,但调用了具有相同数量点的draw命令。 在着色器内部,然后使用gl_Ver

Glsl 仅在两种颜色重叠的地方将其连接在一起

我试图将鼠标触摸指示器显示为圆形 到目前为止,我能够生产一个垂直和水平的酒吧(如x和y触摸显示器),交叉形成一个十字形。我想在它们相交的地方形成一个圆 ... float touchX = u_TouchX; float touchY = u_ResolutionX - u_TouchY; float smoothTouchXS = smoothstep( u_ResolutionY - touchX - 300.0, u_ResolutionY- touchX, gl_FragCoord

如何确定WebGL和GLSL版本?

我可以打什么电话来确定当前浏览器中的WebGL版本支持(如1对2)和SL规范版本(如1.x对3.x) 您知道我必须使用GL api进行哪些调用吗?或SL中的宏来检查WebGL2 const gl = someCanvas.getContext("webgl2"); if (!gl) { .. no webgl2 } 要检查WebGL1 const gl = someCanvas.getContext("webgl"); if (!gl) { ... no webgl } GLSL没有什么可检

Glsl WebGL:在没有THREE.JS帮助的情况下添加镜面反射光

我正在做一些webgl编程的第一步。创建了一个简单的设置如下。设法添加了一些我自己的东西,尽管在添加灯光时遇到了困难,特别是镜面反射灯光。 正如我所设想的,其中大部分将在我的片段着色器中实现,可能还会在顶点着色器和灯光模块中添加一些内容。这就是我在下面提供的代码 顶点着色器: attribute vec3 position; attribute vec3 normal; attribute vec2 uv; uniform mat4 model; uniform mat4 view; unifo

Glsl webgl:绘制多个圆的最快方法

我现在画了数千个圆,实例化了许多三角形 或者,我可以简单地引用一个四边形2三角形,但使用距离函数在片段着色器中剪切出一个圆并丢弃 哪种方法更快绘制许多三角形是否比在片段着色器中进行的计算更昂贵?最快的方法可能取决于GPU和许多其他因素,如绘制圆的方式、2D、3D、是否混合圆、是否使用z缓冲区等。。。但一般来说,三角形越少,速度就越快,像素越少,速度就越快。所以,我们能做的就是尝试 首先,让我们只画没有混合纹理的四边形。首先,我似乎总是从WebGL获得不一致的性能,但在我在GPU上的测试中,我在这

GLSL几何体着色器:在整个网格上迭代

我的目标是根据顶点的顺序给它们着色 编辑:长时间目标:访问前面和后面的顶点以模拟重力行为 我使用了以下代码 #version 120 #extension GL_EXT_geometry_shader4 : enable void main( void ) { for( int i = 0 ; i < gl_VerticesIn ; i++ ) { gl_FrontColor = vec4(float(i)/float(gl_VerticesIn),0.0,0.0,

Glsl 在Three.js着色器上启用扩展

如何在Three.js着色器上启用扩展 到目前为止,我的代码是: 正在获取扩展名: var domElement = document.createElement( 'canvas' ); var gl = domElement.getContext('webgl') || domElement.getContext('experimental-webgl'); gl.getExtension('OES_standard_derivatives'); 在我的着色器上: fragmentShad

GLSL:屏幕外纹理采样

当明暗器到达基本体边缘且存在 color=texture2D(texture, vec2(texCoord.x+some_positive_value, texCoord.y)); 在它的某个地方?我的意思是,color在这样的调用中得到了什么值,透明黑色(0,0,0,0)?这样做似乎没有错误,但我真的需要问一下,这是否安全使用,是否有任何可见的工件可以期待。我正在制作一个模糊着色器,我看过的所有教程都使用此方法访问相邻像素。您可以定义发生了什么。你要的是 但模糊本身仍然存在问题。纹理外没有数

GLSL:如果任何统一未绑定,则强制错误

我将GLSL 1.0与WebGL 1.0和2.0一起使用,我只是花了几个小时来解决一个问题,我认为在事情开始之前应该抛出错误 我的片段着色器中有制服和采样器2D。我更改了一行代码,该更改没有导致任何输入纹理或数组绑定到着色器uniforms的位置。然而,程序运行时没有问题,但在读取这些uniforms时会产生零。例如,调用texture2D(MyTexture,vec2(x,y))不会抛出任何错误,只返回0 在渲染之前或渲染过程中,我是否可以将此作为错误强制执行?无法让WebGL自己检查错误。如

Glsl 在顶点着色器中应用Y旋转时,纹理坐标会移动

我试图从着色器中的两个三角形旋转平面。 一切都很顺利,只是我无法理解当我应用旋转时,UV坐标值会发生什么 如何以预期的结果执行此旋转 这看起来像是为每个三角形插值的独立UV坐标 让pid旋转定位; 设gl=canvas.getContext('webgl'); 让值=document.querySelector('span') let loader=new Image(); loader.crossOrigin=“匿名”; loader.src=”https://i.imgur.com/G

Glsl 对于着色语言,哪一种是主流?

现在有几种可用的着色语言,如GLSL、HLSL、CG,选择哪种语言来跟上潮流?HLSL特定于DirectX,而GLSL特定于OpenGL。无法在DirectX中编译GLSL着色器,也无法在OpenGL中编译HLSL着色器。如果您选择这两个选项中的一个,您将选择它,因为您选择了DirectX或OpenGL Cg是一种主要由nVidia创建的中间语言,可以编译为GLSL和HLSL。据我所见,Cg不像GLSL或HLSL那样受欢迎,但我并没有对其进行过太多的研究 所有3个都有丰富的指南和教程,如果您计划

GLSL正交投影

我已经使用眼睛方向(Phong,Blinn)实现了一些用于照明的着色器,我相信我在opengl中使用的是透视投影,我想知道应该如何使用正交投影使相同的着色器工作。 我还没有时间完全理解正交投影是如何工作的,但我相信没有相机,所以我不知道我是否还需要使用眼睛,如何计算它,或者我完全错了 干杯 除非你在投影后空间进行照明(这不太可能),否则无论投影如何,照明都是以同样的方式工作的。正交投影非常简单,很多2d或3d战术/战略游戏都使用这种类型的视图:从技术上讲,从来没有摄像头。并且从透视投影切换到正交

Glsl 理解片段

我刚刚开始使用碎片着色器,在完成一些简单的等离子效果后,我被卡住了。我已经知道可以检索片段的X、Y和Z,我正在考虑构建一个着色器,根据片段的Z为其着色 以下是我目前掌握的情况: void main() { float z = gl_FragCoord.z; float t = (sin(z) + 1) * 0.5; gl_FragColor = vec4(t, t, t, 1); } 问题是我用一个三角形来测试它,无论我如何旋转它,它都有相同的恒定颜色,所以我开始问自

Glsl “制造颗粒”;闪烁“;使用自定义着色器

我正在创造一个夜空,我希望我的粒子系统中的星星闪烁 我听说我可以使用噪波纹理来实现随机性,但我不确定该从哪里着手。我也不知道如何使闪烁顺利进行,即逐渐变亮然后变暗 现在我只是给每个顶点一个随机的rand属性,然后每隔200ms左右更改一个统一的twinkleRand。如果随机数匹配,则点会变大: if (rand == twinkleRand) { gl_PointSize = size * abs(sin(js_time) + rand/100.); } else { gl_Poi

Glsl 为什么HLSL有语义?

在HLSL中,我必须使用语义将信息从顶点着色器传递到片段着色器。在GLSL中,不需要语义。语义学的客观好处是什么 示例:GLSL 顶点着色器 varying vec4 foo varying vec4 bar; void main() { ... foo = ... bar = ... } varying vec4 foo varying vec4 bar; void main() { gl_FragColor = foo * bar; } struct VS_OUTPU

Glsl 使用从上到下的渐变倍增出射光

我正在尝试在片段着色器中产生效果。。。这就是我在没有效果的情况下得到的结果: 这是我用“渐变”乘以颜色得到的结果: float fragPosition = gl_FragCoord.y / screenSize.y; outgoingLight /= fragPosition; 所以我试着分割,但是颜色有点被光灼伤了 float fragPosition = gl_FragCoord.y / screenSize.y; outgoingLight /= fragPosition; 下面是我

Glsl 几何体着色器中的推动常量限制?

我有一个几何体着色器,具有以下推常量块: layout(push_constant) uniform Instance { mat4 VP; vec3 posCam; float radius; float curvature; } u_instance; 推送常量在管道布局中定义如下: uint32_t offset = 0; uint32_t size = 21 *sizeof(float); vk::PushConstantRange range {vk:

片段着色器glsl中的世界位置到屏幕位置

我有一个WebGL渲染器,我想在片段着色器中将随机世界坐标转换为屏幕坐标 这将允许我将计算的屏幕坐标与当前片段屏幕坐标进行比较 我相信我已经掌握了这样做所需的所有信息,只是不确定哪种方法是正确的 ... // available information: // uCanvasWidth (float) // uCanvasHeight (float) // modelMatrix (mat4) // modelViewMatrix (mat4) // project

Glsl 绑定多个统一缓冲区对象

使用WebGL 2,我们现在可以使用统一缓冲区对象 它们看起来是一个不错的主意,不必为每个程序都附加通用的制服(比如投影矩阵和视图矩阵,它们对渲染的每个对象都是通用的) 我创建了一个助手类,每当我想绑定一个统一的缓冲区对象时,我都会调用它 class UniformBuffer { constructor(gl, data, boundLocation = 0) { this.boundLocation = boundLocation; this.dat

Glsl 在片段着色器中迭代大量数据

我试图在webgl中的片段着色器中迭代大量数据。我想向它传递大量数据,然后在片段着色器的每个过程上迭代。不过,我在这方面遇到了一些问题。我的想法如下: 1.将制服中的数据传递给frag着色器,但我不能以这种方式发送太多数据。 2.使用缓冲区将数据发送到vert着色器,就像我将vert发送到vert着色器一样,然后使用变量将数据发送到frag着色器。不幸的是,这似乎涉及一些问题。(a) 改变向量之间的插值,我认为这会导致代码出现问题(尽管这可能是不可避免的)(b)更重要的是,我不知道如何迭代传递给

Glsl 无符号字节

我在GL_UNSIGNED_字节r,g,b中有颜色,但我想使用alpha通道来放置一个自定义值,该值将在像素着色器中使用,以对几何体进行不同的着色。 有两个可能的值0和127,现在我的问题是,当我在顶点着色器中执行此操作时: [顶点] varying float factor; factor = gl_Color.w 似乎系数始终为1.0,因为如果我这样做: [片段] varying float factor; factor = factor; gl_FragColor = vec4(f

GLSL遮罩之间的深色接缝

纹理如下: gl_FragColor=texture2D(my_main_texture, vUv); gl_FragColor= mix(gl_FragColor,texture2D(texture[1], 32.0*vUv),texture2D(mask[0], vUv).r); gl_FragColor= mix(gl_FragColor,texture2D(texture[2], 32.0*vUv),texture2D(mask[0], vUv).b); 例如,使用遮罩: 但是由于

GLSL着色器仅绘制黑屏LWJGL

我对着色器非常陌生,我有一些GLSL代码需要正确编译(没有任何编译器错误),出于某种原因,我一直得到一个黑屏。我正在使用LWJGL。当我试图渲染一个三角形时,我一直会得到一个黑屏,即使根据我传递给片段着色器的颜色,它应该是白色的。我已经发布了下面的代码片段,希望有足够的内容来找出问题所在 片段着色器源代码 顶点着色器源代码 着色器读取器代码 着色器设置代码 启用和禁用着色器代码 渲染方法 多亏了jozxyqk,问题已经解决了。我忘记初始化片段着色器变量 fragShader = GL20.glC

Glsl 参数曲线绘图仪

我正在尝试在GLSL中的片段着色器上实现参数曲线绘图仪 通过迭代参数并为每个计算位置绘制一个圆,我成功地创建了一个基本的参数 您可以找到(工作和注释)代码 以下是我的问题: 我想画一条线。根据我的理解,我看到了两种不同的方法: 通过计算每个像素与循环内计算位置之间的距离,将计算值累积到浮点变量中,然后使用阶跃函数绘制曲线 我试着这样做,似乎我只计算了一个t位置的距离: #define PI 3.14 void mainImage( out vec4 fragColor, in vec2 fr

Glsl 穹顶图像投影

我正在尝试创建一个GLSL片段着色器,将图像投影到圆顶。输入将是一个二维纹理、一个仰角和一个方位角 结果应该类似于下面的gif 标高介于0和90度之间(在本gif中,标高介于-90和90度之间) 方位角在0到360度之间 现在,我的代码如下所示: #ifdef GL_ES precision mediump float; #endif uniform float u_time; uniform vec2 u_resolution; uniform sampler2D u_texture_0

Glsl WebGL中的体绘制

我有一个科学数据的3D数组数据集,将使用WebGL进行渲染。这是我编写的代码,也是我迄今为止取得的成果 我对输出画布上发生的两件事一无所知: gl.clearcolor(0.4,0.4,0.5,1); 屏幕渲染输出时不工作 有时在drawScene调用中,代码会抛出错误和警告。我相信这一警告是针对该错误的,但我无法调试导致该错误的原因: 警告: WebGL:无效的_操作:texImage3D:ArrayBufferView不够大,无法满足请求 错误:texImage3D(纹理3D{WebG

上一页 1 2  3   4   5   6    7   8   9  ... 下一页 最后一页 共 17 页