ошибка: предупреждение WebGL: texImage2D: требуемая загрузка требует больше данных, чем доступно: (при загрузке текстуры с данными треугольной сетки и нормалями) - PullRequest
0 голосов
/ 13 февраля 2019

Возможно, я запутался, когда загружаю 2 текстуры.я получаю эту ошибку: «Предупреждение WebGL: texImage2D: для требуемой загрузки требуется больше данных, чем доступно: (необходимо 0 строк плюс 246 пикселей, доступно 0 строк плюс 244 пикселя)»

и ничего на экране.У меня есть 2 текстуры, одна с вершинами сетки, а другая с нормалями.я опубликую способ, которым я пытаюсь загрузить текстуры:

const uLSr = gl.getUniformLocation(P, 'uMeshData');
const uNormData = gl.getUniformLocation(P, 'uNormData');

const texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture);

 const verts = [
         ...
         4.910892,0.000000,4.910892,
        -4.910892,0.000000,-4.910892,
        -4.910892,0.000000,4.910892,
        4.910892,0.000000,4.910892,
        4.910892,0.000000,-4.910892,
        ...
];

const vertsNorm = [
        ...
        0.0000,-1.0000,0.0000,
        0.4253,-0.8506,0.3090,
        -0.1625,-0.8506,0.5000,
        0.7236,-0.4472,0.5257,
        0.4253,-0.8506,0.3090,
        ...
];

const meshVerts = new Float32Array(verts);
    const vertsLenght = meshVerts.length / 3;
    gl.uniform1i(uLvertices, vertsLenght);

gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB32F, vertsLenght, 1, 0, gl.RGB, gl.FLOAT, meshVerts);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);


const textureNorm = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, textureNorm);

const meshNorm = new Float32Array(vertsNorm);
gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
//vertsLength is the same cause normal and vertices have the same length
//foreachone normal there is one single vertex
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB32F, vertsLenght, 1, 0, gl.RGB, gl.FLOAT, meshNorm);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);

, а затем в функции рисования я вызываю их так:

gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, texture);
gl.activeTexture(gl.TEXTURE1);
gl.bindTexture(gl.TEXTURE_2D, textureNorm);
gl.uniform1i(uLSr, 0);
gl.uniform1i(uNormData, 1);

и затем внутри шейдера я пытаюсьраспакуйте их так:

for (int i = 6; i < vertsCount; i += 3) {

    a = texelFetch(uMeshData, ivec2(i, 0), 0);
    b = texelFetchOffset(uMeshData, ivec2(i, 0), 0, ivec2(1, 0));
    c = texelFetchOffset(uMeshData, ivec2(i, 0), 0, ivec2(2, 0));

    aN = texelFetch(uNormData, ivec2(i, 0), 0);
    bN = texelFetchOffset(uNormData, ivec2(i, 0), 0, ivec2(1, 0));
    cN = texelFetchOffset(uNormData, ivec2(i, 0), 0, ivec2(2, 0));

    triangleNormal = (aN.xyz + bN.xyz + cN.xyz) / 3.;

    vec3 uvt;
    vec3 intersect;
    float z;
    bool isHit = hitTriangleSecond(R_.orig, R_.dir, a.xyz, b.xyz, c.xyz, uvt, triangleNormal, intersect, z);;
    if (isHit) {

        if (z<mindist && z > 0.001) {
            hitPos1 = intersect;

            mindist = z;
            weHitSomething = true;
            material.type = DIEL;
            material.albedo = vec3(.8, .3, .4);
            normal = triangleNormal;
            hitPos = hitPos1;            
        }
    }      
} 

, если я прокомментирую строку, в которой вычисляю нормаль поверхности, а затем заменит ее на нормаль, полученную из текстуры, я получил белую страницу.Поэтому я предполагаю, что я сделал что-то не так с загрузкой текстур.Или это в функции HitTriandglSecond, где я вычисляю нормаль лица треугольника?

и ниже я публикую ссылку на jsfiddle с минимальным примером (его длинная причина, я помещаю вершины и нормали плоскости исфера треугольников): ссылка примера jsfiddle

1 Ответ

0 голосов
/ 13 февраля 2019
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB32F, vertsLenght, 1, 0, gl.RGB, gl.FLOAT, meshNorm);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);

я нашел ошибку.

это была переменная vertsLength, я создал новую переменную для второй текстуры, так как повторное использование vertsLength, похоже, не сработало.

const normLength = meshNorm.length /3;
gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB32F, normLength, 1, 0, gl.RGB, gl.FLOAT, meshNorm);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
...