8/22/2023

Point
 Point plotting is done by converting a single coordinate position
furnished by an application program into appropriate operations for the
output device in use.
 Example: Plot point 𝑃 (3, 2) 7
6
 Line 𝑥 = 3
5
 Line 𝑦 = 2 4
 Point 𝑃 (3, 2) 3
 2
To draw the point on the screen we use function
1
 𝑠𝑒𝑡𝑝𝑖𝑥𝑒𝑙 (𝑥, 𝑦)
0
 To draw the pixel in C language we use function
0 1 2 3 4 5 6 7
 𝑝𝑢𝑡𝑝𝑖𝑥𝑒𝑙 (𝑥, 𝑦, 𝑐𝑜𝑙𝑜𝑟)
 Similarly for retrieving color of pixel we have function
 𝑔𝑒𝑡𝑝𝑖𝑥𝑒𝑙 (𝑥, 𝑦)

Line
 Line drawing is done by calculating intermediate positions along
the line path between two specified endpoint positions.
 The output device is then directed to fill in those positions
between the end points with some color.
5
 For some device such 5 as a pen plotter or random scan display, a
4
4
straight line can be33 drawn smoothly from one end point to other.
 Digital devices display
2
2 a straight line segment by plotting discrete
1
points between the0 two endpoints.
1

0
0 2 4 6
 Discrete coordinate positions
1 2
along
3
the
4
line path are calculated
from the equation of the line.

1
 8/22/2023

Contd.
 Screen locations are referenced with integer values.
 So plotted positions may only approximate actual line positions
between two specified endpoints. For example line position of
(12.36, 23.87) would be converted to pixel position (12, 24).
 This rounding of coordinate values to integers causes lines to be
displayed with a stair step appearance (“the Jaggies”).

Line Drawing Algorithms

 The Cartesian slop-intercept equation for a straight line is
• 𝑦 = 𝑚𝑥 + 𝑏
• with ‘𝒎’ representing slop and ‘𝒃’ as the intercept.
 It is possible to draw line using this equation but for efficiency
purpose we use different line drawing algorithm.
• DDA Algorithm
• Bresenham’s Line Algorithm
 We can also use this algorithm in parallel if we have more number
of processors.

2
 8/22/2023

Introduction to DDA Algorithm

 Full form of DDA is Digital Differential Analyzer
 DDA is scan conversion line drawing algorithm based on
calculating either ∆𝑦 or ∆𝑥 using line equation.
 We sample the line at unit intervals in one coordinate and find
corresponding integer values nearest the line path for the other
coordinate.
 Selecting unit interval in either 𝑥 or 𝑦 direction based on way we
process line.

Unit Step Direction in DDA

Algorithm
 Processing from left to right.
 Slope is “+ve”, & Magnitude is Less than 1
Δ𝑋 = 1
 Slope is “-ve”, & Magnitude is Less than 1
 Slope is “+ve”, & Magnitude is greater than 1 Δ𝑌 = 1
 Slope is “-ve”, & Magnitude is greater than 1 Δ𝑌 = −1

 Processing from right to left.

 Slope is “+ve”, & Magnitude is Less than 1
Δ𝑋 = −1
 Slope is “-ve”, & Magnitude is Less than 1
 Slope is “+ve”, & Magnitude is greater than 1 Δ𝑌 = −1
 Slope is “-ve”, & Magnitude is greater than 1 Δ𝑌 = 1

3
 8/22/2023

Derivation of DDA Algorithm

 We sample at unit 𝑥 interval (∆𝑥 = 1) and calculate each successive 𝑦
value as follow:
 𝑦 = 𝑚𝑥 + 𝑏
 𝑦 = 𝑚 𝑥 + 1 + 𝑏 [For first intermediate point]
 𝑦 = 𝑚 𝑥 + 𝑘 + 𝑏 [For 𝑘𝑡ℎ intermediate point]
 𝑦 = 𝑚 𝑥 + 𝑘 + 1 + 𝑏 [For 𝑘 + 1𝑡ℎ intermediate point]
 Subtract 𝑦 from 𝑦
 𝑦 −𝑦 = 𝑚 𝑥+𝑘+1 +𝑏−𝑚 𝑥+𝑘 −𝑏
 𝑦 =𝑦 +𝑚
 Using this equation computation becomes faster than normal line
equation.
 As 𝒎 is any real value calculated 𝒚 value must be rounded to nearest
integer.

Contd.
 We sample at unit 𝑦 interval (∆𝑦 = 1) and calculate each successive 𝑥
value as follow:
 𝑥 = (𝑦 − 𝑏)/𝑚
 𝑥 = ((𝑦 + 1) − 𝑏)/𝑚 [For first intermediate point]
 𝑥 = ((𝑦 + k) − 𝑏)/𝑚 [For 𝑘𝑡ℎ intermediate point]
 𝑥 = ((𝑦 + k + 1) − 𝑏)/𝑚 [For 𝑘 + 1 intermediate point]
Subtract 𝑥 from 𝑥
 𝑥 − 𝑥 = {((𝑦 + k + 1) − 𝑏)/𝑚} − {((𝑦 + k) − 𝑏)/𝑚}
 𝑥 = 𝑥 + 1/𝑚
Similarly
 for ∆x = -1: we obtain 𝑦 =𝑦 −𝑚
 for ∆y = -1: we obtain 𝑥 = 𝑥 − 1/𝑚

10

4
 8/22/2023

Procedure for DDA line algorithm.

Void lineDDA (int xa, int ya, int xb, int yb)
{
int dx = xb – xa, dy = yb – ya, steps, k;
float xincrement, yincrement, x = xa, y = ya;
if (abs(dx)>abs(dy))
{
Steps = abs (dx);
}
else
{
Steps = abs (dy);
}
xincrement = dx/(float) steps;
yincrement = dy/(float) steps;

setpixel (ROUND (x), ROUND (y));

for(k=0;k<steps;k++)
{
x += xincrement;
y += yincrement;
setpixel (ROUND (x), ROUND (y));
}
}

11

Example DDA Algorithm

 Example: Draw line 𝐴𝐵 with coordinates 𝐴(2,2), 𝐵(6,4).

 𝑚= = = 4
3
 𝑚 is “+ve” and less than 1 so Δ𝑥 = 1. 2
 𝑥 = 2, 𝑦 = 2 1
[Plot the initial point as given] 0

 𝑥 = 3, 𝑦 = 𝑦 + 𝑚 = 2 + 0.5 = 2.5 0 1 2 3 4 5 6 7 8
[Plot the first intermediate point by rounding it to (3, 3)]
 𝑥 = 4, 𝑦 = 𝑦 + 𝑚 = 2.5 + 0.5 = 3
[Plot the second intermediate point by rounding it to (4, 3)]
 𝑥 = 5, 𝑦 = 𝑦 + 𝑚 = 3 + 0.5 = 3.5
[Plot the third intermediate point by rounding it to (5, 4)]
 𝑥 = 6, 𝑦 = 4
[Plot End point given]

12

5
 8/22/2023

Introduction to Bresenham’s Line

Algorithm
 An accurate and efficient raster line-generating algorithm,
developed by Bresenham.
 It scan converts line using only incremental integer calculations.
 That can be modified to display circles and other curves.
 Based on slop we take unit step in one direction and decide pixel
of other direction from two candidate pixel.
 If |Δ𝑥| > |Δ𝑦| we sample at unit 𝒙 interval and vice versa.

13

Line Path & Candidate pixel

 Example |ΔX| > |ΔY|, and ΔY is “+ve”. 4
3
 Initial point (Xk, Yk) 2
 Line path 1
0
 Candidate pixels {(Xk+1, Yk), (Xk+1, Yk+1)}
0 1 2 3 4

 Now we need to decide which candidate pixel is more closer to

actual line.
 For that we use decision parameter (Pk) equation.
 Decision parameter can be derived by calculating distance of
actual line from two candidate pixel.

14

6
 8/22/2023

Derivation Bresenham’s Line

Algorithm
 𝑦 = 𝑚𝑥 + 𝑏 [Line Equation] 4
3
 𝑦 = 𝑚(𝑥 ) + 𝑏 [Actual Y value at Xk position] 2
 𝑦 = 𝑚(𝑥 + 1) + 𝑏 [Actual Y value at Xk +1position] 1
0
Distance between actual line position and lower candidate
0 1 2 3 4
pixel
 𝑑 =𝑦−𝑦
 𝑑 = 𝑚(𝑥 + 1) + 𝑏 − 𝑦
Distance between actual line position and upper
candidate pixel
 𝑑 = (𝑦 +1) − 𝑦
 𝑑 = (𝑦 +1) − 𝑚 𝑥 + 1 − 𝑏

15

Contd.
Calculate 𝑑 − 𝑑
 𝑑 −𝑑 = 𝑚 𝑥 +1 +𝑏−𝑦 − (𝑦 +1 − 𝑚 𝑥 + 1 − 𝑏}
 𝑑 − 𝑑 = 𝑚𝑥 + 𝑚 + 𝑏 − 𝑦 − {𝑦 + 1 − 𝑚𝑥 − 𝑚 − 𝑏}
 𝑑 − 𝑑 = 2𝑚 𝑥 + 1 − 2𝑦 + 2𝑏 − 1
 𝑑 − 𝑑 = 2(∆𝑦/∆𝑥) 𝑥 + 1 − 2𝑦 + 2𝑏 − 1 [Put 𝑚 = Δ𝑦/Δ𝑥]
Decision parameter
 𝑝 = ∆𝑥(𝑑 − 𝑑 )
 𝑝 = ∆𝑥 {2(∆𝑦/∆𝑥) 𝑥 + 1 − 2𝑦 + 2𝑏 − 1 }
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + 2∆𝑦 + 2∆𝑥𝑏 − ∆x
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + C [Replacing single constant C for simplicity]
Similarly
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 +C

16

7
 8/22/2023

Contd.
Subtract 𝑝𝑘 from 𝑝
 𝑝 − 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + C − 2∆𝑦𝑥 + 2∆𝑥𝑦 − C
 𝑝 − 𝑝 = 2∆𝑦(𝑥 −𝑥 ) − 2∆𝑥(𝑦 −𝑦 )
[where (𝑥 −𝑥 ) = 1]
 𝑝 = 𝑝 + 2∆𝑦 − 2∆𝑥(𝑦 −𝑦 )
[where (𝑦 −𝑦 ) = 0 or 1 depending on selection of previous pixel]

17

Initial Decision parameter

 The first decision parameter 𝑝0 is calculated using equation of 𝑝𝑘.
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + 2∆𝑦 + 2∆𝑥𝑏 − ∆x
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + 2∆𝑦 + 2∆𝑥𝑏 − ∆x [Put 𝑘 = 0]
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + 2∆𝑦 + 2∆𝑥 𝑦 − 𝑚𝑥 − ∆x
[Substitute 𝑏 = 𝑦0 – 𝑚𝑥0]
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + 2∆𝑦 + 2∆𝑥(𝑦 − (∆𝑦/∆𝑥)𝑥 ) − ∆x
[Substitute 𝑚 = ∆𝑦/Δ𝑥]
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + 2∆𝑦 + 2∆𝑥𝑦 − 2∆𝑦𝑥 − ∆x
 𝑝 = 2∆𝑦 − ∆x
[Initial decision parameter with all terms are constant]

18

8
 8/22/2023

Bresenham’s Line Algorithm

1. Input the two line endpoints and store the left endpoint in (𝑥 , 𝑦 ).
2. Load (𝑥 , 𝑦 ) into the frame buffer; that is, plot the first point.
3. Calculate constants ∆𝑥, ∆𝑦, 2∆𝑦, and 2∆𝑦 − 2∆𝑥, and obtain the
starting value for the decision parameter as
𝑝 = 2∆𝑦 − ∆𝑥
4. At each 𝑥 along the line, starting at 𝑘 = 0, perform the following test:
If 𝑝 < 0, the next point to plot is (𝑥 + 1, 𝑦 ) and
𝑝 = 𝑝 + 2∆𝑦
Otherwise, the next point to plot is (𝑥 + 1, 𝑦 + 1) and
𝑝 = 𝑝 + 2∆𝑦 − 2∆𝑥
5. Repeat step-4 ∆𝑥 times.

19

Discryption of Bresenham’s Line

Algorithm
 Bresenham’s algorithm is generalized to lines with arbitrary slope.
 For lines with positive slope greater than 1 we interchange the roles of
the 𝑥 and 𝑦 directions.
 Also we can revise algorithm to draw line from right endpoint to left
endpoint, both 𝑥 and 𝑦 decrease as we step from right to left.
 When 𝑝𝑘 = 0 we can choose either lower or upper pixel but same for
whole line.
 For the negative slope the procedure are similar except that now one
coordinate decreases as the other increases.
 The special case handle separately by loading directly into the frame
buffer without processing.
 Horizontal line (∆𝑦 = 0),
 Vertical line (∆𝑥 = 0)
 Diagonal line with |∆𝑥| = |∆𝑦|

20

9
 8/22/2023

Example Bresenham’s Line

Algorithm
 Example: Draw line 𝐴𝐵 with coordinates 𝐴(2,2), 𝐵(6,4).
 Plot left end point 𝐴(2, 2).
 Calculate: 4
• ∆𝑥 = 4, 3
• ∆𝑦 = 2, 2
• 2∆𝑦 = 4, 1
• 2∆𝑦 − 2∆𝑥 = −4, 0
 𝑝 = 2∆𝑦 − ∆𝑥 = 0 0 1 2 3 4 5 6 7 8
 Now 𝑝 ≮ 0 so we select upper pixel (3, 3).
 𝑝 = 𝑝 + 2∆𝑦 − 2∆𝑥 = 0 + −4 = −4
 Now 𝑝 < 0 so we select lower pixel (4, 3).
 𝑝 = 𝑝 + 2∆𝑦 = −4 + 4 = 0
 Now 𝑝 ≮ 0 so we select upper pixel (5, 4).
 𝑝 = 𝑝 + 2∆𝑦 − 2∆𝑥 = 0 + −4 = −4
 Now 𝑝 < 0 so we select lower pixel (6, 4).

21

Parallel Execution of Line

Algorithms
 The line-generating algorithms we have discussed so far
determine pixel positions sequentially.
 With multiple processors we can calculate pixel position along a
line path simultaneously.
 One way to use multiple processors is partitioning existing
sequential algorithm into small parts and compute separately.
 Alternatively we can setup the processing so that pixel positions
can be calculated efficiently in parallel.
 Balance the load among the available processors is also important
in parallel processing.

22

10
 8/22/2023

Parallel Bresenham Line

Algorithms
 For 𝑛 number of processors we can set up parallel Bresenham
line algorithm by subdividing the line path into 𝑛 partitions and
simultaneously generating line segment in each of the
subintervals.
 For a line with slope 0 < 𝑚 < 1 and left endpoint coordinate
position (𝑥 , 𝑦 ), we partition the line along the positive 𝑥
direction.
 The distance between beginning 𝑥 positions of adjacent partitions
can be calculated as:
∆𝑥 = (∆𝑥 + 𝑛 − 1)/𝑛
 Where ∆𝑥 is the width of the line and value for partition with ∆𝑥
is computed using integer division.

23

Contd.
 Numbering the partitions and the processors, as 0, 1, 2, up to
𝑛𝑝 – 1, we calculate the starting 𝑥 coordinate for the 𝑘𝑡ℎ partition
as:
𝑥𝑘 = 𝑥0 + 𝑘∆𝑥𝑝
 The change ∆𝑦𝑝 in the 𝑦 direction over each partition is calculated
from the line slope 𝑚 and partition width ∆𝑥𝑝:
∆𝑦𝑝 = 𝑚∆𝑥𝑝
 At the 𝑘𝑡ℎ partition, the starting y coordinate is then
𝑦𝑘 = 𝑦0 + 𝑟𝑜𝑢𝑛𝑑(𝑘∆𝑦𝑝)

24

11
 8/22/2023

IDP for Parallel Bresenham Line

Algorithms
 The initial decision parameter(IDP) for Bresenham's algorithm at
the start of the 𝐾 subinterval is obtained as follow:
 𝑝 = 2∆𝑦𝑥 − 2∆𝑥𝑦 + 2∆𝑦 + 2𝑏∆𝑥 − ∆𝑥

 𝑝 = 2∆𝑦(𝑥 + 𝑘∆𝑥 ) − 2∆𝑥 𝑦 + 𝑟𝑜𝑢𝑛𝑑 𝑘∆𝑦 + 2∆𝑦 + 2∆𝑥(𝑦 −

∆
𝑥 ) − ∆𝑥
∆

 𝑝 = 2∆𝑦𝑥 + 2∆𝑦𝑘∆𝑥 − 2∆𝑥𝑦 − 2∆𝑥𝑟𝑜𝑢𝑛𝑑 𝑘∆𝑦 + 2∆𝑦 + 2∆𝑥𝑦 −

2∆𝑦𝑥 − ∆𝑥
 𝑝 = 2∆𝑦𝑘∆𝑥 − 2∆𝑥𝑟𝑜𝑢𝑛𝑑 𝑘∆𝑦 + 2∆𝑦 − ∆𝑥
 Each processor then calculates pixel positions over its assigned
subinterval.

25

Other Ways for Parallel Execution of Line

Algorithms
 For line with slope greater than 1 we partitioning the line in the 𝑦
direction and calculating beginning 𝑥 values for the positions.
 For negative slopes, we increment coordinate values in one
direction and decrement in the other.
 Another way to set up parallel algorithms on raster system is to
assign each processor to a particular group of screen pixels.
 With sufficient number of processor we can assign each processor
to one pixel within some screen region.
 This can be done by assigning one processor to each of the pixels
within the limit of the bounding rectangle.

26

12
 8/22/2023

Contd.
 Perpendicular distance d from line to a particular pixel is
calculated by:
 𝑑 = 𝐴𝑥 + 𝐵𝑦 + 𝐶
Where
 𝐴 = −∆𝑦/𝑙𝑖𝑛𝑒𝑙𝑒𝑛𝑔𝑡ℎ
 𝐵 = −∆𝑥/𝑙𝑖𝑛𝑒𝑙𝑒𝑛𝑔𝑡ℎ
 𝐶 = (𝑥 ∆𝑦 − 𝑦 ∆𝑥)/𝑙𝑖𝑛𝑒𝑙𝑒𝑛𝑔𝑡ℎ
With
 𝑙𝑖𝑛𝑒𝑙𝑒𝑛𝑔𝑡ℎ = ∆𝑥 + ∆𝑦
 𝐴, 𝐵, and 𝐶 are constant we need to compute only once.

27

Contd.
 For the line each processors need to perform two multiplications
and two additions to compute the pixel distance 𝑑.
 A pixel is plotted if 𝑑 is less than a specified line thickness
parameter.
 Instead of partitioning the screen into single pixels, we can assign
to each processor either a scan line or a column.
 Each processor calculates line intersection with horizontal row or
vertical column of pixels assigned to that processor.

28

13
 8/22/2023

Contd.
 If vertical column is assign to processor then 𝑥 is fix and it will
calculate 𝑦.
 Similarly if horizontal row is assign to processor then 𝑦 is fix and 𝑥
will be calculated.
 Such direct methods are slow in sequential machine but we can
perform very efficiently using multiple processors.

29

Circle
 A circle is defined as the set of points that are all at a given
distance 𝑟 from a center position say (𝑥 , 𝑦 ).

Center
(𝑥 , 𝑦 )

r
Radius

30

14
 8/22/2023

Properties of Circle- Cartesion

Coordinate
 Cartesian coordinates equation :
 (𝑥 − 𝑥 ) +(𝑦 − 𝑦 ) = 𝑟
 We could use this equation to calculate circular boundary points.
 We increment 1 in 𝑥 direction in every steps from 𝑥 − 𝑟 to 𝑥 +
𝑟 and calculate corresponding 𝑦 values at each position as:
 (𝑥 − 𝑥 ) +(𝑦 − 𝑦 ) = 𝑟
 (𝑦 − 𝑦 ) = 𝑟 − (𝑥 − 𝑥 )
 𝑦−𝑦 = ± 𝑟 − (𝑥 − 𝑥)
 y = 𝑦 ± 𝑟 − (𝑥 − 𝑥)

31

Contd.
 But this is not best method as it requires more number of
calculations which take more time to execute.
 And also spacing between the plotted pixel positions is not
uniform.

 We can adjust spacing by stepping through y values and

calculating x values whenever the absolute value of the slop of the
circle is greater than 1.
 But it will increases computation time.

32

15
 8/22/2023

Properties of Circle- Polar

Coordinate
 Another way to eliminate the non-uniform spacing is to draw circle
using polar coordinates ‘r’ and ‘’.
 Calculating circle boundary using polar equation is given by pair of
equations which is as follows.
𝑥 = 𝑥 + 𝑟 cos 
𝑦 = 𝑦 + 𝑟 sin 
 When display is produce using these equations using fixed angular
step size circle is plotted with uniform spacing.
 The step size ‘’ is chosen according to application and display
device.
 For a more continuous boundary on a raster display we can set the
step size at .

33

Properties of Circle- Symmetry

 Computation can be reduced by considering symmetry city
property of circles.
 The shape of circle is similar in each octant.

(-3, 4) (3, 4)
(-Y, X) (Y, X)
(-4, 3) (4, 3)
(-X, Y) (X, Y)
45𝑂
(-4, -3)
(4, -3)
(-X, -Y)
(X, -Y)

(-Y, -X) (Y, -X)

(-3, -4) (3, -4)

34

16
 8/22/2023

Circle Algorithm
 Taking advantage of this symmetry property of circle we can
generate all pixel position on boundary of circle by calculating only
one sector from 𝑥 = 0 to 𝑥 = 𝑦.
 Determining pixel position along circumference of circle using any
of two equations shown above still required large computation.
 More efficient circle algorithm are based on incremental
calculation of decision parameters, as in the Bresenham line
algorithm.
 Bresenham’s line algorithm can be adapted to circle generation by
setting decision parameter for finding closest pixel to the
circumference at each sampling step.

35

Contd.
 A method for direct distance comparison to test the midpoint
between two pixels to determine if this midpoint is inside or
outside the circle boundary.
 This method is easily applied to other conics also.
 Midpoint approach generates same pixel position as generated by
bresenham’s circle algorithm.
 The error involve in locating pixel positions along any conic section
using midpoint test is limited to one-half the pixel separation.

36

17
 8/22/2023

Introduction to Midpoint Circle

Algorithm
 In this we sample at unit interval and determine the closest pixel
position to the specified circle path at each step.
 Given radius 𝑟 and center (𝑥 , 𝑦 )
 We first setup our algorithm to calculate circular path coordinates
for center (0, 0).
 And then we will transfer calculated pixel position to center
(𝑥 , 𝑦 ) by adding 𝑥 to 𝑥 and 𝑦 to 𝑦.
 Along the circle section from 𝑥 = 0 to 𝑥 = 𝑦 in the first quadrant,
the slope of the curve varies from 0 to −1.
 So we can step unit step in positive 𝑥 direction over this octant
and use a decision parameter to determine which of the two
possible 𝑦 position is closer to the circular path.

37

Decision Parameter Midpoint Circle

Algorithm
 Position in the other seven octants are then obtain by symmetry.
 For the decision parameter we use the circle function which is:
𝑓 𝑥, 𝑦 = 𝑥 + 𝑦 − 𝑟
< 0 𝑖𝑓 𝑥, 𝑦 𝑖𝑠 𝑖𝑛𝑠𝑖𝑑𝑒 𝑡ℎ𝑒 𝑐𝑖𝑟𝑐𝑙𝑒 𝑏𝑜𝑢𝑛𝑑𝑎𝑟𝑦
𝑓 𝑥, 𝑦 = 0 𝑖𝑓 𝑥, 𝑦 𝑖𝑠 𝑜𝑛 𝑡ℎ𝑒 𝑐𝑖𝑟𝑐𝑙𝑒 𝑏𝑜𝑢𝑛𝑑𝑎𝑟𝑦
> 0 𝑖𝑓 𝑥, 𝑦 𝑖𝑠 𝑜𝑢𝑡𝑠𝑖𝑑𝑒 𝑡ℎ𝑒 𝑐𝑖𝑟𝑐𝑙𝑒 𝑏𝑜𝑢𝑛𝑑𝑎𝑟𝑦
 Above equation we calculate for the mid positions between pixels
near the circular path at each sampling step.
 And we setup incremental calculation for this function as we did in
the line algorithm.

38

18
 8/22/2023

Midpoint between Candidate pixel

 Figure shows the midpoint between the two candidate pixels at
sampling position 𝑥 + 1.
𝒙𝟐 + 𝒚𝟐 − 𝒓 𝟐 = 𝟎

yk Midpoint
Candidate
yk+1 Pixel

xk xk+1 xk+2

 Assuming we have just plotted the pixel at 𝑥 , 𝑦 .

 Next we determine whether the pixel at position 𝑥 + 1, 𝑦 or
the one at position 𝑥 + 1, 𝑦 − 1 is closer to circle boundary.

39

Derivation Midpoint Circle

Algorithm
 So for finding which pixel is more closer using decision parameter
evaluated at the midpoint between two candidate pixels as below:

 𝑝 =𝑓 𝑥 + 1, 𝑦 −

 𝑝 = 𝑥 +1 + 𝑦 − −𝑟
 If 𝑝 < 0, midpoint is inside the circle and the pixel on the scan
line 𝑦 is closer to circle boundary.
 Otherwise midpoint is outside or on the boundary and we select
the scan line 𝑦 − 1.

40

19
 8/22/2023

Contd.
 Successive decision parameters are obtain using incremental calculations as follows:

 𝑝 =𝑓 𝑥 + 1, 𝑦 −

 𝑝 = 𝑥 +1 +1 + 𝑦 − −𝑟
 Now we can obtain recursive calculation using equation of 𝑝 and 𝑝 as follow

 𝑝 −𝑝 = 𝑥 +1 +1 + 𝑦 − −𝑟 − 𝑥 +1 + 𝑦 − −

 𝑝 −𝑝 = 𝑥 +1 +2 𝑥 +1 +1+𝑦 −𝑦 + −𝑟 − 𝑥 +1 −
𝑦 +𝑦 − +𝑟

41

Contd.
 𝑝 −𝑝 = 𝑥 +1 +2 𝑥 +1 +1+𝑦 −𝑦 + −
𝑟 − 𝑥 +1 −𝑦 +𝑦 − +𝑟
 𝑝 −𝑝 =2 𝑥 +1 +1+𝑦 −𝑦 −𝑦 +𝑦
 𝑝 − 𝑝 = 2 𝑥 + 1 + (𝑦 − 𝑦 ) − (𝑦 −𝑦 ) + 1
 𝑝 = 𝑝 + 2 𝑥 + 1 + (𝑦 − 𝑦 ) − (𝑦 −𝑦 ) + 1
 Now we can put 2𝑥 = 2(𝑥 + 1)
 𝑝 = 𝑝 + 2𝑥 + (𝑦 − 𝑦 ) − (𝑦 −𝑦 ) + 1

42

20
 8/22/2023

Contd.
 𝑝 = 𝑝 + 2𝑥 + (𝑦 − 𝑦 ) − (𝑦 −𝑦 ) + 1
 In above equation 𝑦 is either 𝑦 or 𝑦 − 1 depending on the
sign of the 𝑝 .
 If we select 𝑦 = 𝑦𝑘 .
 𝑝 = 𝑝 + 2𝑥 +1
 If we select 𝑦 = 𝑦𝑘 – 1.
 𝑝 = 𝑝 + 2𝑥 + (𝑦 − 𝑦 ) − (𝑦 −𝑦 ) + 1
 𝑝 = 𝑝 + 2𝑥 + (𝑦 +𝑦 )(𝑦 −𝑦 ) − (𝑦 −𝑦 ) + 1
 𝑝 = 𝑝 + 2𝑥 + (𝑦𝑘 – 1 + 𝑦 )(𝑦𝑘 – 1 − 𝑦 ) − (𝑦𝑘 – 1 −
𝑦 )+1
 𝑝 = 𝑝 + 2𝑥 + (2𝑦𝑘 – 1)(– 1) − (– 1) + 1

43

Contd.
 𝑝 = 𝑝 + 2𝑥 − 2𝑦𝑘 + 1 + 1 + 1
 𝑝 = 𝑝 + 2𝑥 − (2𝑦𝑘 − 2) + 1
 Now put 2𝑦 = 2𝑦 − 2.
 𝑝 = 𝑝 + 2𝑥 − 2𝑦 +1

44

21
 8/22/2023

IDP Midpoint Circle Algorithm

 The initial decision parameter(IDP) is obtained by evaluating the
circle function at the start position 𝑥 , 𝑦 = (0, 𝑟) as follows.

 𝑝 =𝑓 0 + 1, 𝑟 −

 𝑝 =1 + 𝑟− −𝑟

 𝑝 =1+𝑟 −𝑟+ −𝑟

 𝑝 = −𝑟
 𝑝 ≈1−𝑟

45

Algorithm for Midpoint Circle Generation

1. Input radius r and circle center (𝑥 , 𝑦 ), and obtain the first point on the
circumference of a circle centered on the origin as
𝑥 , 𝑦 = (0, 𝑟)
2. calculate the initial value of the decision parameter as
5
𝑝 = −𝑟
4
3. At each 𝑥 position, starting at 𝑘 = 0, perform the following test:
If 𝑝 < 0, the next point along the circle centered on (0, 0) is 𝑥 + 1, 𝑦 &
𝑝 = 𝑝 + 2𝑥 +1
Otherwise, the next point along the circle is 𝑥 + 1, 𝑦 − 1 &
𝑝 = 𝑝 + 2𝑥 + 1 − 2𝑦
Where 2𝑥 = 2𝑥 + 2, & 2𝑦 = 2𝑦 − 2.
4. Determine symmetry points in the other seven octants.
5. Move each calculated pixel position (𝑥, 𝑦) onto the circular path centered on
(𝑥 , 𝑦 ) and plot the coordinate values:
𝑥 =𝑥+𝑥 ,𝑦 =𝑦+𝑦
6. Repeat steps 3 through 5 until 𝑥 ≥ 𝑦.

46

22
 8/22/2023

Example Midpoint Circle Algorithm

 Example: Draw circle with radius 𝑟 = 10, and center of circle is
1, 1 (Only one octant 𝑥 = 0 to 𝑥 = 𝑦 )
 First we find pixel position for octant 𝑥 = 0 to 𝑥 = 𝑦 for center
0, 0
𝒌 𝒑𝒌 (𝒙𝒌 𝟏 , 𝒚𝒌 𝟏 )
 𝑝 =1−𝑟 0 -9 (1, 10)
 𝑝 = 1 − 10 = −9 1 -6 (2, 10)
2 -1 (3, 10)
 Now 𝑝 < 0 we select (1, 10)
3 6 (4, 9)
 𝑝 = 𝑝 + 2𝑥 + 1 4 -3 (5, 9)
 𝑝 = −9 + 2 + 1 = −6 5 8 (6, 8)

 Now 𝑝 < 0 we select (2, 10) 6 5 (7, 7)

47

Contd.
 𝑝 = 𝑝 + 2𝑥 + 1 𝒌 𝒑𝒌 (𝒙𝒌 𝟏 , 𝒚𝒌 𝟏 )
0 -9 (1, 10)
 𝑝 = −6 + 4 + 1 = −1
1 -6 (2, 10)
 Now 𝑝 < 0 we select (3, 10) 2 -1 (3, 10)
 𝑝 = 𝑝 + 2𝑥 + 1 3 6 (4, 9)
 𝑝 = −1 + 6 + 1 = 6 4 -3 (5, 9)
5 8 (6, 8)
 Now 𝑝 ≮ 0 we select (4, 9)
6 5 (7, 7)
 𝑝 = 𝑝 + 2𝑥 + 1 − 2𝑦
 𝑝 = 6 + 8 + 1 − 18 = −3
 Now 𝑝 < 0 we select (5, 9)

48

23
 8/22/2023

Contd.
 𝑝 = 𝑝 + 2𝑥 + 1 𝒌 𝒑𝒌 (𝒙𝒌 𝟏 , 𝒚𝒌 𝟏 )
0 -9 (1, 10)
 𝑝 = −3 + 10 + 1 = 8
1 -6 (2, 10)
 Now 𝑝 ≮ 0 we select (6, 8) 2 -1 (3, 10)
 𝑝 = 𝑝 + 2𝑥 + 1 − 2𝑦 3 6 (4, 9)
 𝑝 = 8 + 12 + 1 − 16 = 5 4 -3 (5, 9)
5 8 (6, 8)
 Now 𝑝 ≮ 0 we select (7, 7)
6 5 (7, 7)
 Now Loop exit as 𝑥 ≥ 𝑦, as
 in our case 7 ≥ 7

49

Contd.
 Than we calculate pixel position for given center 1, 1 using
equations:
Center (0, 0) Center (1, 1)
 𝑥 = 𝑥+𝑥 =𝑥+1
(1, 10) (2, 11)
 𝑦 =𝑦+𝑦 = 𝑦+1
(2, 10) (3, 11)
(3, 10) (4, 11)
(4, 9) (5, 10)
(5, 9) (6, 10)
(6, 8) (7, 9)
(7, 7) (8, 8)

50

24
 8/22/2023

Contd.
 Plot the pixel.
12
 First plot initial point. 11
(1, 11) 10
9
Center (1, 1)
8
(2, 11) 7
6
(3, 11)
5
(4, 11) 4
(5, 10) 3
(6, 10) 2
Center
1
(7, 9) (1, 1)
0
(8, 8)
0 1 2 3 4 5 6 7 8 9 10 11

51

Ellipse
 AN ellipse is defined as the set of points such that the sum of the
distances from two fixed positions (foci) is same for all points.

𝑝(𝑥, 𝑦)
𝑑1
𝑑2
𝑓1 𝑓2

52

25
 8/22/2023

Contd.
 If we labeled distance from two foci to any point on ellipse
boundary as 𝑑 and 𝑑 then the general equation of an ellipse can
be written as:
𝑑 + 𝑑 = 𝐶𝑜𝑛𝑠𝑡𝑎𝑛𝑡
 Expressing distance in terms of focal coordinates 𝑓 = 𝑥 , 𝑦 and
𝑓 = 𝑥 , 𝑦 we have
 𝑥−𝑥 + 𝑦−𝑦 + 𝑥−𝑥 + 𝑦−𝑦 = 𝐶𝑜𝑛𝑠𝑡𝑎𝑛𝑡
[Using Distance formula]

53

Properties of Ellipse-Specifying
Equations
 An interactive method for specifying an ellipse in an arbitrary
orientation is to input
 two foci and
 a point on the ellipse boundary.
 With this three coordinates we can evaluate constant in equation:
𝑥−𝑥 + 𝑦−𝑦 + 𝑥−𝑥 + 𝑦−𝑦 = 𝐶𝑜𝑛𝑠𝑡𝑎𝑛𝑡
 We can also write this equation in the form
𝐴𝑥 + 𝐵𝑦 + 𝐶𝑥𝑦 + 𝐷𝑥 + 𝐸𝑦 + 𝐹 = 0
 Where the coefficients 𝐴, 𝐵, 𝐶, 𝐷, 𝐸, and 𝐹 are evaluated in terms
of the focal coordinates and the dimensions of the major and
minor axes of the ellipse.

54

26
 8/22/2023

Contd.
 Then coefficient in 𝐴𝑥 + 𝐵𝑦 + 𝐶𝑥𝑦 + 𝐷𝑥 + 𝐸𝑦 + 𝐹 = 0 can be
evaluated and used to generate pixels along the elliptical path.
 We can say ellipse is in standard position if their major and minor
axes are parallel to x-axis and y-axis.
 Ellipse equation are greatly simplified if we align major and minor
axis with coordinate axes i.e. x-axis and y-axis.

X-axis

Y-axis

55

Contd.
 Equation of ellipse can be written in terms of the ellipse center
coordinates (𝑥 , 𝑦 ) and parameters 𝑟 and 𝑟 as.
𝑥−𝑥 𝑦−𝑦
+ =1
𝑟 𝑟
 Using the polar coordinates r and θ, we can also describe the
ellipse in standard position with the parametric equations:
𝑥 = 𝑥 + 𝑟 cos θ
𝑦 = 𝑦 + 𝑟 sin θ

𝑟 𝑟

(𝑥 , 𝑦 )

56

27
 8/22/2023

Properties of Ellipse-Symmetry
 Symmetry property further reduced computations.
 An ellipse in standard position is symmetric between quadrant.

(−2, 4) (2, 4)
(−𝑥, 𝑦) (𝑥, 𝑦)
𝑟
𝑟
(𝑥 , 𝑦 )

(−𝑥, −𝑦) (𝑥, −𝑦)

(−2, −4) (2, −4)

57

Introduction to Midpoint Ellipse

Algorithm
 Given parameters 𝑟 , 𝑟 , & (𝑥 , 𝑦 ).
 We determine points (𝑥, 𝑦) for an ellipse in standard position
centered on the origin.
 Then we shift the points so the ellipse is centered at (𝑥 , 𝑦 ).
 If we want to display the ellipse in nonstandard position then we
rotate the ellipse about its center to align with required direction.
 For the present we consider only the standard position.
 We draw ellipse in first quadrant and than use symmetry property
for other three quadrant.

58

28
 8/22/2023

Regions in Midpoint Ellipse

Algorithm
 In this method we divide first quadrant into two parts according to
the slope of an ellipse
 Boundary divides region at Region 1
• slope = -1. 𝑦
 We take unit step in X direction 𝑆𝑙𝑜𝑝𝑒 = −1
• If magnitude of ellipse slope < 1 (Region 1). 𝑟
Region 2
 We take unit step in Y direction
𝑟 𝑥
• If magnitude of ellipse slope > 1 (Region 2).

59

Ways of Processing Midpoint Ellipse

Algorithm
 We can start from (0, 𝑟 ) and step clockwise along the elliptical
path in the first quadrant
 Alternatively, we could start at (𝑟 , 0 ) and select points in a
counterclockwise order.
 With parallel processors, we could calculate pixel positions in the
two regions simultaneously.
 Here we consider sequential implementation of midpoint
algorithm.
 We take the start position at (0, 𝑟 ) and steps along the elliptical
path in clockwise order through the first quadrant.

60

29
 8/22/2023

Decision Parameter Midpoint Ellipse

Algorithm
 We define ellipse function for center of ellipse at (0, 0) as follows.
 𝑓 𝑥, 𝑦 = 𝑟 𝑥 + 𝑟 𝑦 − 𝑟 𝑟
 Which has the following properties:
<0 𝑖𝑓 𝑥, 𝑦 𝑖𝑠 𝑖𝑛𝑠𝑖𝑑𝑒 𝑡ℎ𝑒 𝑒𝑙𝑙𝑖𝑝𝑠𝑒 𝑏𝑜𝑢𝑛𝑑𝑎𝑟𝑦
𝑓 𝑥, 𝑦 =0 𝑖𝑓 𝑥, 𝑦 𝑖𝑠 𝑜𝑛 𝑡ℎ𝑒 𝑒𝑙𝑙𝑖𝑝𝑠𝑒 𝑏𝑜𝑢𝑛𝑑𝑎𝑟𝑦
> 0 𝑖𝑓 𝑥, 𝑦 𝑖𝑠 𝑜𝑢𝑡𝑠𝑖𝑑𝑒 𝑡ℎ𝑒 𝑒𝑙𝑙𝑖𝑝𝑠𝑒 𝑏𝑜𝑢𝑛𝑑𝑎𝑟𝑦
 Thus the ellipse function serves as the decision parameter in the
midpoint ellipse algorithm.
 At each sampling position we select the next pixel from two
candidate pixel.

61

Processing Steps of Midpoint Ellipse

Algorithm
 Starting at (0, 𝑟 ) we take unit step in 𝑥 direction until we reach
the boundary between region-1 and region-2.
 Then we switch to unit steps in 𝑦 direction in remaining portion on
ellipse in first quadrant.
Region 1
 At each step we need to test the value 𝑦
of the slope of the curve for deciding 𝑆𝑙𝑜𝑝𝑒 = −1
the end point of the region-1. 𝑟
Region 2
𝑟 𝑥

62

30
 8/22/2023

Decide Boundary between Region

1 and 2
 The ellipse slope is calculated using following equation.

 =−
 At boundary between region 1 and 2 slope= -1 and equation
become.
 2𝑟 𝑥 = 2𝑟 𝑦
 Therefore we move out of region 1 whenever following equation
is false:
 2𝑟 𝑥 ≤ 2𝑟 𝑦

63

Midpoint between Candidate pixel in

Region 1
 Figure shows the midpoint between the two candidate pixels at
sampling position 𝑥 + 1 in the first region.

ry2x2+rx2y2-rx2ry2=0

yk Midpoint
yk-1 Candidate
Pixel
xk xk+1 xk+2

 Assume we are at (𝑥 , 𝑦 ) position and we determine the next position

along the ellipse path, by evaluating decision parameter at midpoint
between two candidate pixels.

 𝑝1 = 𝑓 𝑥 + 1, 𝑦 −

64

31
 8/22/2023

Derivation for Region 1

 𝑝1 = 𝑓 𝑥 + 1, 𝑦 −

 𝑝1 = 𝑟 (𝑥 + 1) +𝑟 𝑦 − −𝑟 𝑟
 If 𝑝1 < 0, the midpoint is inside the ellipse and the pixel on scan
line 𝑦 is closer to ellipse boundary
 Otherwise the midpoint is outside or on the ellipse boundary and
we select the pixel 𝑦 − 1.

65

Contd.
 At the next sampling position decision parameter for region 1 is
evaluated as.

 𝑝1 =𝑓 𝑥 + 1, 𝑦 −

 𝑝1 =𝑟 𝑥 +1 +1 +𝑟 𝑦 − −𝑟 𝑟
 Now subtract 𝑝1 from 𝑝1

 𝑝1 − 𝑝1 = 𝑟 𝑥 +1 +1 +𝑟 𝑦 − −𝑟 𝑟 −

𝑟 (𝑥 + 1) −𝑟 𝑦 − +𝑟 𝑟

66

32
 8/22/2023

Contd.
 𝑝1 − 𝑝1 = 𝑟 𝑥 +1 +1 +𝑟 𝑦 − −

𝑟 (𝑥 + 1) −𝑟 𝑦 −

 𝑝1 − 𝑝1 = 𝑟 𝑥 +1 + 2𝑟 𝑥 +1 +𝑟 +𝑟 𝑦 −

− 𝑟 (𝑥 + 1) −𝑟 𝑦 −

 𝑝1 − 𝑝1 = 2𝑟 𝑥 +1 +𝑟 +𝑟 𝑦 − − 𝑦 −
 Now making 𝑝1 as subject.

 𝑝1 = 𝑝1 + 2𝑟 𝑥 +1 +𝑟 +𝑟 𝑦 − − 𝑦 −

67

Contd.
 𝑝1 = 𝑝1 + 2𝑟 𝑥 +1 +𝑟 +𝑟 𝑦 − −

𝑦 −
 𝑦 is either 𝑦 or 𝑦 − 1, depends on the sign of 𝑝1

68

33
 8/22/2023

IDP for Region 1

 Now we calculate the initial decision parameter 𝑝1 by putting
𝑥 , 𝑦 = (0, 𝑟 ) as follow.

 𝑝1 = 𝑓 0 + 1, 𝑟 −

 𝑝1 = 𝑟 (1) +𝑟 𝑟 − −𝑟 𝑟

 𝑝1 = 𝑟 +𝑟 𝑟 − −𝑟 𝑟

 𝑝1 = 𝑟 −𝑟 𝑟 + 𝑟

69

Midpoint between Candidate pixel in

Region 2
 Now we similarly calculate over region-2.
 Unit stepping in negative 𝑦 direction and the midpoint is now
taken between horizontal pixels at each step.
ry2x2+rx2y2-rx2ry2=0

yk Midpoint
yk-1 Candidate
Pixel
xk xk+1 xk+2
 For this region, the decision parameter is evaluated as follows.

 𝑝2 = 𝑓 𝑥 + ,𝑦 −1

70

34
 8/22/2023

Derivation for Region 2

 𝑝2 = 𝑓 𝑥 + ,𝑦 −1

 𝑝2 = 𝑟 𝑥 + +𝑟 𝑦 −1 −𝑟 𝑟
 If 𝑝2 > 0 the midpoint is outside the ellipse boundary, and we
select the pixel at 𝑥 .
 If 𝑝2 ≤ 0 the midpoint is inside or on the ellipse boundary and
we select 𝑥 + 1.

71

Contd.
 At the next sampling position decision parameter for region 2 is
evaluated as.

 𝑝2 =𝑓 𝑥 + ,𝑦 −1

 𝑝2 =𝑟 𝑥 + +𝑟 𝑦 −1 −1 −𝑟 𝑟
 Now subtract 𝑝2 from 𝑝2

 𝑝2 − 𝑝2 = 𝑟 𝑥 + +𝑟 𝑦 −1 −1 −𝑟 𝑟 −

𝑟 𝑥 + −𝑟 𝑦 −1 +𝑟 𝑟

72

35
 8/22/2023

Contd.
 𝑝2 − 𝑝2 = 𝑟 𝑥 + +𝑟 𝑦 −1 −1 −𝑟 𝑟 −

𝑟 𝑥 + −𝑟 𝑦 −1 +𝑟 𝑟

 𝑝2 − 𝑝2 = 𝑟 𝑥 + +𝑟 𝑦 −1 − 2𝑟 𝑦 −1 +

𝑟 −𝑟 𝑥 + −𝑟 𝑦 −1

 𝑝2 − 𝑝2 = 𝑟 𝑥 + − 2𝑟 𝑦 −1 +𝑟 −𝑟 𝑥 +

 𝑝2 − 𝑝2 = −2𝑟 𝑦 −1 +𝑟 +𝑟 𝑥 + − 𝑥 +

73

Contd.
 𝑝2 − 𝑝2 = −2𝑟 𝑦 −1 +𝑟 +𝑟 𝑥 + −

𝑥 +
 Now making 𝑝2 as subject.

 𝑝2 = 𝑝2 − 2𝑟 𝑦 −1 +𝑟 +𝑟 𝑥 + −

𝑥 +
 Here 𝑥 is either 𝑥 or 𝑥 + 1, depends on the sign of 𝑝2 .

74

36
 8/22/2023

IDP for Region 2

 In region-2 initial position is selected which is last position of
region one and the initial decision parameter is calculated as
follows.

 𝑝2 = 𝑓 𝑥 + ,𝑦 − 1

 𝑝2 = 𝑟 𝑥 + +𝑟 𝑦 −1 −𝑟 𝑟
 For simplify calculation of 𝑝2 we could also select pixel position
in counterclockwise order starting at (𝑟 , 0).

75

Algorithm for Midpoint Ellipse Generation

1. Input 𝑟 , 𝑟 and ellipse center (𝑥 , 𝑦 ), and obtain the first point on an ellipse
centered on the origin as
𝑥 , 𝑦 = (0, 𝑟 )

2. Calculate the initial value of the decision parameter in region 1 as

𝑝1 = 𝑟 − 𝑟 𝑟 + 𝑟

3. At each 𝑥 position in region 1, starting at 𝑘 = 0, perform the following test:

If 𝑝1 < 0, than the next point along the ellipse is (𝑥 , 𝑦 ) and
𝑝1 = 𝑝1 + 2𝑟 𝑥 +𝑟

Otherwise, the next point along the ellipse is (𝑥 , 𝑦 − 1) and

𝑝1 = 𝑝1 + 2𝑟 𝑥 + 𝑟 − 2𝑟 𝑦
With
2𝑟 𝑥 = 2𝑟 𝑥 + 2𝑟 , 2𝑟 𝑦 = 2𝑟 𝑦 − 2𝑟
And continue until 2𝑟 𝑥 ≤ 2𝑟 𝑦

76

37
 8/22/2023

Contd.
4. Calculate the initial value of the decision parameter in region 2 using the last
point 𝑥 , 𝑦 calculated in region 1 as
𝑝2 = 𝑟 𝑥 + +𝑟 𝑦 −1 −𝑟 𝑟

5. At each 𝑦 position in region-2, starting at 𝑘 = 0, perform the following test:

If 𝑝2 > 0, the next point along the ellipse is (𝑥 , 𝑦 − 1) and
𝑝2 = 𝑝2 − 2𝑟 𝑦 +𝑟

Otherwise, the next point along the ellipse is (𝑥 + 1, 𝑦 − 1) and

𝑝2 = 𝑝2 − 2𝑟 𝑦 + 𝑟 + 2𝑟 𝑥
Using the same incremental calculations for 𝑥 and 𝑦 as in region 1.

6. Determine symmetry points in the other three quadrants.

7. Move each calculated pixel position (𝑥, 𝑦) onto the elliptical path centered on
(𝑥 , 𝑦 ) and plot the coordinate values:
𝑥 =𝑥+𝑥 ,𝑦 =𝑦+𝑦

8. Repeat the steps for region 2 until 𝑦 ≥ 0.

77

Example Midpoint Ellipse

Algorithm
 Example: Calculate intermediate pixel position (For first quadrant)
for ellipse with 𝑟 = 8, 𝑟 = 6 and ellipse center is at origin
 Initial point 0, 𝑟 = (0, 6)

 𝑝1 = 𝑟 −𝑟 𝑟 + 𝑟

 𝑝1 = 6 − 8 ∗ 6 + 8
 𝑝1 = −332

78

38
 8/22/2023

Contd.
 𝑝1 = −332 K p1k (xk+1, yk+1)
0 -332 (1, 6)
 𝑝1 = 𝑝1 + 2𝑟 𝑥 +1 +𝑟 + 1 -224 (2, 6)
𝑟 𝑦 − − 𝑦 − 2 -44 (3, 6)
3 208 (4, 5)
 𝑝1 = −332 + 2 ∗ 6 0 + 1 + 6 +
4 -108 (5, 5)
5 288 (6, 4)
8 6− − 6− = −224
6 244 (7, 3)

Calculation stop when 𝐼𝑓 𝑝1 < 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦

2𝑟 𝑥 > 2𝑟 𝑦 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦 −1

79

Contd.
 𝑝1 = 𝑝1 + 2𝑟 𝑥 +1 +𝑟 + K p1k (xk+1, yk+1)
𝑟 𝑦 − − 𝑦 −
0 -332 (1, 6)
1 -224 (2, 6)
2 -44 (3, 6)
 𝑝1 = −224 + 2 ∗ 6 1 + 1 + 6 +
3 208 (4, 5)
8 6− − 6− = −44
4 -108 (5, 5)
5 288 (6, 4)
6 244 (7, 3)

Calculation stop when 𝐼𝑓 𝑝1 < 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦

2𝑟 𝑥 > 2𝑟 𝑦 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦 −1

80

39
 8/22/2023

Contd.
 𝑝1 = 𝑝1 + 2𝑟 𝑥 +1 +𝑟 + K p1k (xk+1, yk+1)
𝑟 𝑦 − − 𝑦 −
0 -332 (1, 6)
1 -224 (2, 6)
2 -44 (3, 6)
 𝑝1 = −44 + 2 ∗ 6 2 + 1 + 6 +
3 208 (4, 5)
8 6− − 6− = 208
4 -108 (5, 5)
5 288 (6, 4)
6 244 (7, 3)

Calculation stop when 𝐼𝑓 𝑝1 < 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦

2𝑟 𝑥 > 2𝑟 𝑦 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦 −1

81

Contd.
 𝑝1 = 𝑝1 + 2𝑟 𝑥 +1 +𝑟 + K p1k (xk+1, yk+1)
𝑟 𝑦 − − 𝑦 −
0 -332 (1, 6)
1 -224 (2, 6)
2 -44 (3, 6)
 𝑝1 = 208 + 2 ∗ 6 3 + 1 + 6 +
3 208 (4, 5)
8 5− − 6− = −108
4 -108 (5, 5)
5 288 (6, 4)
6 244 (7, 3)

Calculation stop when 𝐼𝑓 𝑝1 < 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦

2𝑟 𝑥 > 2𝑟 𝑦 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦 −1

82

40
 8/22/2023

Contd.
 𝑝1 = 𝑝1 + 2𝑟 𝑥 +1 +𝑟 + K p1k (xk+1, yk+1)
𝑟 𝑦 − − 𝑦 −
0 -332 (1, 6)
1 -224 (2, 6)
2 -44 (3, 6)
 𝑝1 = −108 + 2 ∗ 6 4 + 1 + 6 +
3 208 (4, 5)
8 5− − 5− = 288
4 -108 (5, 5)
5 288 (6, 4)
6 244 (7, 3)

Calculation stop when 𝐼𝑓 𝑝1 < 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦

2𝑟 𝑥 > 2𝑟 𝑦 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦 −1

83

Contd.
 𝑝1 = 𝑝1 + 2𝑟 𝑥 +1 +𝑟 + K p1k (xk+1, yk+1)
𝑟 𝑦 − − 𝑦 −
0 -332 (1, 6)
1 -224 (2, 6)
2 -44 (3, 6)
 𝑝1 = 288 + 2 ∗ 6 5 + 1 + 6 +
3 208 (4, 5)
8 4− − 5− = 244
4 -108 (5, 5)
5 288 (6, 4)
6 244 (7, 3)

Calculation stop when 𝐼𝑓 𝑝1 < 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦

2𝑟 𝑥 > 2𝑟 𝑦 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑦 =𝑦 −1

84

41
 8/22/2023

Contd.
K p2k (xk+1, yk+1)
 𝑝2 = 𝑟 𝑥 + +𝑟 𝑦 −1 −
0 -23 (8, 2)
𝑟 𝑟
1 361 (8, 1)
2 297 (8, 0)
 𝑝2 = 6 7+ +8 3−1 −
8 6 = −23

Calculation stop when 𝐼𝑓 𝑝2 > 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑥 =𝑥

𝑦 ≤0 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑥 =𝑥 +1

85

Contd.
 𝑝2 = 𝑝2 − 2𝑟 𝑦 −1 +𝑟 + K p2k (xk+1, yk+1)
𝑟 𝑥 + − 𝑥 + 0 -23 (8, 2)
1 361 (8, 1)
 𝑝2 = −23 − 2 ∗ 8 3−1 +8 +
2 297 (8, 0)

6 8+ − 7+ = 361

Calculation stop when 𝐼𝑓 𝑝2 > 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑥 =𝑥

𝑦 ≤0 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑥 =𝑥 +1

86

42
 8/22/2023

Contd.
 𝑝2 = 𝑝2 − 2𝑟 𝑦 −1 +𝑟 + K p2k (xk+1, yk+1)
𝑟 𝑥 + − 𝑥 + 0 -23 (8, 2)
1 361 (8, 1)
 𝑝2 = 361 − 2 ∗ 8 2−1 +8 +
2 297 (8, 0)

6 8+ − 8+ = 297

Calculation stop when 𝐼𝑓 𝑝2 > 0 𝑠𝑜 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑥 =𝑥

𝑦 ≤0 Else 𝑤𝑒 𝑠𝑒𝑙𝑒𝑐𝑡 𝑥 =𝑥 +1

87

Contd.
 Plot the pixel.
12
 Plot initial point(0, 6) 11
Center (0, 0) Center (0, 0) 10
9
(1, 6) (8, 2) 8
(2, 6) (8, 1) 7
(3, 6) 6
(8, 0)
5
(4, 5) 4
(5, 5) 3
(6, 4) 2
(7, 3) 1
Center 0
(0, 0) 0 1 2 3 4 5 6 7 8 9 10 11

88

43
 8/22/2023

Filled-Area Primitives
 In practical we often use polygon which are filled with some
colour or pattern inside it.
 There are two basic approaches to area filling on raster systems.
• One way to fill an area is to determine the overlap intervals for scan line
that cross the area.
• Another method is to start from a given interior position and paint outward
from this point until we encounter boundary.

89

Scan-Line Polygon Fill Algorithm

 For each scan-line crossing a polygon, the algorithm locates the
intersection points are of scan line with the polygon edges.
 This intersection points are stored from left to right.
 Frame buffer positions between each pair of intersection point are
set to specified fill color.

Scan line

90

44
 8/22/2023

Contd.
 Scan line intersects at vertex are required special handling.
 For vertex we must look at the other endpoints of the two line
segments which meet at this vertex.
• If these points lie on the same (up or down) side of the scan line, then that
point is counts as two intersection points.
• If they lie on opposite sides of the scan line, then the point is counted as
single intersection.

Scan line
Scan line

Scan line

91

Edge Intersection Calculation with Scan-

Line
 Coherence methods often involve incremental calculations applied
along a single scan line or between successive scan lines.
 In determining edge intersections, we can set up incremental
coordinate calculations along any edge by exploiting the fact that
the slope of the edge is constant from one scan line to the next.
 For above figure we can write slope equation for polygon
boundary as follows.

 𝑚=
 Since change in 𝑦 coordinates between the two scan lines is
simply
 𝑦 −𝑦 =1

92

45
 8/22/2023

Contd.
 So slope equation can be modified as follows

 𝑚=

 𝑚=

 𝑥 −𝑥 =

 𝑥 =𝑥 +
 Each successive 𝑥 intercept can thus be calculated by adding the
inverse of the slope and rounding to the nearest integer.

93

Edge Intersection Calculation with Scan-Line for parallel

execution
 For parallel execution of this algorithm we assign each scan line to
separate processor in that case instead of using previous 𝑥 values
for calculation we use initial 𝑥 values by using equation as.

 𝑥 =𝑥 +
∆
 Now if we put 𝑚 = in incremental calculation equation 𝑥 =
∆
𝑥 + then we obtain equation as.
∆
 𝑥 =𝑥 +
∆
 Using this equation we can perform integer evaluation of 𝑥
intercept.

94

46
 8/22/2023

Simplified Method for Edge Intersection Calculation with

Scan-Line
1. Suppose 𝑚 = 7/3
2. Initially, set counter to 0, and increment to 3 (which is Δ𝑥).
3. When move to next scan line, increment counter by adding ∆𝑥
4. When counter is equal to or greater than 7 (which is Δ𝑦),
increment the 𝑥 − 𝑖𝑛𝑡𝑒𝑟𝑐𝑒𝑝𝑡 (in other words, the 𝑥 − 𝑖𝑛𝑡𝑒𝑟𝑐𝑒𝑝𝑡
for this scan line is one more than the previous scan line), and
decrement counter by 7(which is ∆𝑦). ∆𝑥 = 3, ∆𝑦 = 7

Counter=3
Counter=2
Counter=4
Counter=6
Counter=1
Counter=5
Counter=0

𝑦
𝑥

95

Use of Sorted Edge table in Scan-Line Polygon Fill

Algorithm
 To efficiently perform a polygon fill, we can first store the polygon
boundary in a sorted edge table.
 It contains all the information necessary to process the scan lines
efficiently.
 We use bucket sort to store the edge sorted on the smallest 𝑦
value of each edge in the correct scan line positions.
 Only the non-horizontal edges are entered into the sorted edge
table.

96

47
 8/22/2023

Contd.
Scan Line
Number
𝑦 𝑦 𝑥 1/𝑚
B .
.
.
𝑦 𝑦 𝑥 1/𝑚
Scan Line 𝑦 .
C . 𝑦 𝑥 1/𝑚
.
C E 𝑦
Scan Line 𝑦 𝑦 𝑥 1/𝑚
Scan Line 𝑦 D .
.
A . 𝑦 𝑥 1/𝑚
1
0

97

Inside-Outside Tests
 In area filling and other graphics operation often required to find
particular point is inside or outside the polygon.
 For finding which region is inside or which region is outside most
graphics package use either
1. Odd even rule OR
2. Nonzero winding number rule

98

48
 8/22/2023

Odd Even/ Odd Parity/ Even Odd

Rule
 By conceptually drawing a line from any position 𝑝 to a distant
point outside the coordinate extents of the object.
 Than counting the number of edges crossing by this line.
1. If Edge count is odd, than p is an interior point.
2. Otherwise p is exterior point.
 To obtain accurate edge count we must sure that line selected is
does not pass from any vertices. Boundary of Screen

1 2

𝑝
𝑟
1
𝑞

99

Nonzero Winding Number Rule

 This method counts the number of times the polygon edges wind
around a particular point in the counterclockwise direction.
 This count is called the winding number.
 We apply this rule by initializing winding number with 0.
 Then draw a line for any point 𝑝 to distant point beyond the
coordinate extents of the object.
Boundary of Screen

Winding number=0

100

49
 8/22/2023

Contd.
 The line we choose must not pass through vertices.
 Then we move along that line we find number of intersecting
edges.
1. If edge cross our line from right to left We add 1 to winding number
2. Otherwise subtract 1 from winding number
 IF the final value of winding number is nonzero then the point is
interior otherwise point is exterior. Boundary of Screen

-1 -1
Winding number=+1-1=0
number=0
number=-1

𝑝
𝑟
+1
𝑞

101

Comparison between Odd Even Rule and Nonzero

Winding Rule
 For standard polygons and simple object both rule gives same
result but for more complicated shape both rule gives different
result.

Odd Even Rule Nonzero Winding Rule

102

50
 8/22/2023

Scan-Line Fill of Curved Boundary

Areas
 Scan-line fill of region with curved boundary is more time
consuming as intersection calculation now involves nonlinear
boundaries.
 For simple curve such as circle or ellipse scan line fill process is
straight forward process.
 We calculate the two scan line intersection on opposite side of the
curve.
 This is same as generating pixel position along the curve boundary
using standard equation of curve.
 Then we fill the color between two boundary intersections.
 Symmetry property is used to reduce the calculation.

103

Introduction to Boundary / Edge Fill

Algorithm
 In this method, edges of the polygons are drawn.
 Then starting with some seed (any point inside the polygon) we
examine the neighbouring pixels to check whether the boundary
pixel is reached.
 If boundary pixels are not reached, pixels are highlighted and the
process is continued until boundary pixels are reached.
 Selection of neighbour pixel is either 4-cormected or 8-connected.

4-Cormected Region 8-Cormected Region

104

51
 8/22/2023

Contd.
 In some cases, an 8-connected algorithm is more accurate than
the 4-connected algorithm.
 Some times 4-connected algorithm produces the partial fill.

Seed

105

Boundary / Edge Fill Algorithm

Procedure:
boundary-fill4(x, y, f-colour, b-colour)
{
if(getpixel (x,y) ! = b-colour && gepixel (x, y) ! = f-colour)
{
putpixel (x, y, f-colour)
boundary-fill4(x + 1, y, f-colour, b-colour);
boundary-fill4(x, y + 1, f-colour, b-colour);
boundary-fill4(x - 1, y, f-colour, b-colour);
boundary-fill4(x, y - l, f-colour, b-colour);
}
}

106

52
 8/22/2023

Problem of Stacking and Efficient

Method
 Same procedure can be modified according to 8 connected region
algorithm by including four additional statements to test diagonal
positions.
 This procedure requires considerable stacking of neighbouring
points more, efficient methods are generally employed.
 Efficient method fill horizontal pixel spans across scan lines,
instead of proceeding to 4 connected or 8 connected
neighbouring points.
 Then we need only stack a beginning position for each horizontal
pixel span, instead of stacking all unprocessed neighbouring
positions around the current position.
 Starting from the initial interior point with this method, we first fill
in the contiguous span of pixels on this starting scan line.

107

Contd.
 Then we locate and stack starting positions for spans on the
adjacent scan lines.
 Spans are defined as the contiguous horizontal string of positions
bounded by pixels displayed in the area border colour.
 At each subsequent step, we unstack the next start position and
repeat the process.
 For e.g.

108

53
 8/22/2023

Contd.

3
2
(a) (b)
1 2 1 3
1 1

5 6 5
6
(c) 4 5 (d) 4 5
1 4 1 4
1 1

109

Introduction to Flood-Fill
Algorithm
 Sometimes it is required to fill in an area that is not defined within
a single colour boundary.
 In such cases we can fill areas by replacing a specified interior
colour instead of searching for a boundary colour.
 This approach is called a flood-fill algorithm. Like boundary fill
algorithm, here we start with some seed and examine the
neighbouring pixels.
 However, here pixels are checked for a specified interior colour
instead of boundary colour and they are replaced by new colour.
 Using either a 4-connected or 8-connected approach, we can step
through pixel positions until all interior point have been filled.

110

54
 8/22/2023

Flood-Fill Algorithm
Procedure :
flood-fill4(x, y, new-colour, old-colour)
{
if(getpixel (x,y) = = old-colour)
{
putpixel (x, y, new-colour)
flood-fill4 (x + 1, y, new-colour, old -colour);
flood-fill4 (x, y + 1, new -colour, old -colour);
flood-fill4 (x - 1, y, new -colour, old -colour);
flood-fill4 (x, y - l, new -colour, old-colour);
}
}

111

55