오브젝트 상에 텍스쳐가없는 webGL 앰비언트 조명

Question

나는 these tutorials을 잘 따라 왔지만 텍스처가 들어 있지 않은 오브젝트를 밝게하는 방법을 생각할 수 없다. 나는 쉐이더가 주어진 것을 의미한다. 자습서에서는 그려지는 객체에 질감이없는 것을 허용하지 않습니다. 나는 이것을 설명하는 데 어려움을 겪고있다. 그러나 거대한 양의 코드를 여기에 버리면 webGL 조명이 어떻게 작동 하는지를 아는 누군가가 도움이된다고 생각하지 않는다.

간단한 피라미드 개체에서 사용하는 예를 들어 주시겠습니까?

문제가되지 않도록 다각형의 모든 삼각형에 대한 법선이 있습니다.

Answer 1

텍스처를 사용하고 싶지 않을 때 가장 좋은 방법은 1x1 픽셀의 흰색 텍스처를 사용하는 것입니다.

tex = gl.createTexture(); 
gl.bindTexture(gl.TEXTURE_2D, tex); 
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, 
       new Uint8Array([255, 255, 255, 255])); 

그렇지 않으면 텍스처를 사용하지 않는 다른 셰이더가 필요합니다. 즉, 코드가 코드를 통해 다른 경로를 관리하는 데 더 복잡해집니다. 해당 경로로 이동하려면 셰이더에서 texture2D을보고 색상으로 바꿉니다. 예를 들어, 코드는 다음

uniform vec4 u_color; 

gl_FragCoord = u_color; // get color from uniform 

을 설정할 수 있도록하려면

gl_FragCoord = vec4(1,0,0,1); // just use red 

에

gl_FragCoord = texture2D(u_samplers, v_texcoord); 

변경이 나 이제

와 그 색상을 설정할 수 있습니다 경우

// at init time 
colorLocation = gl.getUniformLocation(program, "u_color"); 

// at draw time 
gl.uniform4fv(colorLocation, [1, 0, 0, 1]); // set color to red