Computer Graphics Line Drawing Techniques

Computer Graphics
Lecture 04
Line Drawing Techniques
Rahmat Ullah Niazi
What is Line
A line, or straight line, is, roughly speaking, (infinitely) thin,

(infinitely) long, straight geometrical object, i.e. a curve that is
long and straight.
Line Cont…
Given two points, in Euclidean geometry, one can

always find exactly one line that passes through the two
points.
Line Cont…
A line may have three forms with respect to slope:

 slope = 1
 slope > 1
 slope < 1
Line Cont…
figure (a) figure (b) figure (c)

There are three techniques to be discussed to draw a line
involving different time complexities that will be discussed
along. These techniques are:

 Incremental line algorithm
 DDA line algorithm
 Bresenham line algorithm
Incremental Line Algorithm
This algorithm exploits simple line equation

y=mx+b
where m = dy / dx
and b=y–mx
now check if
|m| < 1 then
x=x+1 whereas
y=mx+b
why to check |m|
suppose a line has points

p1 (10, 10) – p2 (20, 18)
dy = y2 – y1 = 18 – 10 = 8
dx = x2 – x1 = 20 – 10 = 10
This means that there will be 10 pixels on the line in which for
x-axis there will be distance of 1 between each pixel and for
y-axis the distance will be 0.8.
Now consider the reverse case
suppose a line has points

p1 (10, 10) , p2 (16, 20)
dy = y2 – y1 = 20 – 10 = 10
dx = x2 – x1 = 16 – 10 = 6
This means that there will be 10 pixels on the line in which for
x-axis there will be distance of 0.6 between each pixel and for
y-axis the distance will be 1.
Now sum-up all discussion in algorithm to fully understand.
The algorithm will take two points P1 and P2 and draw line
between them whereas each point consists of x,y
coordinates.
dx = p2.x – p1. x
dy = p2.y – p1. y
m = dy / dx
x = p1.x
y = p1.y
b=y–m*x
if |m| < 1
for counter = p1.x to p2.x
drawPixel (x, y)
x=x+1
y=m*x+b
else
for counter = p1.y to p2.y
drawPixel (x, y)
y=y+1
x=(y–b)/m
Discussion on algorithm:
 quite simple and easy to understand
 but involves a lot of mathematical calculations 24
We have another algorithm that works fine in all directions
and involves less calculations; mostly only additions.
DDA Algorithm
DDA abbreviated for digital differential analyzer has a very

simple technique.
Find difference, dx and dy as:

dy = y2 – y1
dx = x2 – x1
if |dx| > |dy| then
step = |dx|
else
step = |dy|
Now very simple to say that step is the total number of pixels
required for a line.
Next step is to find xIncrement and yIncrement:

xIncrement = dx/step
yIncrement = dy/step
Next a loop is required that will run ‘step’ times.
In the loop drawPixel and add xIncrement to x1 and

yIncrement to y1.

Now sum-up all above in the algorithm:
DDA_Line (Point p1, Point p2)
dx = p2.x – p1. x
dy = p2.y – p1. y
x1=p1.x
y1=p1.y
if |dx| > |dy| then
step = |dx|
else
step = |dy|
xIncrement = dx/step
yIncrement = dy/step
for counter = 1 to step
drawPixel (x1, y1)
x1 = x1 + xIncrement
y1 = y1 + yIncrement
Criticism on Algorithm:
Use of floating point calculation
An algorithm based on integer type calculations is likely to be

more efficient
Therefore, after some effort, finally we came up with an
algorithm called “Bresenham Line Drawing Algorithm”
which would be discussed next.
Bresenham Algorithm
Bresenham's algorithm finds the closest integer

coordinates to the actual line, using only integer math.
Assuming that the slope is positive and less than 1,
moving 1 step in the x direction, y either stays the same,
or increases by 1. A decision function is required to
resolve this choice.
d1 = y – yi
= m * (xi+1)+b – yi
d2 = yi + 1 – y
= yi + 1 – m ( x i + 1 ) – b
pi = dx (d1-d2)
pi = dx (2m * (xi+1) + 2b – 2yi –1 )
pi = 2dy (xi+1) – 2dx yi + dx (2b–1 ) ------
---------------- (i)
pi = 2 dy xi – 2 dx yi + k ---------------- (ii)
where k = 2 dy + dx (2b-1)
Then we can calculate pi+1 in terms of pi without any xi , yi or
k.

pi+1 = 2 dy xi+1 – 2 dx yi+1 + k
pi+1 = 2 dy (xi + 1) – 2 dx yi+1 + k since xi+1= xi + 1
pi+1 = 2 dy xi + 2 dy- 2 dx yi+1 + k ---
------------ (iii)
Now subtracting (ii) from (iii), we get
pi+1 – pi = 2 dy – 2 dx (yi+1 – yi )
pi+1 = pi + 2 dy – 2 dx (yi+1 – yi )
If the next point is: (xi+1,yi) then

d1 < d2 => d1 – d2<0
=> pi<0
=> pi+1 = pi + 2 dy
If the next point is: (xi+1,yi+1) then

d1>d2 => d1 – d2>0
=> pi>0
=> pi+1= pi + 2 dy – 2 dx
The pi is our decision variable, and calculated using integer
arithmetic from pre-computed constants and its previous
value. Now a question is remaining; i.e. how to calculate
initial value of pi? For that, we use equation (i) and put
values (x1, y1)
pi = 2 dy (x1+1) – 2 dx y1 + dx (2b – 1)
where b = y – m x implies that
pi = 2 dy x1 +2 dy – 2 dx y1
+ dx ( 2 (y1 – mx1) – 1)
pi = 2 dy x1 + 2 dy – 2 dx y1 + 2 dx y1
– 2 dy x1 – dx
pi = 2 dy x1 + 2 dy – 2 dx y1 + 2 dx y1
– 2 dy x1 – dx
there are certain figures that will cancel each other (shown
in pairs of different colour)

pi = 2 dy - dx
dx = x2-x1
dy = y2-y1
p = 2dy-dx
c1 = 2dy
c2 = 2(dy-dx)
x = x1
y = y1
plot (x, y, colour)
while (x < x2)
x++
if (p < 0)
p = p + c1
else
p = p + c2
y++
plot (x,y,colour)
Improving Performance
The use of separate x and y coordinates can be discarded

in favour of direct frame buffer addressing. Most algorithms
can be adapted to calculate only the initial frame buffer
address corresponding to the starting point and to replace:

x++ with Addr++
y++ with Addr+=XResolution
Setting a Pixel
Initial Task: Turning on a pixel (loading the frame buffer/bit-

map). Assume the simplest case, i.e., an 8-bit, non-
interlaced graphics system. Then each byte in the frame
buffer corresponds to a pixel in the output display.
addr(0,0) = the memory address of the initial pixel (0,0)
Number of rows = number of raster lines.
Number of columns = number of pixels/raster line.

To find the address of a particular pixel (X,Y) we use the
following formula:
addr(X, Y) = addr(0,0)
+ Y rows * (Xm + 1)
+X (all in bytes)
addr(X,Y) = the memory address of

pixel (X,Y)
Example:
For a system with 640 × 480 pixel resolution, find the

address of pixel
(X = 340, Y = 150)
addr(340, 150) = addr(0,0) + 150 * 640
+ 340
= base + 96,340 is the byte location
Graphics systems usually have a command such as set_pixel
(x, y) where x, y are integers.
Lets call it a day!
Computer Graphics
Lecture 05
Taqdees A. Siddiqi
taqdees@vu.edu.pk

Computer Graphics Line Drawing Techniques

Uploaded by

Copyright:

Available Formats

Computer Graphics Line Drawing Techniques

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Computer Graphics Line Drawing Techniques

Uploaded by

Copyright:

Available Formats

Computer Graphics

A line, or straight line, is, roughly speaking, (infinitely) thin,

Given two points, in Euclidean geometry, one can

A line may have three forms with respect to slope:

figure (a) figure (b) figure (c)

This algorithm exploits simple line equation

suppose a line has points

suppose a line has points

DDA abbreviated for digital differential analyzer has a very

Find difference, dx and dy as:

In the loop drawPixel and add xIncrement to x1 and

Use of floating point calculation

An algorithm based on integer type calculations is likely to be

Bresenham's algorithm finds the closest integer

The use of separate x and y coordinates can be discarded

Initial Task: Turning on a pixel (loading the frame buffer/bit-

Number of rows = number of raster lines.

Number of columns = number of pixels/raster line.

addr(X,Y) = the memory address of

For a system with 640 × 480 pixel resolution, find the

You might also like