Как четверть холста webGL скрещены?

Question

Я новичок в WebGL.

Я могу сделать холст, и я могу нарисовать куб на холсте.

Это пример рисования куба и тетраэдра на одном холсте. Потратьте этот путь, я хочу сделать это как под изображением. Моя первая идея - разделить один холст, а вторая - сделать четыре холста. Каков лучший способ?

Answer 1

можно разделить полотно с помощью ножниц и окна просмотра команд

// turn on the scissor test 
gl.enable(gl.SCISSOR_TEST); 

var width = gl.canvas.width; 
var height = gl.canvas.height; 

for (var y = 0; y < 2; ++y) { 
    for (var x = 0; x < 2; ++x) { 

    // set both the scissor (which clips pixels) 
    // and the viewport (which sets the clip space -> pixel space conversion); 
    gl.scissor(x * width/2, y * height/2, width/2, height/2); 
    gl.viewport(x * width/2, y * height/2, width/2, height/2); 

    ... 
    draw your scene here 
    ... 
    } 
}