# Exercises

### Scatter Plots

In this exercise we'll implement scatter plots as in Figure generative:distributions. Experiment with different distributions (trying creating your own distributions by transforming ones defined on Random).

There are three main components of a scatter plot:

• we need to generate the points we'll plot;
• we need to overlay the images on top of each other in the same coordinate system to create the plot; and
• we need to convert a point to an image we can render.

We tackle each task in turn.

Start by writing a method makePoint that will accept a Random[Double] for the x and y coordinates of a point and return a Random[Point]. It should have the following skeleton:

def makePoint(x: Random[Double], y: Random[Double]): Random[Point] =
???

Use a for comprehension in your implementation.

<div class="solution"> This is a nice example of composition of Randoms.

def makePoint(x: Random[Double], y: Random[Double]): Random[Point] =
for {
theX <- x
theY <- y
} yield Point.cartesian(theX, theY)

</div>

Now create, say, a thousand random points using the techniques we learned in the previous chapter on lists and a random distribution of your choice. You should end up with a List[Random[Point]].

<div class="solution"> Something like the following should work.

val normal = Random.normal(50, 15)
val normal2D = makePoint(normal, normal)

val data = (1 to 1000).toList.map(_ => normal2D)

</div>

Let's now transform our List[Random[Point]] into List[Random[Image]]. Do this in two steps: first write a method to convert a Point to an Image, then write code to convert List[Random[Point]] to List[Random[Image]].

<div class="solution"> We can convert a Point to an Image using a method point below. Note I've made each point on the scatterplot quite transparent---this makes it easier to see where a lot of points are grouped together.

def point(loc: Point): Image =
Image.circle(2).fillColor(Color.cadetBlue.alpha(0.3.normalized)).noStroke.at(loc.toVec)

Converting between the lists is just a matter of calling map a few times.

val points = data.map(r => r.map(point _))

</div>

Now create a method that transforms a List[Random[Image]] to a Random[Image] by placing all the points on each other. This is the equivalent of the allOn method we've developed previously, but it now works with data wrapped in Random.

<div class="solution"> You might recognise this pattern. It's what we used in allOn with the addition of flatMap, which is exactly what randomConcentricCircles (and many other examples) use.

def allOn(points: List[Random[Image]]): Random[Image] =
points match {
case Nil => Random.always(Image.empty)
case img :: imgs =>
for {
i  <- img
is <- allOn(imgs)
} yield (i on is)
}

</div>

Now put it all together to make a scatter plot.

<div class="solution"> This is just calling methods and using values we've already defined.

val plot = allOn(points)

</div>

### Parametric Noise

In this exercise we will combine parametric equations, from a previous chapter, with randomness.

Let's start by making a method perturb that adds random noise to a Point. The method should have skeleton

def perturb(point: Point): Random[Point] =
???

Choose whatever noise function you like.

<div class="solution"> Here's our solution. We've already seen very similar code in the scatter plot.

def perturb(point: Point): Random[Point] =
for {
x <- Random.normal(0, 10)
y <- Random.normal(0, 10)
} yield Point.cartesian(point.x + x, point.y + y) 

</div>

Now create a parametric function, like we did in a previous chapter. You could use the rose function (the function we explored previously) or you could create one of your own devising. Here's the definition of rose.

def rose(k: Int): Angle => Point =
(angle: Angle) => {
Point.cartesian((angle * k).cos * angle.cos, (angle * k).cos * angle.sin)
}

We can combine our parametric function and perturb to create a method with type Angle => Random[Point]. You can write this easily using the andThen method on functions, or you can write this out the long way. Here's a quick example of andThen showing how we write the fourth power in terms of the square.

val square = (x: Double) => x * x
val quartic = square andThen square

<div class="solution"> Writing this with andThen is nice and neat.

def perturbedRose(k: Int): Angle => Random[Point] =
rose(k) andThen perturb

</div>

Now using allOn create a picture that combines randomnes and structure. Be as creative as you like, perhaps adding color, transparency, and other features to your image.

<div class="solution"> Here's the code we used to create Figure generative:volcano. It's quite a bit larger than code we've seen up to this point, but you should understand all the components this code is built from.

object ParametricNoise {
def rose(k: Int): Angle => Point =
(angle: Angle) => {
Point.cartesian((angle * k).cos * angle.cos, (angle * k).cos * angle.sin)
}

def scale(factor: Double): Point => Point =
(pt: Point) => {
Point.polar(pt.r * factor, pt.angle)
}

def perturb(point: Point): Random[Point] =
for {
x <- Random.normal(0, 10)
y <- Random.normal(0, 10)
} yield Point.cartesian(point.x + x, point.y + y)

def smoke(r: Normalized): Random[Image] = {
val alpha = Random.normal(0.5, 0.1)
val hue = Random.double.map(h => (h * 0.1).turns)
val saturation = Random.double.map(s => s * 0.8)
val lightness = Random.normal(0.4, 0.1)
val color =
for {
h <- hue
s <- saturation
l <- lightness
a <- alpha
} yield Color.hsla(h, s, l, a)
val c = Random.normal(5, 5) map (r => Image.circle(r))

for {
circle <- c
line   <- color
} yield circle.strokeColor(line).noFill
}

def point(
position: Angle => Point,
scale: Point => Point,
perturb: Point => Random[Point],
image: Normalized => Random[Image],
rotation: Angle
): Angle => Random[Image] = {
(angle: Angle) => {
val pt = position(angle)
val scaledPt = scale(pt)
val perturbed = perturb(scaledPt)

val r = pt.r.normalized
val img = image(r)

for {
i  <- img
pt <- perturbed
} yield (i at pt.toVec.rotate(rotation))
}
}

def iterate(step: Angle): (Angle => Random[Image]) => Random[Image] = {
(point: Angle => Random[Image]) => {
def iter(angle: Angle): Random[Image] = {
if(angle > Angle.one)
Random.always(Image.empty)
else
for {
p  <- point(angle)
ps <- iter(angle + step)
} yield (p on ps)
}

iter(Angle.zero)
}
}

val image: Random[Image] = {
val pts =
for(i <- 28 to 360 by 39) yield {
iterate(1.degrees){
point(
rose(5),
scale(i),
perturb _,
smoke _,
i.degrees
)
}
}
val picture = pts.foldLeft(Random.always(Image.empty)){ (accum, img) =>
for {
a <- accum
i <- img
} yield (a on i)
}
val background = (Image.rectangle(650, 650).fillColor(Color.black))

picture map { _ on background }
}
}

</div>