Bezier Curves

Bezier curves are a fundamental concept in computer graphics, animation, and design. They are named after the French engineer Pierre Bézier, who first developed and used them in the 1960s at the automobile manufacturer Renault for designing car bodies. Bezier curves are widely employed for creating smooth and precise curves in various applications, including graphic design software (e.g., Adobe Illustrator), 3D modeling, animation (e.g., in Pixar movies), and even font design.

The parameters of the Algorithm

  • SCREEN: (int,int) - The width and height of the screen given in pixels
  • SEPARATIONS: int - total number of segments in which each line is divided
  • SEGMENT_DISTANCE: float - width of each of the segments, given as percentage of completion
  • POINT: (int,int) - The position in x and y of a point in the SCREEN
  • BEZIER_UNIT: Bu() - All the elements required to draw a Bezier curve, including the color of the line and the three points used to project the curve
# MODULES
import pygame
# DD
SCREEN = (800,800)
display = pygame.display.set_mode(SCREEN)
SEPARATIONS = 100
SEGMENT_DISTANCE = 1/SEPARATIONS

# DD. POINT
# point = (int,int)
# interp. the position in x and y of a point in the SCREEN
pointA = (100,100)
pointG = (300,400)
pointB = (100,600)

# DD. BEZIER_UNIT
# bu = Bu()
# interp. all the elements required to draw a Bezier curve
class Bu():
    def __init__(self,pA, pG, pB):
        self.pA = pA 
        self.pG = pG 
        self.pB = pB 
        self.color = "white"
    
    def drawCurve(self):
        startingX = self.pA[0]
        startingY = self.pA[1]
        for i in range(SEPARATIONS):
            # point A to G
            x1 = self.pA[0] + (self.pG[0]-self.pA[0]) * (i * SEGMENT_DISTANCE)
            y1 = self.pA[1] + (self.pG[1]-self.pA[1]) * (i * SEGMENT_DISTANCE)
            # point G to B
            x2 = self.pG[0] + (self.pB[0]-self.pG[0]) * (i * SEGMENT_DISTANCE)
            y2 = self.pG[1] + (self.pB[1]-self.pG[1]) * (i * SEGMENT_DISTANCE)

            x = x1 + (x2-x1) * (i * SEGMENT_DISTANCE)
            y = y1 + (y2-y1) * (i * SEGMENT_DISTANCE)

            pygame.draw.line(display,self.color,(startingX,startingY),(x,y))
            startingX = x
            startingY = y

bu = Bu(pointA,pointG,pointB)

The Algorithm

  • For every segment i in SEPARATIONS:
    • Calculate position of the point from line A-G at segment i, to get point 1
    • Calculate position of the point from line G-B at segment i, to get point 2
    • Calculate position of the point from line point1 - point2 at segment i. Join point with previous using a line

Let's implement this algorithm using Python! 
# MODULES
import pygame
# DD
SCREEN = (800,800)
display = pygame.display.set_mode(SCREEN)
SEPARATIONS = 100
SEGMENT_DISTANCE = 1/SEPARATIONS

# DD. POINT
# point = (int,int)
# interp. the position in x and y of a point in the SCREEN
pointA = (100,100)
pointG = (300,400)
pointB = (100,600)

# DD. BEZIER_UNIT
# bu = Bu()
# interp. all the elements required to draw a Bezier curve
class Bu():
    def __init__(self,pA, pG, pB):
        self.pA = pA 
        self.pG = pG 
        self.pB = pB 
        self.color = "white"
    
    def drawCurve(self):
        startingX = self.pA[0]
        startingY = self.pA[1]
        for i in range(SEPARATIONS):
            # point A to G
            x1 = self.pA[0] + (self.pG[0]-self.pA[0]) * (i * SEGMENT_DISTANCE)
            y1 = self.pA[1] + (self.pG[1]-self.pA[1]) * (i * SEGMENT_DISTANCE)
            # point G to B
            x2 = self.pG[0] + (self.pB[0]-self.pG[0]) * (i * SEGMENT_DISTANCE)
            y2 = self.pG[1] + (self.pB[1]-self.pG[1]) * (i * SEGMENT_DISTANCE)

            x = x1 + (x2-x1) * (i * SEGMENT_DISTANCE)
            y = y1 + (y2-y1) * (i * SEGMENT_DISTANCE)

            pygame.draw.line(display,self.color,(startingX,startingY),(x,y))
            startingX = x
            startingY = y

bu = Bu(pointA,pointG,pointB)



# CODE

def draw():
    display.fill("#1e1e1e") 
    bu.drawCurve()
    pygame.display.flip()

def update():
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            pygame.quit()

    bu.pG = pygame.mouse.get_pos()

while True:
    draw()
    update()