Drawing lines. Naïve line drawing algorithm. drawpixel(x, round(y)); double dy = y1 - y0; double dx = x1 - x0; double m = dy / dx; double y = y0;

Transcription

1 Naïve line drawing algorithm // Connet to grid points(x0,y0) and // (x1,y1) by a line. void drawline(int x0, int y0, int x1, int y1) { int x; double dy = y1 - y0; double dx = x1 - x0; double m = dy / dx; double y = y0; } for (x=x0; x<=x1; x++) { drawpixel(x, round(y)); y = y + m; //or: y = y0 + m*(x - x0); } Drawing lines Computer Graphis: Drawing lines and urves p.1/92

2 Drawing lines Computer Graphis: Drawing lines and urves p.2/92

3 Drawing lines For a line with an absolute slope greater than one, the roles of the - and the -axis should be exhanged for drawing the line. Very often, drawing an image requires drawing a large number of lines. Therefore, the line drawing algorithm should be as effiient as possible. The Bresenham or midpoint algorithm does not need any floating operations and draws lines on raster graphis using only integer arithmetis. Computer Graphis: Drawing lines and urves p.3/92

4 The midpoint algorithm In the following, drawing a line with slope between 0 and 1 is onsidered. If suh a line is drawn pixel by pixel and the last pixel whih was drawn is loated at, then there are only two hoies for the next pixel. or right of the pixel. right and above of the pixel Computer Graphis: Drawing lines and urves p.4/92

5 The midpoint algorithm Computer Graphis: Drawing lines and urves p.5/92

6 The midpoint algorithm Considering the loation of the line w.r.t. the midpoint provides the orret deision whih of the two andidate pixels should be drawn next. If the midpoint lies below the line, the upper ( pixel should be drawn. If the midpoint lies above the line, the lower ( pixel should be drawn. Computer Graphis: Drawing lines and urves p.6/92

7 The midpoint algorithm Computer Graphis: Drawing lines and urves p.7/92 Equation for the line: Impliit form: or

8 The midpoint algorithm lies on the line. lies above the line. lies below the line. the oordinates of the midpoint Choosing for yields: should be drawn. The pixel should be drawn. The pixel In the ase one an hoose or. (But the deision should be the same eah time, for instane always the upper pixel.) Computer Graphis: Drawing lines and urves p.8/92

9 and The midpoint algorithm. with pixel Draw a line onneting pixel Equation for the line:. where Computer Graphis: Drawing lines and urves p.9/92

10 The midpoint algorithm Computer Graphis: Drawing lines and urves p.10/92 impliit form: or where

11 The midpoint algorithm with integer value Inserting the midpoint and requires floating operations. with integer value Multipliation by the fator 2: Computer Graphis: Drawing lines and urves p.11/92

12 The midpoint algorithm with Inserting the midpoint are integer values yields where Only integer operations are needed! Computer Graphis: Drawing lines and urves p.12/92

13 The midpoint algorithm The midpoint algorithm used in omputer graphis is further improved by. inremental omputation of the values In the loop for drawing, only integer additions, no multipliations are needed. Computer Graphis: Drawing lines and urves p.13/92

14 The midpoint algorithm Inremental omputation of the deision variable: hange? How does Computer Graphis: Drawing lines and urves p.14/92

15 The midpoint algorithm new old new Computer Graphis: Drawing lines and urves p.15/92 Two ases: old

16 The midpoint algorithm is the pixel. Case 1:, i.e. drawn after : Midpoint to be onsidered for the next pixel new Computer Graphis: Drawing lines and urves p.16/92

17 The midpoint algorithm new old old new Computer Graphis: Drawing lines and urves p.17/92

18 The midpoint algorithm is the. Case 2:, i.e. pixel drawn after Midpoint to be onsidered for the next pixel: new Computer Graphis: Drawing lines and urves p.18/92

19 The midpoint algorithm old new old Computer Graphis: Drawing lines and urves p.19/92 new

20 The midpoint algorithm was hosen, was hosen. if if i.e. old old if if is always an integer number. Therefore, the deision variable an only hange by integer values. Computer Graphis: Drawing lines and urves p.20/92

21 The midpoint algorithm : Starting pixel: Initialisation of First midpoint to be onsidered: init Computer Graphis: Drawing lines and urves p.21/92

22 The midpoint algorithm is neessarily an integer number. init onsider the Instead of the deision variable deision variable : is always an integer number. Computer Graphis: Drawing lines and urves p.22/92

23 The midpoint algorithm init where new old if old if old Computer Graphis: Drawing lines and urves p.23/92

24 The midpoint algorithm Example: A line from (2,3) to (10,6): Computer Graphis: Drawing lines and urves p.24/92

25 The midpoint algorithm init Computer Graphis: Drawing lines and urves p.25/92

26 The midpoint algorithm init Computer Graphis: Drawing lines and urves p.26/92

27 The midpoint algorithm init init Computer Graphis: Drawing lines and urves p.27/92

28 The midpoint algorithm init init Computer Graphis: Drawing lines and urves p.28/92

29 The midpoint algorithm init init Computer Graphis: Drawing lines and urves p.29/92

30 The midpoint algorithm init init Computer Graphis: Drawing lines and urves p.30/92

31 The midpoint algorithm init init Computer Graphis: Drawing lines and urves p.31/92

32 The midpoint algorithm init init Computer Graphis: Drawing lines and urves p.32/92

33 The midpoint algorithm init init Computer Graphis: Drawing lines and urves p.33/

34 The midpoint algorithm Lines with an absolute slope greater than 1: Change the roles of the - and algorithm. -axis in the Lines with negative slope (between and Carry out similar derivations as in the ase of lines with positive slope. Instead of northeastern pixel, the t southeastern must be onsidered. ): Line segments whose starting and endpoint are not integer-valued: Roundoff the oordinates of the starting and endpoint and onnet the orresponding pixels by a line. Computer Graphis: Drawing lines and urves p.34/92

35 Strutural algorithms When drawing a line, repeated pixel patterns usually our, for instane,,,, Computer Graphis: Drawing lines and urves p.35/92

36 Strutural algorithms Let denote a diagonal ( pixel) and a horizontal step ( pixel). Then the line an be deribed by a (repeated) pattern of and steps. Strutural algorithms determine suh patterns for drawing lines. integer operations The midpoint algorithm needs to draw a line of pixels. Strutural algorithm only have logarithmi omplexity (however, with more ompliated operations). Computer Graphis: Drawing lines and urves p.36/92

37 and Strutural algorithms Priniple: (of Given: A start and endpoint and a line segment with slope between 0 and 1). Compute Apart from the starting pixel, pixels must be drawn. This will invoke diagonal and horizontal steps. as a first Choose the sequene approximation. Permutate this sequene in a suitable way to obtain the orret sequene. Computer Graphis: Drawing lines and urves p.37/92

38 Brons algorithm If and (and therefore also ) have a ommon divisor greater than one, i.e., gd, then the pixel line an be drawn by repetitions of a sequene of length. Therefore, it an be assumed without loss of generality that and have no ommon divisor. be two words (sequenes) over the. Let and alphabet From a starting sequene with frequenies and having no ommon divisor and assuming without loss of generality, the integer division Computer Graphis: Drawing lines and urves p.38/92

39 Brons algorithm leads to the permutated sequene if if Apply the same proedure in a reursive manner to the subsequenes of length and, respetively, until or holds. Computer Graphis: Drawing lines and urves p.39/92

40 Example,,, gd Therefore,,. Computer Graphis: Drawing lines and urves p.40/92

41 Pixel densities Computer Graphis: Drawing lines and urves p.41/92

42 Pixel densities where and A line onneting the points. Length of the line Pixel density Computer Graphis: Drawing lines and urves p.42/92

43 Line styles and bitmasks solid dashed dotted self defined Computer Graphis: Drawing lines and urves p.43/92

44 Line styles and bitmasks Different dash lengths for the same bitmask. Computer Graphis: Drawing lines and urves p.44/92

45 Line styles in Java 2D Line thikness: BasiStroke bsthikline = new BasiStroke(3.0f); g2d.setstroke(bsthikline); Dash patterns: BasiStroke bsdash = new BasiStroke(thikness, BasiStroke.CAP_BUTT, BasiStroke.JOIN_BEVEL, 2.0f, dashpattern,dashphase); Computer Graphis: Drawing lines and urves p.45/92

46 Line styles in Java 2D thikness: The thikness of the line. BasiStroke.CAP BUTT, BasiStroke.JOIN BEVEL, 2.0f determine how the endings of lines should look and how joins in polylines should be drawn. dashpattern: Array that defines the desired dash pattern, f.e. float[] dashpattern = new float[]{20,10}; dashphase: Position in the dash pattern where drawing should begin. Computer Graphis: Drawing lines and urves p.46/92

47 StrokingExample.java dashpattern dashphase 4,5,8,5,12,5,16,5,20,5 0 20, , ,10 0 Computer Graphis: Drawing lines and urves p.47/92

48 Clipping The task of deiding whether objets belong to the sene to be displayed or whether they an be negleted for the speifi sene is alled lipping. Computer Graphis: Drawing lines and urves p.48/92

49 Line lipping Simple, but omputationally ineffiient method for line lipping: Compute the intersetion points of the line to be drawn with the four edges of the lipping retangle. Representation of a line segment with starting point and endpoint as onvex ombinations of these two points.. where Computer Graphis: Drawing lines and urves p.49/92

50 Line lipping Compute the intersetion points of the line with the retangle defined by the points min min and : max max Determine the intersetion point with the lower edge: max min min min Yields solutions for and. (If no or no unique solution exists, the lines are parallel.) Computer Graphis: Drawing lines and urves p.50/92

51 Line lipping : The intersetion point lies not and between the endpoints of the line segment and lies before min. and : The line segment intersets the extension of the lower edge before min. : The intersetion point lies not and between the endpoints of the line segment and lies before min. and : The intersetion point of the line with the lower edge lies before. and : The line segment intersets the lower edge. Computer Graphis: Drawing lines and urves p.51/92

52 Line lipping and : The intersetion point of the line with the lower edge lies behind. : The intersetion point lies not and between the endpoints of the line segment and lies behind max. and : The line segment intersets the extension of the lower edge behind max. : The intersetion point lies not and between the endpoints of the line segment and lies behind max. The same onsiderations must be arried out for the other edges of the retangle. Computer Graphis: Drawing lines and urves p.52/92

53 Cohen-Sutherland lipping Aim: Try to avoid the omputation of intersetion points. Partition the 2D-world into nine areas desribed by a 4-bit ode: The bit ode is assigned to the point aording to the following rules. min max min max Computer Graphis: Drawing lines and urves p.53/92

54 Cohen-Sutherland lipping max max min min Computer Graphis: Drawing lines and urves p.54/92

55 Cohen-Sutherland lipping. and ending at A line starting at point. (ready) Draw the line No drawing required. (ready) must hold. Without loss of. Compute the or generality, assume intersetion point of the line for the edge or one of the two edges responsible for the one(s) in by this intersetion point. Replae and start the algorithm again with the shortened line. Computer Graphis: Drawing lines and urves p.55/92

56 Cohen-Sutherland lipping Computer Graphis: Drawing lines and urves p.56/92

57 Cyrus-Bek lipping with a point on the line from A vetor onneting to an be written as Computer Graphis: Drawing lines and urves p.57/92

58 Cyrus-Bek lipping The intersetion point of the line with the orresponding edge of the lipping retangle must satisfy : No intersetion point with the edge within the line segment. Computer Graphis: Drawing lines and urves p.58/92

59 Cyrus-Bek lipping ) are The remaining intersetion points ( potential points where the line enters or leaves the lipping retangle. These points are marked as possible entering (PE) and possible leaving points (PL). 1 P PL PL PE PE 0 P Computer Graphis: Drawing lines and urves p.59/92

60 Cyrus-Bek lipping The angle between the line and the normal vetor of the orresponding edge of the lipping retangle determines whether a point should be marked PE or PL., the intersetion point If the angle is larger than should be marked PE., the intersetion point If the angle is less than should be marked PL. For this, it is suffiient to determine the sign of the dot produt Computer Graphis: Drawing lines and urves p.60/92

61 Cyrus-Bek lipping Determining the part of the line inside the lipping retangle: Determine the largest value for a PE point and the smallest value belonging to a PL point. holds, the part of the line between the points and must be drawn. If Otherwise the line lies outside the lipping retangle. Computer Graphis: Drawing lines and urves p.61/92

62 Line lipping Problems to determine the orret starting pixel: left lower lower lower - 1 Computer Graphis: Drawing lines and urves p.62/92

63 Midpoint algorithm for irles Draw a irle with radius around the entre. Given that is a pixel, i.e., it is suffiient to find an effiient algorithm for drawing a irle with entre and to use as an offset. Symmetry of the irle (an eighth of the irle is suffiient): (x,y) (y,x) (y,-x) (x,-y) (-x,-y) (-y,-x) (-y,x) (-x,y) Computer Graphis: Drawing lines and urves p.63/92

64 Midpoint algorithm for irles in impliit form: Equation for the irle lies on the irle. lies outside the irle. lies inside the irle. If the pixel has been drawn in one step, the next pixel an only be the pixel with oordinates or with oordinates. Computer Graphis: Drawing lines and urves p.64/92

65 Midpoint algorithm for irles (x p,y p ) E M M E SE M SE Computer Graphis: Drawing lines and urves p.65/92

66 Midpoint algorithm for irles Analogously to lines: Impliit equation for the irle as a deision variable. into the equation leads to the Inserting the midpoint following deisions. must be drawn. holds, then If must be drawn. holds, then If hange in eah step? How muh does Computer Graphis: Drawing lines and urves p.66/92

67 Midpoint algorithm for irles is the pixel. Case 1:, i.e. drawn after : Midpoint to be onsidered for the next pixel new Computer Graphis: Drawing lines and urves p.67/92

68 Midpoint algorithm for irles old new old new Computer Graphis: Drawing lines and urves p.68/92

69 Midpoint algorithm for irles is the. Case 2:, d.h. pixel drawn after : Midpoint to be onsidered for the next pixel new Computer Graphis: Drawing lines and urves p.69/92

70 Midpoint algorithm for irles new old new old Computer Graphis: Drawing lines and urves p.70/92

71 Midpoint algorithm for irles was hosen, was hosen. if if i.e. old old if if is always an integer number. Therefore, the deision variable an only hange by integer values. Computer Graphis: Drawing lines and urves p.71/92

72 Midpoint algorithm for irles : Initialisation of. where The first pixel to be drawn is. First midpoint to be onsidered: : Initialisation of Computer Graphis: Drawing lines and urves p.72/92

73 Midpoint algorithm for irles old old Summary: init new old if if Computer Graphis: Drawing lines and urves p.73/92

74 Midpoint algorithm for irles Exept for the value at the initialisation, only integer numbers and operations our.. by Replae holds, it holds. Theoretially, instead of testing whether would now be neessary to test whether But sine starts with an integer value and hanges only by integer values, it is suffiient to test for. Computer Graphis: Drawing lines and urves p.74/92

75 Midpoint algorithm for irles init new old if old if old Computer Graphis: Drawing lines and urves p.75/92

76 Midpoint algorithm for irles A irle with noninteger, rational radius: Apply the same strategy as above to the impliit form Computer Graphis: Drawing lines and urves p.76/92

77 Priniple of the midpoint algorithm to be drawn in the interval Given: A urve. Neessary ondition: Either or is valid for the omplete interval. in a suitable impliit form and use as deision variable. Write Compute the hange of depending on the previously drawn pixel ( or, respetively). Computer Graphis: Drawing lines and urves p.77/92

78 Priniple of the midpoint algorithm Neessary ondition: is an integer value or at least rational. If is a (proper) rational number, onsider the deision variable instead of where is hosen suh that is always an integer number. Compute the initial value init by inserting the first midpoint (after ). If init is not an integer number, the digits after the deimal point an be ignored if hanges only by integer values. Computer Graphis: Drawing lines and urves p.78/92

79 Drawing of arbitrary urves The midpoint or Bresenham algorithm annot be applied to arbitrary urves aording to the restritions required for the slope of the funtion. In addition, the omputational sheme must be alulated individually for eah type of funtion. Therefore, arbitrary urves are drawn in the following way. Given: A urve (where to be drawn in the interval ). Computer Graphis: Drawing lines and urves p.79/92

80 Drawing of arbitrary urves int yround1, yround2; yround1 = round(f(x0)); for (int x=x0; x<x1; x++) { yround2 = round(f(x+1)); drawline(x,yround1,x+1,yround2); yround1 = yround2; } Computer Graphis: Drawing lines and urves p.80/92

81 Drawing of arbitrary urves Computer Graphis: Drawing lines and urves p.81/92

82 Antialiasing Aliasing effets our when a ontinuous signal is sampled in a disrete manner with a onstant rate. Drawing lines and urves (sampling of a ontinuous urve by a disrete pixel raster) an ause aliasing effets (jaggies, stairasing). Antialiasing tries to amend these effets by the use of different grey levels or olour intensities. Pixels are not simply drawn blak or white, but with different intensities, depending how far they lie from the ideal line to be drawn or how muh they are overed by the thikened line. Computer Graphis: Drawing lines and urves p.82/92

83 Unweighted Area Sampling A line is onsidered as (narrow, long) retangle. Eah pixel is assoiated with a small square. The intensity of the pixel is hosen proportionally to the area of the pixel s square that is overed by the retangle that represents the line. Computer Graphis: Drawing lines and urves p.83/92

84 Unweighted Area Sampling Simple heuristi strategy to estimate the proportion of the pixel s square that is overed by the line retangle: The pixel s square is overed by an imaginary refined pixel grid. The proportion of refined pixels in the square that also lie in the line retangle gives a good estimation for the desired intensity of the pixel. Intensity: 11/25 Computer Graphis: Drawing lines and urves p.84/92

85 Weighted Area Sampling Weighted Area Sampling: Use a weighting funtion : Intensity for pixel P Computer Graphis: Drawing lines and urves p.85/92

86 Gupta-Sproull antialiasing For suitable weighting funtions, the a pixel s intensity depends only on its distane the line. The number of displayable intensity values is usually limited, for omputer sreens by 256. Antialiasing normally uses muh less intensity vales. Sanning the pixels in a suitable order, omputing the disretised intensities is similar to drawing a line on a pixel raster. Sanning the pixels orresponds to stepping through the -values for drawing the line. Determining the (disretised/rounded) intensity orresponds to omputing the rounded -value for drawing the line. Computer Graphis: Drawing lines and urves p.86/92

87 Gupta-Sproull antialiasing The Gupta-Sproull antialiasing algorithm uses a suitable weighting funtion and limited number of intensity levels, so that the midpoint algorithm an be used for omputing the intensity for antialiasing. No integrals need to be solved, not even floating arithmeti is required. Antialiasing in Java 2D: g2d.setrenderinghint( RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON); Computer Graphis: Drawing lines and urves p.87/92

88 Drawing thik lines For devies even with today s standard resolution, lines rendered with only one pixel as their width our extremely thin. Pixel repliation moving pen tehnique Alternative: Consider lines as filled polygons or retangles. Computer Graphis: Drawing lines and urves p.88/92

89 Thik polylines How should line endings of thik lines look like? Computer Graphis: Drawing lines and urves p.89/92

90 Java 2D: Drawing thik lines new BasiStroke(thikness,ending,join); Values for ending: BasiStroke.CAP BUTT: The endings are ut off straight, orthogonal to the diretion of the line. BasiStroke.CAP ROUND: A half irle is attahed to eah line ending. BasiStroke.CAP SQUARE: A retangle is appended to the line ending, so that the line is prolongated by half of its thikness. Computer Graphis: Drawing lines and urves p.90/92

91 Java 2D: Drawing thik lines Values for join: BasiStroke.JOIN MITER: The outer edges of the line retangles are prolonged until they meet, leading to a join with a sharp tip. For aute angles of the lines, the tip an be extremely long. To avoid this effet, another float-value an be speified, defining the maximum length of the tip. If the tip exeeds this length, then the following join mode is used. Computer Graphis: Drawing lines and urves p.91/92

92 Java 2D: Drawing thik lines BasiStroke.JOIN BEVEL: The join is a straight ut-off, orthogonal to the middle line between the two lines to be onneted. BasiStroke.JOIN ROUND: The line endings are ut off at the join and a irle segment similar to the style BasiStroke.JOIN BEVEL for line endings is attahed to the join. The angle of the irle segment is hosen suh that the lines form the tangents at the irle segment. Computer Graphis: Drawing lines and urves p.92/92