WebGL에서 속성, 균일 및 가변 변수의 차이점은 무엇입니까?

이러한 다른 유형을 비교할 때 생각할 수있는 비유가 있습니까?

또한 행렬 균일화는 무엇을 의미합니까?

http://www.lighthouse3d.com/tutorials/glsl-tutorial/data-types-and-variables/ 에서 직접 복사했습니다 . 실제 사이트는 훨씬 더 자세한 정보를 가지고 있으며 확인하는 것이 좋습니다.

변수 한정자

한정자는 변수에 특별한 의미를 부여합니다. 다음 한정자를 사용할 수 있습니다.

• const – 선언이 컴파일 시간 상수입니다.
• attribute – OpenGL 애플리케이션에서 정점 셰이더로 전달되는 정점별로 변경 될 수있는 전역 변수입니다. 이 한정자는 버텍스 셰이더에서만 사용할 수 있습니다. 셰이더의 경우 이것은 읽기 전용 변수입니다. 속성 섹션을 참조하십시오.
• uniform – OpenGL 애플리케이션에서 셰이더로 전달되는 기본 [...]별로 변경 될 수있는 전역 변수입니다. 이 한정자는 정점 셰이더와 조각 셰이더 모두에서 사용할 수 있습니다. 셰이더의 경우 이것은 읽기 전용 변수입니다. 유니폼 섹션을 참조하십시오.
• varying – 정점 셰이더와 조각 셰이더 간의 보간 데이터에 사용됩니다. 정점 셰이더에서 쓰기가 가능하고 조각 셰이더에서 읽기 전용입니다. 다양한 섹션을 참조하십시오.

비 유적으로 const와 uniform은 C / C ++의 전역 변수와 같으며 하나는 상수이고 다른 하나는 설정할 수 있습니다. 속성은 색상 또는 텍스처 좌표와 같은 정점을 수반하는 변수입니다. 가변 변수는 버텍스 셰이더에 의해 변경 될 수 있지만 프래그먼트 셰이더에 의해 변경되지 않으므로 본질적으로 파이프 라인 아래로 정보를 전달합니다.

• uniform아르 프리미티브 당 파라미터 (전체 연신 통화 중 상수);
• attribute아르 정점마다 변수 (일반적 : 위치, 법선, 색의 UV는, ...);
• varying아르 단편 당 (또는 픽셀 당 들은 : 파라메터) 변화 화소로부터 화소.

varying자신의 셰이더를 프로그래밍 하는 방법을 이해하는 것이 중요합니다 . 정점 셰이더 내부 삼각형의 각 정점에 대해
다양한 매개 변수 v를 정의한다고 가정 해 보겠습니다 . 이 가변 매개 변수가 fragment shader로 전송 되면 그 값은 그릴 픽셀의 위치에 따라 자동으로 보간됩니다.

다음 이미지에서 빨간색 픽셀은 가변 매개 변수의 보간 된 값을 수신했습니다 v. 그것이 우리가 그들을 "변함"이라고 부르는 이유입니다.

단순화를 위해 위의 예제 에서는 그려진 모든 픽셀이 카메라에서 동일한 거리에 있다고 가정하는 쌍 선형 보간을 사용 합니다. 정확한 3D 렌더링을 위해 그래픽 장치 는 픽셀의 깊이를 고려한 원근 보정 보간 을 사용 합니다.

WebGL에서 속성, 균일 및 가변 변수의 차이점은 무엇입니까?

OpenGL에서 "프로그램"은 파이프 라인에서 서로 연결된 "셰이더"(작은 프로그램)의 모음입니다.

// "program" contains a shader pipeline:
//   vertex shader -> other shaders -> fragment shader
//
const program = initShaders(gl, "vertex-shader", "fragment-shader");
gl.useProgram(program);

셰이더는 3D 모델을 래스터 화하는 데 필요한 정점 (정점 셰이더), 도형 (지오메트리 셰이더), 테셀레이션 (테셀레이션 셰이더), 조각 (픽셀 셰이더) 및 기타 일괄 처리 작업 (계산 셰이더)을 처리합니다.

OpenGL (WebGL) 셰이더는 GLSL (GPU에서 컴파일 된 텍스트 기반 셰이더 언어)로 작성됩니다.

// Note: As of 2017, WebGL only supports Vertex and Fragment shaders

<!-- Vertex Shader -->
<script id="shader-vs" type="x-shader/x-vertex">

  // <-- Receive from WebGL application
  uniform vec3 vertexVariableA;

  // attribute is supported in Vertex Shader only
  attribute vec3 vertexVariableB;

  // --> Pass to Fragment Shader
  varying vec3 variableC;

</script>

<!-- Fragment Shader -->
<script id="shader-fs" type="x-shader/x-fragment">

  // <-- Receive from WebGL application
  uniform vec3 fragmentVariableA;

  // <-- Receive from Vertex Shader
  varying vec3 variableC;

</script>

다음 개념을 염두에 두십시오.

셰이더는 파이프 라인의 다음 셰이더 ( out, inout)로 데이터를 전달할 수 있으며 WebGL 애플리케이션 또는 이전 셰이더 ( in)의 데이터를받을 수도 있습니다 .

• Vertex 및 Fragment 셰이더 (실제로 모든 셰이더)는 uniform변수를 사용 하여 WebGL 응용 프로그램에서 데이터를받을 수 있습니다 .

  // Pass data from WebGL application to shader
  const uniformHandle = gl.glGetUniformLocation(program, "vertexVariableA");
  gl.glUniformMatrix4fv(uniformHandle, 1, false, [0.1, 0.2, 0.3], 0);
  

• Vertex Shader는 attribute필요에 따라 활성화 또는 비활성화 할 수있는 변수를 사용하여 WebGL 애플리케이션에서 데이터를 수신 할 수도 있습니다.

  // Pass data from WebGL application to Vertex Shader
  const attributeHandle = gl.glGetAttribLocation(mProgram, "vertexVariableB");
  gl.glEnableVertexAttribArray(attributeHandle);
  gl.glVertexAttribPointer(attributeHandle, 3, gl.FLOAT, false, 0, 0);
  

• Vertex Shader는 varying변수를 사용하여 데이터를 Fragment Shader에 전달할 수 있습니다 . 위의 GLSL 코드 ( varying vec3 variableC;)를 참조하십시오 .

Uniform은 CPU의 애플리케이션에서 GPU의 셰이더로 데이터를 전달하는 또 다른 방법이지만, uniform은 버텍스 속성에 비해 약간 다릅니다. 우선 유니폼은 글로벌입니다. 전역 : 균일 변수는 셰이더 프로그램 개체마다 고유하며 셰이더 프로그램의 모든 단계에서 모든 셰이더에서 액세스 할 수 있음을 의미합니다. 둘째, uniform 값을 무엇으로 설정하든 uniform은 재설정되거나 업데이트 될 때까지 값을 유지합니다.

per-primitive 라는 단어 가 직관적이지 않기 때문에 https://learnopengl.com/Getting-started/Shaders 의 설명을 좋아합니다.