# Image-8 Exercises

## 1.

Write code to set a vertical stripe 100 pixels wide at the right edge of the flowers image to dark gray (red green blue all set to 100). The flowers image is 457 pixels wide.

image-7-ex1

## 2.

Write code to set a horizontal stripe 20 pixels high along the bottom of the flowers image to light gray (200 200 200). The flowers image is 360 pixels high.

image-7-ex2

## 3.

Flip of problem (2). Set to gray all of the pixels except the bottom horizontal stripe.

image-7-ex3

## 4.

Write code to set the left half of the flowers image to be grayscale. (See the image-6 section for the definition of grayscale).

image-7-ex4

To play around with the bluescreen code, we'll use a few more images, including these:

paris.jpg -- incomparable Eiffel tower in Paris

yosemite.jpg -- Half Dome in Yosemite California, an amazing place to visit

redwood.jpg -- Redwood tree. Redwood trees are typical of the northern California coast where Stanford is located. (This tree is actually in Nick's front yard)

## 1.

Here is the striped-fish-green.jpg image:

Write bluescreen code to place this fish in front of the yosemite.jpg background. The fish has bits of blue on it, but that's ok since we're using a green background in this case. Adjust the code so that all of the green towel below the fish disappears. Little flecks of white will appear in the blue middle section of the fish; we're stuck with those with our current technique.

image-8-ex1

## 2.

For this problem, we'll accomplish a sort of artistic effect, working with the redwood.jpg image:

And the pebbles.jpg image:

Write bluescreen code to modify the redwood.jpg image, replacing the trunk and some of the branches of the tree with pixels from pebbles.jpg. The result is a sort of fanciful looking stone-tree image. Adjust the code so that the pebbles are on the trunk and some of the branches; don't put pebbles all over the bottom of the image.

image-8-ex2

## 3.

For this problem we'll edit the fence-ivy.jpg image

And the old leaves.jpg

Write code to detect the non-ivy parts of the fence-ivy image by detecting pixels with a low green value. (You could look for high-red values, but low-green works better in this case).

Change the non-ivy parts of the fence-ivy image to be pixels from the leaves.jpg image. None of the red fence should be left showing. The result should show the small leaves in back with the large ivy leaves in front of them.

image-8-ex3

## 4.

This problem is titled "Fish Dreams of Paris". This problem will use paris.jpg:

And striped-fish-blue.jpg:

Here the striped fish is facing right in front of a blue background. Parts of the fish itself are blue -- the eye and the vertical stripe in the middle. For this problem, we'll let the background image replace those two blue areas as well.

Write bluescreen code to place striped-fish-blue.jpg in front of paris.jpg. In particular, adjust the code so that the blue background, the blue middle stripe, and blue eye of the fish all show the paris.jpg pixels. Adjust the code so the blue towel background below the fish is almost completely replaced.

image-8-ex4

## 5.

For this problem, write code to blend striped-fish-green.jpg into the yosemite.jpg image. The background of striped-fish-green.jpg is green:

The result should look mostly like the regular yosemite.jpg image, but with a faint fish on the rocks. Divide the fish pixels by about 5.

image-8-ex5

Each click of a Run button saves that code on the computer running the browser. The button below retrieves the all code exercises listed to the right of the button.

count 5 : image-8-ex1 image-8-ex2 image-8-ex3 image-8-ex4 image-8-ex5

```(code appears here)

```