考虑到我使用GL_LINES画线,是否可以在片段着色器中添加线条粗细?我看到的大多数示例似乎只访问片段着色器中基元内的纹理元素,并且线条着色器需要写入线基元外部的纹理元素以获取厚度。如果可能的话,一个非常小的,基本的例子会很棒。是否可以在片段着色器中绘制线条粗细?
14
A
回答
12
片段着色器有很多可能。看看what some guys are doing。我远离这个水平我自己但是这个代码可以给你出个主意:
#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))));
}
另一种方法是用texture2D
检查附近的像素的颜色 - 这样你可以让你图像发光或变厚(例如,如果任何调整像素是白色的 - 使当前像素变为白色,如果紧邻的像素是白色的 - 则使当前像素变灰)。
1
2
这是我的方法。令p1和p2为界定线的两点,让点为距你想测量的线的点。点最有可能是gl_FragCoord.xy/resolution;
下面是该功能。
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);
}
然后在你的mix和smoothstep函数中使用它。
还检查了这样的回答: https://stackoverflow.com/a/9246451/911207
相关问题
- 1. Bootstrap:是否可以更改“有错误”的线条粗细?
- 2. GLSL:顶点着色器无片段着色片段着色器
- 3. OpenGL线条粗细
- 4. Opengl片段着色器只绘制白色
- 5. 绘制粗线
- 6. 在iOS/Android的片段着色器中使用highp可以吗?
- 7. 如何更改使用System.Drawing.Pen绘制的线条的粗细?
- 8. 在PdfSharp vb.net中修改线条粗细
- 9. 更改线条粗细gtk_render_line
- 10. 片段着色器制服不再在简单着色器测试中上传
- 11. 在ActionScript中更改Sprite/MovieClip的线条粗细/颜色?
- 12. 作为可绘制着色器(Android)
- 13. 在改变线条粗细的同时绘制OpenGL中2D形状的轮廓
- 14. OpenGL ES 2:简单绘图是否需要顶点和片段着色器?
- 15. 如何使用片段着色器在OpenGL ES中绘制球体错觉?
- 16. 在Qt中绘制一条多色线
- 17. 是否可以在Android OpenGL ES 2中调试着色器?
- 18. 在QtCore.Qt.CrossPattern上设置图案颜色和线条粗细
- 19. OpenGL ES片段着色器可以更改片段的深度值吗?
- 20. glLight在片段着色器(屏幕pos)
- 21. 纹理中的OpenGL片段着色器
- 22. 用空着色器程序绘制是否有效?
- 23. 是否可以在Folium地图中绘制带箭头的线条?
- 24. 算法,其中颜色值不是由片段着色器
- 25. OpenGL ES片段着色器中的纹理FBO的直接绘制
- 26. 片段着色器中的条件语句
- 27. 将表面着色器转换为片段着色器
- 28. 顶点着色器和片段着色器
- 29. 着色器程序到节点+片段着色器
- 30. 从几何着色器的片段着色器
男人,那个网站很棒! – Meda 2013-10-12 21:34:36
虽然这个“有效”,但应该指出的是,这可能是世界绘制三条线的最低效方式。在混合过程中,99%的加工碎片被扔掉。 – Damon 2013-10-21 18:56:06
+ Damon肯定它不是最佳实践,我的例子有点愚蠢;而仅仅是为了演示着色器的原理和可能性 - 类似的方式可以做不同的发光效果或粒子效果,或者通过距离场不使用单个顶点来渲染整个地形的高度贴图或复杂的几何分形。令人惊讶的着色器可以非常快。 – defhlt 2013-10-21 20:49:18