如何在片段着色器中使用可自定义的间隙做多行

How to do multiple lines with a customizable gaps in a fragment shader

提问人:Dilado 提问时间:9/12/2023 最后编辑:Ripi2Dilado 更新时间:9/12/2023 访问量:21

问:

我想用几条线绘制一个图案,用可自定义的空间分隔。线之间的间隙可以从线条粗细中独立控制。挑战 !我想避免使用循环,它可以轻松处理这个问题。

例如,对于像 这样的函数,行之间的间距始终与行的大小成正比,如下图所示:cos()

image

但是,我尝试使用一个行为更像以下示例的函数:

image

但我在实现这一目标(我的数学水平)方面遇到了一些困难。你有什么建议可以帮助我吗?先谢谢你。

数学 着色 三角函数 片段着色器

评论


答:

0赞 Ripi2 9/12/2023 #1

根据您的图像,它似乎是水平线之间 sin() 函数的一部分。
您有一些用户值:

  • 直到 sin() 开始的起始距离,x0
  • sin() 部分的距离ds
  • 水平部分的距离dh
  • 所有零件相对于原点的垂直距离vd

目标是返回正确部分的值的函数 f(x)。

一个简单的函数可以告诉 a 的位置:x

int f(float x, inout float pos) //returns 0: at initial part,  1: at sin() part,   2: at horizontal
{
   if (x <= x0)
   {
      pos = 0;
      return 0;
   }
 
   pos = x0;  // 'pos' is the 'x' of the beginning of this part
   while (1)
   {
       if (x <= pos + ds)
          return 1;   //sin() part
       pos += ds;
       if (x <= pos + ds + dh)
          return 2;
       pos += dh;
   }
}

我相信有更好、更快的功能。我让它给你找出来。

一旦你有了范围,只需计算值。y

float y(float x, int type_of_part, float pos)
{
   if (type_of_part==0 || type_of_part==2)
      return vd;

   //sin() needs the horizontal part = PI
   float dr = x - pos; //'x' relative to beginning of sin()
   return vd + sin(dr / ds * PI);
}

我希望你能明白。我让你加入这两个功能并纠正我的 GLSL 错别字。