- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在为何时以及如何使用 activeTexture、bindtexture 和 gl.uniform1i('TextureLocation', 'texture'), Int) 函数而苦苦挣扎。
然而,到目前为止我所有的东西都有效,但现在我的基本理解似乎开始成为一个问题。
我正在尝试在一个着色器中使用立方体贴图和纹理贴图。为了测试,我目前正在使用此着色器绘制两个对象,并尝试使用不同的纹理贴图为每个对象着色。如果我只使用纹理贴图或立方体贴图,程序运行良好,所以我假设两者都正确加载。现在这是我的简化片段着色器:
precision mediump float;
uniform int Switch; //switch between sphere and background
// normal
varying vec3 vNormal;
// texture
uniform mat4 TexMatrix;
uniform samplerCube texMap;
void main() {
vec4 FragColor;
//draw square
if( Switch == 0 ) {
vec3 fTexCoord = vec4(vNormal,1.0)).xyz;
FragColor = textureCube(texMap, fTexCoord);
}
//draw sphere
else if( Switch == 1 ) {
// spherical coord -> kartesian coord
float PI = 3.141592653;
vec2 bTexCoord = vec2(2.0*atan((length(vec2(vNormal.x,vNormal.y)) - vNormal.x)/vNormal.y)/(2.0*PI),acos(vNormal.z)/PI);
FragColor = texture2D(bumpMap, bTexCoord);
}
gl_FragColor = FragColor;
}
function initBumpMap(img){
gl.Texture = gl.createTexture();
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, gl.Texture);
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, gl.RGB, gl.UNSIGNED_BYTE, img);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
//gl.generateMipmap(gl.TEXTURE_2D);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT); // set the texture to repreat for values of (s,t) outside of [0,1]
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
gl.uniform1i(gl.getUniformLocation(program, "bumpMap"), 0); //link texture to sampler
}
function initCubeMap(images){
gl.CubeMap = gl.createTexture();
gl.activeTexture(gl.TEXTURE1);
gl.bindTexture(gl.TEXTURE_CUBE_MAP, gl.CubeMap);
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
//put images on cubemap
gl.texImage2D(gl.TEXTURE_CUBE_MAP_POSITIVE_Z ,0,gl.RGB,gl.RGB,gl.UNSIGNED_BYTE, images[0]);
gl.texImage2D(gl.TEXTURE_CUBE_MAP_NEGATIVE_Y ,0,gl.RGB,gl.RGB,gl.UNSIGNED_BYTE, images[1]);
gl.texImage2D(gl.TEXTURE_CUBE_MAP_NEGATIVE_Z ,0,gl.RGB,gl.RGB,gl.UNSIGNED_BYTE, images[2]);
gl.texImage2D(gl.TEXTURE_CUBE_MAP_POSITIVE_X ,0,gl.RGB,gl.RGB,gl.UNSIGNED_BYTE, images[3]);
gl.texImage2D(gl.TEXTURE_CUBE_MAP_NEGATIVE_X ,0,gl.RGB,gl.RGB,gl.UNSIGNED_BYTE, images[4]);
gl.texImage2D(gl.TEXTURE_CUBE_MAP_POSITIVE_Y ,0,gl.RGB,gl.RGB,gl.UNSIGNED_BYTE, images[5]);
gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MIN_FILTER,gl.NEAREST);
gl.uniform1i(gl.getUniformLocation(program, "texMap"), 1); //link texture to sampler
}
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, gl.Texture);
gl.activeTexture(gl.TEXTURE1);
gl.bindTexture(gl.TEXTURE_CUBE_MAP, gl.CubeMap);
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
//draw square
...bind point and enable stuff for the square...
gl.uniform1i(gl.getUniformLocation(program,'Switch'),1); //switch to use bumpmap
gl.bindTexture(gl.TEXTURE_2D, gl.Texture0);
gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
// draw sphere
...bind point and enable stuff for the sphere...
gl.uniform1i(gl.getUniformLocation(program,'Switch'),0); //switch to cube map
gl.bindTexture(gl.TEXTURE_CUBE_MAP, gl.CubeMap);
for( var i=0; i < vertices.length; i+=3){
gl.drawArrays(gl.TRIANGLES, i, 3);
}
最佳答案
显然我需要总是设置
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, gl.Texture);
gl.uniform1i(gl.getUniformLocation(program, "bumpMap"), 0);
gl.activeTexture(gl.TEXTURE1);
gl.bindTexture(gl.TEXTURE_CUBE_MAP, gl.CubeMap);
gl.uniform1i(gl.getUniformLocation(program, "texMap"), 1);
在绘制之前,然后它起作用了! :D
关于glsl - 在 WebGL 的一个着色器中使用 sampler2D 和 samplerCube,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34579813/
我在 AMD GPU 上测试程序时遇到了问题。在 Nvidia 和 Intel HD Graphics 上测试时,一切正常。在 AMD 上,问题正是在尝试绑定(bind)纹理时出现的。由于这个问题,着
我在 glsl 中有以下代码: // snippet 1, works well uniform vec4 uDiffuse; uniform sampler2D uDiffuseMap; unifo
我正在为何时以及如何使用 activeTexture、bindtexture 和 gl.uniform1i('TextureLocation', 'texture'), Int) 函数而苦苦挣扎。 然
这个问题不太可能帮助任何 future 的访问者;它只与一个小的地理区域、一个特定的时间点或一个非常狭窄的情况有关,这些情况并不普遍适用于互联网的全局受众。为了帮助使这个问题更广泛地适用,visit
我是一名优秀的程序员,十分优秀!