Laboratory: Drawings as Values

In the first self check, we created a complex drawing step-by-step, defining each intermediate drawing along the way. However, if we're drawing a single shape, we could also nest operations.

a. Write a single definition that creates a blue circle of radius 30, centered at (80,40). Name that circle blue-circle.

(define blue-circle 
  ___)

b. Display the new drawing in a 100x100 image to see that you created it successfully.

> (image-show (drawing->image blue-circle 100 100))

c. What do you expect the underlying representation to look like? Fill in the blanks below.

(drawing ellipse 255 "" ___ ___ ___ ___)

d. Check your answer experimentally.

> blue-circle

You've just rendered your blue circle in a 100x100 image. Does image size affect rendering? Let's check that question.

a. What do you expect to have happen if you render blue-circle in a 200x200 image?

b. Check your answer experimentally.

c. What do you expect to have happen if you render the same drawing in a 10x10 image?

d. Check your answer experimentally.

Consider the following definition.

(define sample-square
 (recolor-drawing
  "green"
  (hshift-drawing
   60
   (vshift-drawing
    100
    (scale-drawing
     40
     drawing-unit-square)))))

a. In English, describe what shape you think this describes.

b. Check your answer experimentally by displaying the drawing.

c. Where is the left margin of the square? Where is the top margin? (Note that you can identify these margins visually or you can use drawing-left and drawing-top to have the computer identify them.)

d. Now, suppose we define a new drawing by scaling the square.

(define sample2 (scale-drawing 1.5 sample-square))

Describe what you expect the result to look like.

e. Check your answer experimentally.

f. Where is the left margin of the scaled square? Where is the top margin? Were they what you expected? Why do you think they are what they are?

g. Now, suppose we define a new drawing by scaling the square in only one direction.

(define sample3 (hscale-drawing 0.75 sample2))

Describe what you expect the result to look like.

h. Check your answer experimentally.

As you know, when we're working with mathematics, the order in which we apply operations matters a lot. For example, if we both add two to and square a number, it matters whether we add first or square first. Does order matter in drawings? Let's consider a few examples. (Note: We explore the examples visually. You may also find it useful to see what the underlying representations look like.)

We'll start with a simple black circle along with copies of it colored red and blue.

(define subject (scale-drawing 40 drawing-unit-circle))
(define subject-red (recolor-drawing "red" subject))
(define subject-blue (recolor-drawing "blue" subject))

a. Suppose we want to translate the circle horizontally 50 units and vertically 50 units. Do you think the order we do those two operations matters? Why or why not?

b. Use the following code to check your answer. What do you expect it to do? Does it do what you expect?

(image-show
 (drawing->image
  (drawing-group subject
                 (hshift-drawing 40 (vshift-drawing 50 subject-red))
                 (vshift-drawing 50 (hshift-drawing 40 subject-blue)))
  100 100))

c. Suppose we want to scale the circle horizontally by 1/2 and vertically by 3/2. Do you think the order we do those two operations matters? Why or why not?

d. Use the following code to check your answer.

(image-show
 (drawing->image
  (drawing-group subject
                 (hscale-drawing 0.5 (vscale-drawing 1.5 subject-red))
                 (vscale-drawing 1.5 (hscale-drawing 0.5 subject-blue)))
  100 100))

e. Suppose we want to translate the circle horizontally by 50 units and scale it by 1/2. Do you think the order we do those two operations matters? Why or why not?

f. Use the following code to check your answer.

(image-show
 (drawing->image
  (drawing-group subject
                 (hshift-drawing 40 (scale-drawing 0.5 subject-red))
                 (scale-drawing 0.5 (hshift-drawing 40 subject-blue)))
  100 100))

Consider the following definitions.

(define thing (recolor-drawing "orange" (scale-drawing 30 drawing-unit-circle)))
(define g1
  (drawing-group thing
                 (hshift-drawing 40 thing)
                 (hshift-drawing 80 thing)
                 (hshift-drawing 120 thing)))
(define g2 
  (drawing-group g1
                 (recolor-drawing "green"
                                   (vshift-drawing 30 (hshift-drawing 20 g1)))
                 (recolor-drawing "blue"
                                  (vshift-drawing 60 (hshift-drawing 40 g1)))
                 (recolor-drawing "indigo"
                                   (vshift-drawing 90 (hshift-drawing 20 g1)))))
(define g3 
  (drawing-group (recolor-drawing "black" g2)
                 (recolor-drawing "white"
                                  (hshift-drawing 5 (vshift-drawing 5 g2)))
                 (hshift-drawing 10 (vshift-drawing 10 g20))))
(define g4 
  (drawing-group g2
                 (hscale-drawing 1.5 g2)
                 (vscale-drawing 0.75 (vshift-drawing 5 g2))))

a. Describe what you think each of the four drawings will look like.

b. Check your answers experimentally. Note that some of these drawings take surprisingly long to render.

c. What clever (or not so clever) technique do these examples reveal?