WebGL2 texture_lodGLSL片元着色器 TEXTURE_MIN_LOD/TEXTURE_MAX_LOD

GLSL片元着色器

#version 300 es
#define FRAG_COLOR_LOCATION 0

precision highp float;
precision highp int;

uniform sampler2D diffuse;
uniform float lodBias;

in vec2 v_st;

layout(location = FRAG_COLOR_LOCATION) out vec4 color;

void main()
{
    color = texture(diffuse, v_st, lodBias);
}

TEXTURE_MIN_LOD/TEXTURE_MAX_LOD

var lodBiasArray = [0.0, 0.0, 0.0, 0.0];
lodBiasArray[Corners.BOTTOM_LEFT] = 3.5;
lodBiasArray[Corners.BOTTOM_RIGHT] = 4.0;

shader lodBias 取值为0

gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
textures[Corners.TOP_LEFT] = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, textures[Corners.TOP_LEFT]); //0.0
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
gl.generateMipmap(gl.TEXTURE_2D);

shader lodBias 取值为3.0

textures[Corners.TOP_RIGHT] = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, textures[Corners.TOP_RIGHT]); //0.0
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_MIN_LOD, 3.0); //3.0
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_MAX_LOD, 3.0);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
gl.generateMipmap(gl.TEXTURE_2D);

shader lodBias 取值为3.5

textures[Corners.BOTTOM_LEFT] = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, textures[Corners.BOTTOM_LEFT]); //3.5
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_MIN_LOD, 0.0); //0-10
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_MAX_LOD, 10.0);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
gl.generateMipmap(gl.TEXTURE_2D);

shader lodBias 取值为4.0

textures[Corners.BOTTOM_RIGHT] = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, textures[Corners.BOTTOM_RIGHT]); //4.0
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_MIN_LOD, 0.0); //0-10
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_MAX_LOD, 10.0);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
gl.generateMipmap(gl.TEXTURE_2D);