Có thể vẽ độ dày đường kẻ trong một trình đổ bóng phân đoạn không?

Question

Tôi có thể thêm độ dày đường kẻ vào phần đổ bóng phân đoạn khi tôi vẽ đường thẳng với GL_LINES không? Hầu hết các ví dụ tôi thấy dường như chỉ truy cập vào các phần tử trong phần nguyên thủy trong trình đổ bóng phân đoạn và một trình đổ bóng có độ dày dòng cần phải ghi vào các phần tử bên ngoài dòng nguyên thủy để thu được độ dày. Tuy nhiên, nếu có thể, một ví dụ rất nhỏ cơ bản sẽ rất tuyệt vời.

Answer 1

Rất nhiều điều có thể xảy ra với trình tạo đoạn phân đoạn. Chỉ cần xem what some guys are doing. Tôi xa mức mà bản thân mình nhưng mã này có thể cung cấp cho bạn một ý tưởng:

#define resolution vec2(500.0, 500.0) 
#define Thickness 0.003 

float drawLine(vec2 p1, vec2 p2) { 
    vec2 uv = gl_FragCoord.xy/resolution.xy; 

    float a = abs(distance(p1, uv)); 
    float b = abs(distance(p2, uv)); 
    float c = abs(distance(p1, p2)); 

    if (a >= c || b >= c) return 0.0; 

    float p = (a + b + c) * 0.5; 

    // median to (p1, p2) vector 
    float h = 2/c * sqrt(p * (p - a) * (p - b) * (p - c)); 

    return mix(1.0, 0.0, smoothstep(0.5 * Thickness, 1.5 * Thickness, h)); 
} 

void main() 
{ 
    gl_FragColor = vec4(
     max(
     max(
      drawLine(vec2(0.1, 0.1), vec2(0.1, 0.9)), 
      drawLine(vec2(0.1, 0.9), vec2(0.7, 0.5))), 
     drawLine(vec2(0.1, 0.1), vec2(0.7, 0.5)))); 
} 

Một lựa chọn khác là để kiểm tra với texture2D cho màu sắc của lân cận pixel - cách mà bạn có thể làm cho bạn hình ảnh phát sáng hoặc dày lên (ví dụ: nếu bất kỳ pixel điều chỉnh nào có màu trắng - làm cho pixel hiện tại màu trắng, nếu bên cạnh pixel gần đó là màu trắng - làm cho pixel màu xám hiện tại).

Answer 2

Không, không thể thực hiện được trong trình đổ bóng phân đoạn. Tuy nhiên, bạn có thể sử dụng trình đổ bóng hình học để mở rộng đường thẳng của mình thành một hình tứ giác (hoặc, thực tế là hai hình tam giác) có thể tạo thành một đường dày.

Here's thảo luận tốt đẹp về chủ đề đó (với mẫu mã).

Answer 3

Đây là cách tiếp cận của tôi. Để p1 và p2 là hai điểm xác định đường thẳng, và cho điểm là điểm có đường kẻ mà bạn muốn đo. Điểm có nhiều khả năng là gl_FragCoord.xy/resolution;

Đây là hàm.

float distanceToLine(vec2 p1, vec2 p2, vec2 point) { 
    float a = p1.y-p2.y; 
    float b = p2.x-p1.x; 
    return abs(a*point.x+b*point.y+p1.x*p2.y-p2.x*p1.y)/sqrt(a*a+b*b); 
} 

Sau đó, sử dụng chức năng này trong các chức năng trộn và làm mịn của bạn.

Ngoài ra kiểm tra câu trả lời này: https://stackoverflow.com/a/9246451/911207