Time for Action: Rendering Modes

Let's revisit the signature of the drawElements function:

gl.drawElements(mode, count, type, offset)

The first parameter determines the type of primitives that we are rendering. In the following section, we will see the different rendering modes with examples.

Follow the given steps:

1. Open the ch02_04_rendering-modes.html file in your browser. This example follows the same structure as in the previous section.
2. Open ch02_04_rendering-modes.html in your editor and scroll down to the initBuffers function:

function initBuffers() {
  const vertices = [
    -0.5, -0.5, 0,
    -0.25, 0.5, 0,
    0.0, -0.5, 0,
    0.25, 0.5, 0,
    0.5, -0.5, 0
  ];

  indices = [0, 1, 2, 0, 2, 3, 2, 3, 4];

  // Create VAO
  trapezoidVAO = gl.createVertexArray();

  // Bind VAO
  gl.bindVertexArray(trapezoidVAO);

  const trapezoidVertexBuffer = gl.createBuffer();
  gl.bindBuffer...