Functions with Parameters in Game Lab

Hi all,

I’m in Unit 3 Lesson 24 of CSD & working on the Challenge Level 10. We are trying to the get the ellipses to move across the screen.

I am having a hard time understanding why I can’ t create a function with parameters and have it work in the draw Loop?

I thought that something like this should work to get the an ellipse moving across the screen:
function drawScene1(xLoc) {
xLoc = xLoc + 3;
ellipse(200, 400, 400, 200);
ellipse(xLoc, 100, 100, 100);

And then this function is called in the drawLoop.
The issue is when called in the drawLoop I’m getting a message that xLoc hasn’t been defined. It works if I declare xLoc as a global variable outside of the drawLoop.
What am I missing in regards to creating a function with parameters and then calling it in the drawLoop?



Good question!

Unless this isn’t all of your code, you haven’t declared the variable xLoc first.

You can either declare it at the top of your code (preferred) or declare it inside the function using var xLoc = xLoc +3;

Your code is missing the “var”.

If you have declared it and it’s still not working, please send us the share link and we can further debug!



@hhook ,

I looked a little closer at the code and it would be helpful to have a link to your code and/or a copy of all of your code.

This function looks to be creating a series of ellipses if the function is called inside the drawLoop.


@mwood -
Thanks for your quick reply. I think where I need help is in defining the function drawScene1(xLoc). I thought that by using xLoc as a parameter, it would be defined within the drawScene function? When I declare xLoc at the beginning of the program, it works. So my question what am I forgetting to do to allow the parameter/local variable of xLoc to work?
Here’s the example I’ve been working with: Example



good question. I have played with your code and I think I can confirm that the parameters are passing from the draw( ) loop to the drawScene1 ( ) function due to the console.log statements I wrote.

I’m not an expert at this … but my current line of thinking is that the problem lies in returning the data back to the draw loop.

Here’s my code.

You can see that I renamed the parameter to xPos so I could console.log both values. It is definitely getting in and augmenting, but I’m stuck on how the data gets back to the draw loop where presumably, it would get updated and passed back to the drawScene function.

I know that the draw function is a special function, but I’m not sure if that’s the issue or if I am just not thinking about it the right way…

Anyone out there have an answer? I’ll keep thinking about it …


@hhook and @mwood,

Here was my stab at it. I used @mwood’s. @hhook - you had really solved this (if I am understanding your main question) with your code on line 39. When you return a value from a function, it goes back to the line where the function was called. In your first example, you have that function call set equal to a variable to “hold onto” the returned value. So, I repeated that pattern and set the function call equal to a variable and added the variable back to xLoc + new variable with returned value. I did have to lower the starting position because it was incrementing too quickly with a starting value of 100.

Is that what you were looking for?


@melynn and @mwood
Thank you both so much for help! I figured out the root of my issue. I was using xLoc outside of the drawScence function when in the drawLoop. That’s why the drawLoop wasn’t recognizing the variable! Thanks a million for your help! Much appreciated!