Question

让我们从我所处的位置开始; current state

我有一个片段着色器，可以通过FBO生成这个纹理。我有几乎所有我想要的原语，除了贝塞尔曲线。

我的相当大的片段着色器：

testfrag = """//fragment
uniform float thickness; //sets beam thickness
uniform float light; //sets beam intensity

uniform vec4 lines[200]; //pairs of lines; x1, y1, x2, y2
uniform vec3 circles[200]; //circles x,y,radius
uniform vec4 ellipses[200]; //ellipses x,y,width, heightmultiplication
uniform int ellipselength = 1; //amount of ellipses
uniform int linelength = 2; //amount of linepairs
uniform int circlelength = 1; //amount of circles


uniform vec2 polygons[200]; //polygon data, points in x,y. (0,0) points used as end marker
uniform int polylength; //amount of polygons


int i; //for counter variable 1
int i2; //for counter variable 2
float mindistance = 1.0; //distance from fragment to next segment

float P2L(in vec2 p, in vec2 lp1, in vec2 lp2) //distance point to line segment
{
  float squared = pow(distance(lp1, lp2), 2); //squared line length
  float t = dot(p - lp1, lp2 - lp1) / squared; //relative position in parellel to line
  if (t < 0.0) return distance(p, lp1); //before the line, get radius to point
  if (t > 1.0) return distance(p, lp2); //after the line, get radius to point
  return distance(p, lp1 + t * (lp2 - lp1)); //otherwise, get distance line to point
}
float P2C(in vec2 p, in vec3 circle) //point to circle
{
    return abs(distance(p, circle.xy)-circle.z); //euclidian distance - radius
}
float P2E(in vec2 p, in vec4 ellipse) //point to ellipse
{
    return abs(sqrt(pow(p.x-ellipse.x,2) + pow((p.y-ellipse.y)/ellipse.w, 2)) -ellipse.z); // similar to circle, with factor on height
}

bool PinPoly(in vec2 p, in int start, in int len) //test if point in polygon
{
  int i, j; 
  bool c = false;
  for (i = start, j = len-1+start; i < len+start; j = i++) {
    if ( ((polygons[i].y>p.y) != (polygons[j].y>p.y)) &&
     (p.x < (polygons[j].x-polygons[i].x) * (p.y-polygons[i].y) / (polygons[j].y-polygons[i].y) + polygons[i].x) )
       c = !c;
  }
  return c;
} //balls if I know how this works



void main()
{   

    vec2 pos = gl_TexCoord[0].xy; // get position on fbo
    for (i = 0; i < linelength; i++) //test lines
    {
        mindistance = min(mindistance, P2L(pos, lines[i].xy, lines[i].zw));
    }
    for (i = 0; i < circlelength; i++) //test circles
    {
        mindistance = min(mindistance, P2C(pos, circles[i]));
    }
    for (i = 0; i < ellipselength; i++) //test ellipses
    {
        mindistance = min(mindistance, P2E(pos, ellipses[i]));
    }
    i = 1;
    int first;
    while (i < polylength) //test polygons
    {
        //first for line segments
        first = i-1;
        while (polygons[i] != (0.0, 0.0))
        {
            mindistance = min(mindistance, P2L(pos, polygons[i-1], polygons[i]));
            i++;

        }

        mindistance = min(mindistance, P2L(pos, polygons[i-1], polygons[first]));
        if (PinPoly(pos, first, i-first)) //then test if it is inside a polygon
        {
            mindistance = 0.0;
        }
        i += 2; //jump over the (0,0) vec2

    }

    gl_FragColor = light*(1.0/thickness)*(thickness-mindistance).xxxx; //set color of fragment
}
"""

在pyglet环境中大致这样称为：

def on_draw(self):
    if not self.inited:
        vert = shader.Shader(shader.texvertex)
        frag = shader.Shader(shader.testfrag)
        self.TexProgram = shader.Program([vert, frag])
        with self.TexProgram:
            self.TexProgram["lines[0]"] = (0.25, 0.5, 0.75, 0.5)
            self.TexProgram["lines[1]"] = (0.0, 0.0, 1.0, 1.0)
            self.TexProgram["circles[0]"] = (0.5, 0.5, 0.1)
            self.TexProgram["ellipses[0]"] = (0.75, 0.25, 0.1, 2.0) #x,y, width, multiplicator on height
            self.TexProgram["polygons[0]"] = (0.1, 0.9)
            self.TexProgram["polygons[1]"] = (0.2, 0.9)
            self.TexProgram["polygons[2]"] = (0.2, 1)
            self.TexProgram["polygons[3]"] = (0.1, 1)
            self.TexProgram["polygons[4]"] = (0,0)
            self.TexProgram["polygons[5]"] = (0.1, 0.1)
            self.TexProgram["polygons[6]"] = (0.2, 0.1)
            self.TexProgram["polygons[7]"] = (0.2, 0.2)
            self.TexProgram["polygons[8]"] = (0.1, 0.2)
            self.TexProgram["polygons[9]"] = (0,0)
            self.TexProgram["polylength"] = 8
            self.TexProgram["light"] = 1.05
            self.TexProgram["thickness"] = 0.02
        self.inited = True

    self.clear()
    else:
        with self.TexProgram:
            self.fbo.bind_texture()
            self.fbo.clear()
            t = (0.0, 0.0, 1.0, 0.0, 1.0, 1.0, 0.0, 1.0)
            x1 = 0
            x2 = w
            y1 = 0
            y2 = h

            glColor4d(1,1,1,1)
            glEnable (GL_TEXTURE_2D)
            glBegin(GL_QUADS)
            glTexCoord2d(t[0], t[1]); glVertex2d(x1, y1)
            glTexCoord2d(t[2], t[3]); glVertex2d(x2, y1)
            glTexCoord2d(t[4], t[5]); glVertex2d(x2, y2)
            glTexCoord2d(t[6], t[7]); glVertex2d(x1, y2)
            glEnd()

贝塞尔曲线通常有3个以上的点，一切都在2D空间。我看待它的方式，有两种方法可以解决这个问题。

1：

Generate points on curve.
get closest curve point.
generate points around curve point.
get closest point of those.
rince and repeat last steps until satisfactory precision is reached.

2：想出一个公式/算法来分析距离。我尝试了这一点，并没有找到任何数量的贝塞尔曲线点的解，只有恒定量。

我更喜欢第二种方法的解决方案。我可以自己想出第一种方法的解决方案，但是如果有人知道要查找的任何资源，那么我不浪费时间可能会有所帮助。

Answer 1

我不建议为任意贝塞尔曲线分析计算距离，因为贝塞尔曲线的每个点都取决于每个结，对于曲线的距离也是如此。（即使没有这个，你当前的实现似乎非常消耗，并且不会扩展。）

我可以推荐两种方法来计算任意形状的距离图（或Voronoi图）：

Fast computation of generalized Voronoi diagrams...：对于每一行（段），您绘制一个“帐篷”（两个四边形排列成屋顶）并从上方渲染场景 - 深度缓冲区是您的距离图。可以在着色器中或通过调整帐篷高度来调整光束厚度和强度。对于每个点，您渲染一个圆锥体。编辑：额外的几何体也可以在几何着色器中生成。
Jump Flooding：为此，您需要设置乒乓渲染方案并渲染到多个缓冲区。我跳过算法，因为解释起来有点冗长，请看文章。

这两种算法都适用于大量形状。

片段着色器：从片段到贝塞尔曲线的距离

1 个答案: