Как получить текстуры на мобильных устройствах (Android 6.0.1)

У меня есть это приложение webgl (просмотрщик 360 панорам), которое оборачивает прямоугольное изображение поверх сферы, помещая камеру в центр этой сферы, чтобы имитировать иллюзию реального мира.

Он работает в настольных браузерах (Chrome, FF), но не работает на Android 6.0.1 Google Chrome (в результате черный экран) и работает на встроенном браузере устройства. Тем не менее, без применения текстуры все работает правильно везде, и я вижу простые примитивы (сферы, кубы, пирамиды и т. Д.).

часть кода, которая создает такое представление:

function load360View(r, center, lats, longs, textureImage) {
    let vertexBuffer = gl.createBuffer(),
        uvBuffer = gl.createBuffer(),
        indexBuffer = gl.createBuffer(),
        texture = gl.createTexture(),
        vertices = [],
        texCoords = [],
        indices = [];   

        let theta, phi, x, y, z;
        for (let i = 0; i <= lats; i++) {               
            theta = i * Math.PI/lats;
            for (let j = 0; j <= longs; j++) {
                phi = j * 2 * Math.PI/longs;                    
                x = Math.sin(theta) * Math.cos(phi);
                y = Math.cos(theta);
                z = Math.sin(theta) * Math.sin(phi);                    
                vertices.push(r * x + center.x);
                vertices.push(r * y + center.y);
                vertices.push(r * z + center.z);
                texCoords.push( (j / longs) );
                texCoords.push( (i / lats) );
            }               
        }
        for (let i = 0; i < lats; i++) {                
            for (let j = 0; j < longs; j++) {
                let first = (i * (longs + 1)) + j;
                let second = first + longs + 1;

                indices.push(first);
                indices.push(second);
                indices.push(first + 1);

                indices.push(second);
                indices.push(second + 1);
                indices.push(first + 1);                    
            }
        }

        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);      
        gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);

        gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
        gl.enableVertexAttribArray(vPositionLoc);
        gl.vertexAttribPointer(vPositionLoc, 3, gl.FLOAT, false, 0, 0);                 
        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);

        gl.bindBuffer(gl.ARRAY_BUFFER, uvBuffer);
        gl.enableVertexAttribArray(vtexCoordLoc);
        gl.vertexAttribPointer(vtexCoordLoc, 2, gl.FLOAT, false, 0, 0);         
        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(texCoords), gl.STATIC_DRAW);


        gl.bindTexture(gl.TEXTURE_2D, texture);
        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, textureImage);


        if (isPowerOf2(textureImage.width) && isPowerOf2(textureImage.height)) {
            gl.generateMipmap(gl.TEXTURE_2D);
        } else {
            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
            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);
        }           

    return {
        vertexBuffer: vertexBuffer,
        indexBuffer: indexBuffer,
        uvBuffer: uvBuffer,
        indices: indices,
        texture : texture
    }
}

Это ошибка браузера Chrome для Android или она связана с самим приложением, что означает, что что-то должно быть изменено?

п.с.

Я также получаю эту ошибку на рабочем столе Firefox (не ночная сборка):

Ошибка: WebGL: texImage2D: Выбранный формат / тип повлек за собой дорогостоящее переформатирование: 0x1908/0x1401

0 ответов

Другие вопросы по тегам