Viewport Split

The same clip-space geometry is drawn twice by changing the viewport from the left half of the canvas to the right half.

Program

The viewport controls how clip-space coordinates map into drawing-buffer pixels. Changing it lets one canvas contain multiple rendered regions.

viewport_split.html

<canvas id="stage" width="360" height="210"></canvas>
<script>
  gl.viewport(0, 0, stage.width / 2, stage.height);
  gl.drawArrays(gl.TRIANGLES, 0, 3);
  gl.viewport(stage.width / 2, 0, stage.width / 2, stage.height);
  gl.drawArrays(gl.TRIANGLES, 0, 3);
</script>

viewport The viewport maps clip-space coordinates to drawing-buffer pixels.

split view Repeated draws with different viewports can produce multiple regions in one canvas.