GLSL 보간 컬러 테셀레이션 쉐이더

Question

테셀레이션 쉐이더는 두 개의 꼭지점에 대한 베 지어 곡선을 생성합니다. 정점은 두 좌표 x와 y로 구성됩니다 (vec2). 이제 모든 정점에는 색상이 있습니다. 내 질문 : 생성 된 커브에서 정점 당 색상을 보간하는 방법은 무엇입니까? 조각 쉐이더가 기본 색상 값 (빨간색)을 설정합니다. 하지만 나는 그가 보간 된 색을 얻길 원합니다. 예

:

vertex 1 [vec2(0.0, 0.0), vec4(1.0, 0.0, 0.0, 1.0)] // red 
vertex 2 [vec2(1.0, 1.0), vec4(0.0, 1.0, 0.0, 1.0)] // blue 

너무 적색에서 청색에 구배가 있어야한다. 테셀레이션 쉐이더로 어떻게 할 수 있습니까?

정점 셰이더 :

#version 400 

layout (location = 0) in vec2 in_position; 
layout (location = 1) in vec4 in_color; 

void main() 
{ 
    gl_Position = vec4(in_position, 0.0, 1.0); 
} 

공간 분할 제어 쉐이더 :

#version 400 

layout(vertices = 2) out; 

uniform int NumSegments; 
uniform int NumStrips; 

void main() 
{ 
    gl_out[gl_InvocationID].gl_Position = gl_in[gl_InvocationID].gl_Position; 

    gl_TessLevelOuter[0] = float(NumSegments); 
    gl_TessLevelOuter[1] = float(NumStrips); 
} 

공간 분할 평가 쉐이더 :

#version 400 

layout(isolines) in; 

uniform mat4 Projection; 
uniform mat4 Modelview; 

void main() 
{ 
    float u = gl_TessCoord.x; 

    vec3 p0 = gl_in[0].gl_Position.xyz; 
    vec3 p1 = vec3(0.5, gl_in[0].gl_Position.y, 0.0); 
    vec3 p2 = vec3(0.5, gl_in[1].gl_Position.y, 0.0); 
    vec3 p3 = gl_in[1].gl_Position.xyz; 

    float u1 = (1.0 - u); 
    float u2 = u * u; 

    // Bernstein polynomials 
    float b3 = u2 * u; 
    float b2 = 3.0 * u2 * u1; 
    float b1 = 3.0 * u * u1 * u1; 
    float b0 = u1 * u1 * u1; 

    // Cubic Bezier interpolation 
    vec3 p = p0 * b0 + p1 * b1 + p2 * b2 + p3 * b3; 

    gl_Position = Projection * Modelview * vec4(p, 1.0); 
} 

조각 쉐이더 :

#version 400 

layout (location = 0) out vec4 FragColor; 

void main() 
{ 
    FragColor = vec4(1.0, 0.0, 0.0, 1.0); 
} 

Answer 1

이 모든 매우 간단합니다. 기존 입력 및 출력 패턴을 따르십시오.

정점 셰이더는 gl_Position 값을 출력합니다. 따라서, 정상적으로 또한 출력 컬러 값 :

layout (location = 0) in vec2 in_position; 
layout (location = 1) in vec4 in_color; 

out vec4 color; 

void main() 
{ 
    gl_Position = vec4(in_position, 0.0, 1.0); 
    color = in_color; 
} 

내 공간 분할 제어 쉐이더 gl_Position의 배열 걸린다. 그래서 당신은 색깔의 배열을 가져 가라. 또한 색상의 배열에 기록 할 필요가있다 : 당신의 평가 쉐이더에서

layout(vertices = 2) out; 

uniform int NumSegments; 
uniform int NumStrips; 

in vec4 color[]; 

out Tess 
{ 
    vec4 color; 
} Out[]; 

void main() 
{ 
    gl_out[gl_InvocationID].gl_Position = gl_in[gl_InvocationID].gl_Position; 
    Out[gl_InvocationID].color = color[gl_InvocationID]; 

    gl_TessLevelOuter[0] = float(NumSegments); 
    gl_TessLevelOuter[1] = float(NumStrips); 
} 

, 당신은 다시 입력 및 출력 레이아웃 규정의 배열을해야합니다. 우리는 Tess라는 출력 인터페이스 블록을 사용, 그래서 우리는 같은 이름의 입력 인터페이스 블록과 일치해야합니다

layout(isolines) in; 

uniform mat4 Projection; 
uniform mat4 Modelview; 

in Tess 
{ 
    vec4 color; 
} In[]; 

out vec4 color; 

void main() 
{ 
    float u = gl_TessCoord.x; 

    /** Do whatever interpolation stuff you do **/ 

    // Cubic Bezier interpolation 
    vec3 p = p0 * b0 + p1 * b1 + p2 * b2 + p3 * b3; 

    gl_Position = Projection * Modelview * vec4(p, 1.0); 
    color = Interpolate(In[0].color, In[1].color, ...); //More interpolation stuff. 
} 

을 그리고 그입니다. 프래그먼트 셰이더는 vec4 color을 입력으로 사용합니다.

작은 메모 : 이것은 베 지어 스플라인이 아닙니다. 베 지어 스플라인에는 2 가지가 아닌 4 가지 위치의 패치가 필요합니다. 다른 두 값을 합성하는 방법이 올바른지 확인하지 않습니다.