标签: fragment-shader

我无法弄清楚,如何使用OpenGL ES 2.0类似于OpenGL ES 1.1的结果.我想实际使用Sampler2D(将我的纹理与Alpha通道混合到Framebuffer)并设置Color.纹理应该用颜色绘制 - 就像在OpenGL ES 1.1中我的FragmentShader看起来像这样:

varying lowp vec4 colorVarying;
varying mediump vec2 texcoordVarying;
uniform sampler2D texture;

void main(){
    gl_FragColor = texture2D(texture, texcoordVarying) + colorVarying;
}

但是"+ colorVarying"部分用黑色破坏了我的alpha通道(因为我还添加了colorVarying,如果AlphaValue为0)并且产生了奇怪的渐变效果......纹理和颜色通道如何在固定功能管道中组合？我对glColor4f的替换是:

void gl2Color4f(GLfloat r, GLfloat g, GLfloat b, GLfloat a){
    const GLfloat pointer[] = {r, g, b, a};
    glVertexAttribPointer(ATTRIB_COLOR, 2, GL_FLOAT, 0, 0, pointer);
    glEnableVertexAttribArray(ATTRIB_COLOR);
}

我正在使用glBlendFunc(GL_SRC_ALPHA,GL_ONE_MINUS_SRC_ALPHA); 如果这是某种相关的......

对于颜色1.0,0.0,1.0,1.0这里是我现在得到的:

我想得到:

一些想法来实现这一目标？任何帮助,将不胜感激.

我有这个:

    float xExponential = pow(xPingPong, 5);

并且不起作用,声称:

错误:0:53:调用函数'pow'没有匹配的重载

我做错了吗？使用OpenGL ES 2.0开发iOS版.

我在iOS上使用SceneKit,我想要渲染为线框的几何体.所以基本上我只想绘制线条,所以没有纹理.

我发现我可以使用shaderModifiersused 的属性SCNMaterial来实现这一点.着色器修改器的示例:

material.shaderModifiers = [
    SCNShaderModifierEntryPointFragment: "_output.color.rgb = vec3(1.0) - _output.color.rgb;"
]

这个例子显然只是反转输出颜色.我对用于着色器片段的'GLSL'语言一无所知.

任何人都可以告诉我,我应该使用哪些代码作为着色器片段,仅在边缘附近绘制,以使几何看起来像线框？

或者可能还有一种将几何体渲染为线框的方法.我很乐意听到它.

我正在尝试从图形纸中实现算法,并且算法的一部分将已知半径的球体渲染到缓冲区.他们说他们通过计算顶点着色器中的位置和大小来渲染球体,然后在片段着色器中进行适当的着色.

有没有猜到他们实际上是怎么做到的？位置和半径在世界坐标中是已知的,投影是透视的.这是否意味着球体将被投影为圆圈？

我的场景中有一个3D对象,该对象的片段着色器接收到与屏幕大小相同的纹理.我想从当前片段中获取坐标,并在同一位置找到图像上的颜色信息.这可能吗？有人能指出我正确的方向吗？

我必须做一个功课,我尝试实现lookAt功能.我试过很多方面,但我得到的唯一结果是蓝屏.我的程序的其余部分工作很大,事实上,如果我使用glm :: lookAt一切都很好.这是我的代码:

mat4 Transform::lookAt(const vec3 &eye, const vec3 &center, const vec3 &up) 
{
    vec3 w(glm::normalize(eye - center)) ;
        vec3 u(glm::normalize(glm::cross(up, w)));
        vec3 v(glm::cross(w, u)) ;
    mat4 ret = mat4 (
        vec4 (u.x,v.x,w.x,0),
            vec4 (u.y,v.y,w.y,0),
            vec4 (u.z,v.z,w.z,0),
        vec4 (-u.x*eye.x-u.y*eye.y-u.z*eye.z,
             -v.x*eye.x-v.y*eye.y-v.z*eye.z,
             -w.x*eye.x-w.y*eye.y-w.z*eye.z,
             1)
    );
  return ret;

现在我正在尝试将一个int数组传递给片段着色器,并通过统一数组执行此操作:

uniform int myArray[300];

并在着色器外面填充它glUniform1iv.

不幸的是,大于~400失败的统一阵列.我知道我可以使用"统一缓冲区",但似乎无法找到将大型1D数组传递到带缓冲区或其他方式的片段着色器的完整示例.

谁能提供这样的例子？

我用我的像素化iOS应用程序编写了一个用于Unity3D的GLSL着色器.它有两个问题:

1)效果并不总是与月亮保持一致,2)灯光看起来并不像素化.

我会解释一下.着色器用于在月亮位于其后面时对前景对象产生照明效果.我有一个精灵,通常显示为全黑(如轮廓),但当月亮物体足够接近它时,它会显示纹理的细节,如下所示:

实际的精灵(没有着色器)看起来像这样:

我这样做效果的原因是我可以有一个只有一个纹理的光照贴图.但是,它有两个问题:

1)当我靠近屏幕边缘时,光效并不完全跟随月亮.我不确定这是否与我对TEXCOORD1变量的错误使用情况有关.我做了一个覆盖整个屏幕的精灵,这样你就可以看到它不跟随月亮.这是我的测试场景中关于效果的问题的图片.有一个带有黑色条纹和alpha的全屏精灵,可以随时显示效果的确切位置.我想摆脱这种不同寻常,因为它使得照明看起来不切实际.

2)引起的照明效果非常明显 - 我想,如果每个像素都单独点亮,就像SpriteLamp一样.我知道它与着色器中的片段坐标的舍入有关,但由于我从未真正知道我的着色器中变量的值是什么,我似乎无法使其正常工作.

我可以绕着地面转动距离,但是我得到了这个,这是服从月球的距离,但不遵守原始精灵中的像素.有像素化,但如果你理解我的意思,我们最终会得到这个奇怪的曲线,只有一个像素.

我正在寻找的更像是这样.看看原始纹理的各个像素是如何点亮的？

这是着色器本身的链接:http://pastebin.com/0zbqrP57.它主要是默认的Unity精灵着色器,但是在SampleSpriteTexture函数的末尾添加了一些代码.

这是一个unitypackage的链接,您可以使用它来查看正在运行的着色器.只需在场景播放时尝试移动月亮.

https://drive.google.com/open?id=0BxCQjUHiAAQWZGpPZ3R2SExTcXc

我的问题:您对如何解决这些问题或解决方案有什么建议吗？

我已经创建了一个自定义着色器,可以使用具有4种不同纹理的BlendMap,但我无法使用阴影/闪电效果来处理它.

我在这里错过了什么？或者是否有其他方法可以实现相同的功能？

下面的网格创建方法显示所有纹理正确混合.

// Creates the ground
function CreateGround() {
    var uniforms = THREE.UniformsUtils.merge([
        THREE.UniformsLib["lights"],
        THREE.UniformsLib["shadowmap"],
    {
        TextureBackground: { type: "t", value: null },
        TextureR: { type: "t", value: null },
        TextureG: { type: "t", value: null },
        TextureB: { type: "t", value: null },
        TextureBlendMap: { type: "t", value: null }
    }]);

    var shaderMaterial;
    try {
        shaderMaterial = new THREE.ShaderMaterial({
            lights: true,
            uniforms: uniforms,
            vertexShader: BlendMapVertexShader,
            fragmentShader: BlendMapFragmentShader
        });
    } catch (e) {
        alert("Error 'CreateGround' : GPU Shader couldn't …

在互联网上的许多示例（例如webglfundamentals或webgl-bolerplate）中，作者使用两个三角形来覆盖全屏并为画布上的每个像素调用像素着色器。

var canvas, gl, buffer, 
			    vertex_shader, fragment_shader, 
			    currentProgram, vertex_position,
			    timeLocation, resolutionLocation,
			    parameters = {  start_time  : new Date().getTime(), 
			                    time        : 0, 
			                    screenWidth : 0, 
			                    screenHeight: 0 };
			init();
			animate();
 
			function init() {
				vertex_shader = document.getElementById('vs').textContent;
				fragment_shader = document.getElementById('fs').textContent;
				canvas = document.querySelector( 'canvas' );
				try {
					gl = canvas.getContext( 'experimental-webgl' );
				} catch( error ) { }
				if ( !gl ) 
					throw "cannot create webgl context";

				// Create Vertex buffer (2 triangles)
				buffer = gl.createBuffer();
				gl.bindBuffer( gl.ARRAY_BUFFER, …