Можно ли рисовать несколько текстур в одном вызове gl.drawElements()?

Question

В WebGL можно ли рисовать несколько текстур в одном вызове gl.drawElements()? Если да, то как?

Что такое gl.TEXTURE0? gl.TEXTURE31 Я имею в виду, что такое сценарий, когда используется более одного блока текстуры?

Я пытаюсь нарисовать куб с 6 различными текстурами для каждой стороны в одном вызове drawElements(). Является ли это возможным? Да, как?

Answer 1

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

http://www.clockworkcoders.com/oglsl/tutorial8.htm

за то, что вы говорите (совершенно отдельных текстур) это может сделать больше смысла использовать текстуру атлас (особенно на встраиваемых системах). смотри раздел 3.9.4 здесь:

http://imgtec.eetrend.com/sites/imgtec.eetrend.com/files/download/201402/1462-2116-powervrdexingnengjianyi.pdf

Answer 2

Чтобы использовать несколько текстур вы связать различные текстуры с различными текстурными блоками и ссылаться на них с несколькими пробниками в ваших шейдерах

Вот шейдер, который использует 2 текстуры

uniform sampler2D u_texture1; 
uniform sampler2D u_texture2; 
varying vec2 vtexcoords1; 
varying vec2 vtexcoords2; 

void main() { 
    vec4 color1 = texture2D(u_texture1, v_texcoords1); 
    vec4 color2 = texture2D(u_texture2, v_texcoords2); 
    gl_FragColor = color1 * color2; // multiply the colors. 
} 

затем нужно связать 2 текстуры 2 текстурных блоков

// bind a texture to texture unit0 
gl.activeTexture(gl.TEXTURE0); 
gl.bindTexture(gl.TEXTURE_2D, someTexture); 

// bind a texture to texture unit1 
gl.activeTexture(gl.TEXTURE1); 
gl.bindTexture(gl.TEXTURE_2D, someOtherTexture); 

И вы должны сказать шейдер, текстурные блоки использовать

// -- at init time 
var texture1location = gl.getUniformLocation(program, "u_texture1"); 
var texture2location = gl.getUniformLocation(program, "u_texture2"); 

// -- at draw time 

// tell the shader to use texture units 0 and 1 
gl.uniform1i(texture1location, 0); 
gl.uniform1i(texture2location, 1); 

Но, это вообще не то, как текстура куба с 6 изображений. Большинство игр текстурируют куб с 6 изображениями, помещая все 6 изображений в одну текстуру (see end of this article). Большинство программ 3D-моделирования помещают 6 изображений в куб, не делая куба, но вместо этого делают 6 плоскостей, каждая из которых выравнивает, чтобы сделать грани куба. Другими словами, 6 отдельных плоскостных моделей вместо одной модели куба. Таким образом, он остается простым. Вы просто используете шейдер, который рисует 1 текстуру и использует другую текстуру при рисовании каждой плоскости куба.

В игровом стиле корпус, 1 куб + 1 текстура с 6 изображениями. Это быстро, потому что есть только один призыв к розыгрышу. В пакете 3D-моделирования это 6 плоскостей с 1 текстурой каждый (всего 6), поэтому 6 обратных вызовов, но они гибкие, так как каждая плоскость может использовать другое изображение без необходимости создавать новую текстуру со всеми 6 изображениями в ней.

Какой способ вы выбираете, зависит от вас.