Indexed Representation

정민용·2025년 9월 14일

WebGL

목록 보기
3/7

Quiz

1. gl.TRIANGLES 대신 gl.LINESgl.LINE_STRIP으로 바꾸어서 그려지는 결과를 보고, 왜 그런 결과가 나왔는지 생각해 보세요. 각각이 무엇을 의미하는지는 아래 "Useful Links"의 글을 한 번 읽어보세요.
  • gl.LINES : 정점 셰이더가 출력하는 두개의 클립 공간 정점에 대해 그 두 점을 연결하는 선을 그림

  • gl.LINE_STRIP : 정점 셰이더가 출력하는 각 클립 공간 정점에 대해 정점 셰이더가 출력한 이전 포인트에서 선을 그림

2. drawElements()의 두 번째 인자로 3을 넣으면 우측 하단의 삼각형 하나만 그려지게 됩니다. 왜 그럴까요?
drawElements(mode, count, type, offset)
  • count : 렌더링할 바인딩된 요소 배열 버퍼의 요소 개수를 의미
  • 두 번째 인자를 3을 넣게 된다면 3개의 요소만 렌더링하기에 해당 요소가 가리키는 우측 하단의 삼각형 하나만 그려지게 됨

3. 반대로, drawElements()의 인자를 바꾸어서 좌측 상단의 삼각형 하나만 그려지도록 바꾸어 보세요. (힌트: 레퍼런스 문서에 써있다시피 offset은 바이트 단위의 크기를 인자로 받습니다!)
	gl.drawElements(gl.TRIANGLES,
                    3,
                    gl.UNSIGNED_SHORT,
                    3 * 2);
  • 'offset' : 요소 배열 버퍼의 바이트 오프셋
  • 우측 하단의 삼각형 정보를 갖는 요소들(3 * 2바이트)을 넘기고 좌측 상단의 삼각형을 그리도록 함.

0개의 댓글