1. Graphic Basics in C ATS 315

2. The Graphics Window Will look something like this.

3. The Graphics Window Has “minimize”, “maximize”, and “close” buttons, but don’t use them! Close by hitting “enter”.

4. The Graphics Window Defined as a “unit square”. 1 unit

5. The Graphics Window “Origin” is in the bottom left corner of the window. (0,0)

6. The Graphics Window “(1,1)” is in the top right corner of the window. (0,0) (1,1)

7. All Graphics Programs… #include Compile with: graphcc graph.h and gks.h are NOT standard libraries. *I* put them in /usr/lib graphcc is a script *I* wrote that is equivalent to: gcc $1 –lm –lX11 /home/schragej/glibrary/graph.a

8. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); }

9. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); } This is code that you are going to need in every graphics program. In general, it will not need to be modified.

10. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); } These are three variables that the graphics package needs. They must be declared in order to function properly.

11. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); } This will be the title of the graphics window that you open.

12. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); } The periods here are important. The first zero is an integer. The second and third zeros are floats.

13. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); } All of your graphics commands, such as drawing lines and boxes, go here.

14. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); } Once you are done drawing, ghold() holds the output on the screen until you press the “enter” key.

15. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); } gclose() closes the graphics window.

16. Opening a Graphics Window main() { int ws_type; float xvp,yvp; ws_type = 0; gopen (“My Figure”,&ws_type, NULL); gset_maxview(&xvp,&yvp); gview (0,0.,0.,xvp,yvp); gset_redraw(0); ghold(); gclose(); } Once you have this block of code in your program, you are ready to start adding graphics commands at the arrow and make some kind of picture!

17. Simple Graphics Commands Defining Colors Setting the Attributes of Lines Drawing Lines Drawing Filled Boxes Drawing Text

18. Defining Colors Picture an artist’s palette.

19. Defining Colors The artist can put whatever color he wants into each of the little cups. However, the artist only has so many cups to work with.

20. Defining Colors In the same way, you can define any color you want, but you can only have so many colors on the screen at a time. The number of colors you can have is 256—but you’ll probably rarely have more than 10 or so.

21. Defining Colors gcolor ( index, red, green, blue); index: an integer that is the “cup” that you are filling with some color of paint red: the amount of red to add (0-1) green: the amount of green to add (0-1) blue: the amount of blue to add (0-1)

22. Defining Colors gcolor ( 100, 1.0, 1.0, 1.0); In this example, the color “100” is defined as “white”—full red, full green, and full blue.

23. Defining Colors gcolor ( 101, 0.0, 0.0, 0.0); In this example, the color “101” is defined as “black”—no red, no green, and no blue.

24. Common Colors in RGB ColorRedGreenBlue White1.0 Black0.0 Red1.00.0 Green0.01.00.0 Blue0.0 Yellow1.0 0.0 Purple1.00.01.0 Cyan0.01.0 Grey0.5

25. Uncommon Colors in RGB ColorRedGreenBlue Orange 1.00.80.0 Magenta 0.80.00.8 Brown 0.8 0.0 Gold 0.70.40.0 Light Green 0.31.00.3

26. Setting Line Attributes When drawing a line on a piece of paper, you have to decide which crayon you are going to use: –What color is it? –How wide is it? –What kind of line are you going to draw (solid, dotted, etc.)?

27. Setting Line Attributes gline_attr(color, style, width); The color is the index of the color of the crayon that you want to pick up.

28. Setting Line Attributes gline_attr(color, style, width); “Style” is an integer that describes the style of the line you are about to draw, or use these codes: 1LS_SOLIDSolid 2LS_LDASHLong dashes 3LS_LSDASHShort dashes 4LS_LLSDASHDash-dotted 5LS_DOTDotted

29. Setting Line Attributes gline_attr(color, style, width); The width is the thickness of the line, in terms of pixels. Width is a float, and 1.0 will generally work best.

30. Setting Line Attributes Once you set the line attributes, they stay that way until you change the settings—in other words, you don’t “set down the crayon” until you “pick up another crayon”. Therefore, you don’t have to use gline_attr before every line you draw—just when you change the color, style, or width of the lines!

31. Drawing Lines Once you have defined some line attributes, you can start drawing lines with those attributes.

32. Drawing Lines Each line begins at some (x1,y1) and ends at some (x2,y2). (x1,y1) (x2,y2)

33. Drawing Lines gline(x1,y1,x2,y2); (x1,y1) (x2,y2)

34. Drawing Lines It doesn’t hurt anything if either (x1,y1) or (x2,y2) are outside of the unit square, but only the part of the line inside the unit square will be drawn.

35. Drawing Filled Rectangles To draw a filled rectangle, you’ll need to know the coordinates of two opposite corners. (x1,y1) (x2,y2)

36. Drawing Filled Rectangles gfill_attr(color,0); gfrect(x1,y1,x2,y2); First, tell the program what color to paint the rectangle. “0” tells the program to fill the rectangle with “solid” color—try other integers for surprising effects! Then draw a filled rectangle from (x1,y1) to (x2,y2).

37. Other Filled Shapes Once you have used gfill_attr to set the attributes, there are several possible filled shapes, including: gfcircle(x,y,radius); gfellipse(x1,y1,x2,y2);

38. Text In The Graphics Window gtext_attr describes how the font should look: –color is the “index” of the color to use –height is the size of the font (on the unit square) –width is the thickness of the lines for the font –expan is a distortion of the font—use “1” gtext_attr(color,height,width,expan) gtext_align(i,j) gprintf (x,y,format…)

39. Text In The Graphics Window gtext_align describes how the characters will line up with respect to (x,y): –Normally you will use “2,5”, which means “centered at (x,y)” gtext_attr(color,height,width,expan) gtext_align(i,j) gprintf (x,y,format…)

40. Text In The Graphics Window gprintf prints text at the location (x,y) –works just like a printf statement –examples: gprintf (.5,.5,”This is the middle\n”); gprintf (.5,.5,”%4.1f\n”,temperature); gtext_attr(color,height,width,expan) gtext_align(i,j) gprintf (x,y,format…)

41. YOUR ASSIGNMENT Produce a graphics window with a picture of anything you want—not necessarily weather-related. Your image must contain: –at least 5 colors –at least 10 lines, using at least two different line styles –at least 2 filled rectangles –at least 1 filled circle or ellipse –some text