Vertex Buffer

Quiz

1. 화면에 아무 것도 나오지 않는 이유는 무엇일까요? (힌트 1: 최상단에 우리가 해야 할 세 가지 작업 중 어느 것이 빠졌는지 생각해 보세요.)(힌트 2: F12로 브라우저 개발자 도구를 열어서 경고 메시지를 읽어 보세요.)

• WebGL: INVALID_OPERATION: drawArrays: no valid shader program in use
• 그리기 위한 삼각형의 세 점 좌표 데이터는 주어졌지만, 어떠한 색상을 칠해야할지에대한 shader 정보가 없어 화면상에 그려지는 것이 없게 됨.

2. gl.drawArray()의 인자에는 "삼각형을 그려라" "첫 번째 것부터 그려라" "세 개 데이터를 사용해 그려라"라는 내용만 전달되고 있습니다. 어떤 데이터를 가져와서 그리라는 인자가 없습니다. 왜 그런지 짐작해 보세요. (힌트: 5,6번 설명 참고)

• gl.bindBuffer 과정을 통해 할당된 GPU 메모리 공간을 vertex array를 위해 사용하겠다는 상태를 할당하였음.
• gl.bufferData 과정을 통해 gl.ARRAY_BUFFER 상태인 공간에 데이터를 넣어주었음.
• gl.drawArray 과정에서는 이러한 사전작업을 바탕으로 어떤 데이터를 가져와서 그릴지 알게 되어 별도의 인자가 필요하지 않게 됨.

3. 아래와 같은 코드가 있다고 해 봅시다. (1)과 (2)는 완전히 동일한 명령문입니다. (1)을 실행하면 어떤 버퍼로 데이터가 들어가는지, (2)를 실행하면 어떤 버퍼로 데이터가 들어가는지 생각해 보세요. (너무 쉽죠? 그래도 꼭 기억해 두십시오.)

var buffer1 = gl.createBuffer(); 
var buffer2 = gl.createBuffer();

gl.bindBuffer(gl.ARRAY_BUFFER, buffer1); 
gl.bufferData(gl.ARRAY_BUFFER, floatPositions, gl.STATIC_DRAW); //---(1)

gl.bindBuffer(gl.ARRAY_BUFFER, buffer2);
gl.bufferData(gl.ARRAY_BUFFER, floatPositions, gl.STATIC_DRAW); //---(2)

• (1) : buffer1
• (2) : buffer2