2
デバイスがOES_texture_floatをサポートする場合、FLOATテクスチャは32ビット浮動小数点値according to the specとして格納する必要があります。ただし、一部のデバイスでは、テクスチャがハーフ・フロートとして保存されているように見えます。WebGL：OES_texture_floatは32ビット浮動小数点型の記憶装置を必要としますか？一部のデバイスは半浮動小数点としてしか格納されないようです。
次のコードは、値Piを含む1x1浮動小数点数のテクスチャを作成します。フラグメントシェーダは、テクスチャをサンプリングし、その結果をPiの32ビット浮動小数点浮動（すなわち、ハーフフロート）表現と比較する。シェーダは32ビットでは緑、16ビットでは赤を返します。
<!DOCTYPE html>
<html lang="en">
<head></head>
<body>
<canvas width="100" height="100"></canvas>
<script>
"use strict";
const canvas = document.getElementsByTagName("canvas")[0];
const gl = canvas.getContext("webgl");
if (!gl.getExtension("OES_texture_float")) {
throw new Error("float textures not supported");
}
const program = gl.createProgram();
function addShader(type, source) {
const shader = gl.createShader(type);
gl.shaderSource(shader, source);
gl.compileShader(shader);
gl.attachShader(program, shader);
}
addShader(gl.VERTEX_SHADER, `
precision highp float;
attribute vec2 a_Position;
attribute vec2 a_TexCoord;
varying vec2 v_TexCoord;
void main() {
gl_Position = vec4(a_Position, 0.0, 1.0);
v_TexCoord = a_TexCoord;
}
`);
addShader(gl.FRAGMENT_SHADER, `
precision highp float;
uniform sampler2D u_Tex;
void main() {
float v = texture2D(u_Tex, vec2(0.5)).r;
gl_FragColor = vec4(
float(v == 3.140625), // Pi as float16
float(v == 3.1415927), // Pi as float32
0.0,
1.0);
}
`);
gl.linkProgram(program);
gl.useProgram(program);
function createAttrib(name, data) {
gl.bindBuffer(gl.ARRAY_BUFFER, gl.createBuffer());
gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);
const loc = gl.getAttribLocation(program, name);
gl.enableVertexAttribArray(loc);
gl.vertexAttribPointer(loc, 2, gl.FLOAT, false, 0, 0);
}
createAttrib("a_Position", new Float32Array([-1, -1, 1, -1, -1, 1, -1, 1, 1, -1, 1, 1]));
createAttrib("a_TexCoord", new Float32Array([0, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1, 1]));
gl.bindTexture(gl.TEXTURE_2D, gl.createTexture());
gl.texImage2D(gl.TEXTURE_2D, 0, gl.LUMINANCE, 1, 1, 0, gl.LUMINANCE, gl.FLOAT, new Float32Array([Math.PI]));
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameterf(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.uniform1i(gl.getUniformLocation(program, "u_Tex"), 0);
gl.drawArrays(gl.TRIANGLES, 0, 6);
</script>
</body>
</html>
コードは、ここで実行することができます：https://jsfiddle.net/a6bfL168/2/
iPhone 5とiPad Airで試験した場合、両方が緑色に表示されます。 iPhone 6とiPhone SEでテストすると、両方とも赤色になります。
このテストを100000などの別の値で繰り返す場合、サンプリングされたテクセルの値は65504で、ハーフ・フロートの表現可能な最大整数です。テクスチャがハーフ・フロートとして保存（またはサンプリング）されている証拠。
これはバグですか？これはGPUのハードウェアの制限ですか？私はmisreading the specですか？仕様の意図は、フロートテクスチャを受け入れるだけでなく、完全精度よりも格納することです。
イェーイ！それはそれを修正した。私は上の 'precision highp float;'ステートメントも 'sampler2D'を対象としていたと思っていましたが、今ではそれを指摘しています。ありがとう！ – cambecc