Triangle Rendering - jgoffeney/Cesium4Unreal GitHub Wiki

Back

References

This article provides an overview of triangle functions and barycentric coordinates.

Meet the Triangle

The triangle is defined by three vertices and three edges. For a non-degenerate triangle the three vertices define a single plane.

For rasterization you need to determine which raster points lie within the triangle (or on the edge).

Oriented Edges

For an edge v0v1 if you extend it then the resulting line splits a plane in two. By providing an orientation to the line then you can determine which of the line a point would fall on. If you use a common orientation for all edge lines for a triangle then you can determine if a point is "inside" all the lines. The orientation is the spatial winding of the vertices (if you look at the three vertices a, b and c do they defines the triangle in a clockwise or counter clockwise order).

If you have a sample point p and edge points a and b and if you have a directed edge then you can use a determinant to determine the "side" of the line the sample point lies. The "side" will be determined by returning a positive, negative or 0 value.

Side(a, b, p) = (bx - ax) * (py - ay) - (by - ay) * (px - ax)

By rearranging the terms and substituting the other edge vertices you get the following set of equations.

Fab(p) = (ay - by)px + (bx - ax)py + (ax * by - ay * bx)

Fbc(p) = (by - cy)px + (cx - bx)py + (bx * cy - by * cx)

Fca(p) = (cy - ay)px + (ax - cx)py + (cx * ay - cy * ax)

If all three values are positive then the point p is inside the triangle. The values are also twice the signed area of the triangles formed by the two edge vertices and the sample point. The area itself is then proportional to the proximity of the sample point to each edge vertex. By normalizing the values so they sum to 1 then you can use them for interpolation of something like color or height within the original triangle.

⚠️ **GitHub.com Fallback** ⚠️