How do you find a circle that just disappeared and how do you put it back?

I don't fully understand the Khan Academy environment, but apparently it provides a draw() function and a canvas for you out of the box. Generally in P5 you need draw(), setup() or both to make a P5 app:

This version works in Khan Academy, which apparently also prohibits const and let:

function bob(text1, x1, y1) { var textWidthValue = textWidth(text1); var circleDiameter = max(50, textWidthValue + 40); var circleRadius = circleDiameter / 2; var circleX = x1; var circleY = (3 / 5) * height - circleRadius; line(x1, y1, x1, circleY); fill(255, 0, 0); ellipse(circleX, circleY, circleDiameter, circleDiameter); fill(255); textAlign(CENTER, CENTER); text(text1, circleX, circleY); } background(220); bob("Bob is Your uncle", 200, 350);

The main fixes here are:

bob("Bob is Your uncle", 256, 784); looks off canvas--784 pixels on the Y axis. var circleDiameter = max(circleDiameter, textWidthValue + 40); does not work because circleDiameter is undefined, so you wind up with NaN as the diameter.

Generally speaking, you may be coding too quickly. If you write a large chunk of code all at once, and it doesn't work, there's no obvious entry point for debugging. Slow down and build incrementally, running the code and verifying that it works after every line you change.

For example, start with just getting a simple circle or line in the middle of the screen. Then add text colors step by step, running and checking as you go. Avoid adding functions like bob() until you have things working in the main top level, then factor it out and make sure parameters are properly defined.

Start with this:

background(220); fill(255, 0, 0); ellipse(100, 100, 100, 100);

As you introduce variables, you'd normally use print() to see what their values are if something isn't working. But it seems Khan Academy doesn't show logs, which is a huge problem. I'd advise using https://editor.p5js.org instead.