An answer, not a picture

Challenge 8 of 12

Not every function draws. This one hands a number back with return, and the circle line uses what it says, so the shape finds the middle of any window.

Write middleAcross to return width / 2, then draw a CYAN circle 120 across at it, 200 down, on BLACK.

Your code JavaScript

Write middleAcross to return width / 2, then draw a CYAN circle 120 across at it, 200 down, on BLACK.

Console print() output

0 / 30 frames · 320×480

Target

Yours

Yours over Target — ghosted shapes are in the target but missing from yours

Results

Press Run to check your code

Penalties: none this run

Report this challenge

Lesson Code it yourself

Everything in this topic starts the same way: an empty editor. There is nothing to fill in, because there is nothing there — the definition, the inputs and the calls are all yours.

The buttons above the editor do the fiddly part. Click function and you get the whole shape of a definition, curly brackets and all, with the cursor sitting inside it. Click everyFrame and you get the block that runs every frame. Nothing a button gives you is the answer; the name, what it takes and what it draws are still your decisions.

Two rules decide whether a function works, and both are about where lines sit rather than what they say. A definition can go above or below everyFrame — the sketch reads the whole file before it draws anything — but the drawing only happens when something calls the name. A definition on its own draws nothing at all, and that is the commonest reason a canvas comes back empty here.

An input is a name you invent inside the round brackets, and it means the caller decides. drawTree(x) draws its tree wherever the call says; drawTree(x, howBig) lets the call choose the size as well. Inside the function that name is just a number like any other, so it can go into a sum: x - 20 is twenty to the left of wherever it was sent.

A function can hand a number back instead of drawing, with return. Then it is not a picture but an answer, and the line that called it uses the answer wherever a number would go.

Press Run early and often. Write the definition, call it once, run it, and only then add the second call — one line at a time is far easier than eight lines and a blank canvas.