Why is canvas null?

Question

So I wrote this code, and it works on codepen, but on sololearn's codeplayground it returns a canvas null error. I can't figure it out.

https://code.sololearn.com/WD07YXaD5wP7/#js

Answer 1

you are attempting to load the canvas before the html was loaded completely, which causes to that you are looking for a canvas in the html which was not yet parsed

one way around is to do this:

function init(){
// all your code here (or at least initialization variables)
}
// call the init function when the html is fully loaded
window.onload=init;

you basically postpone your critical javascript code (init function in this case) from executing until the html is fully loaded

Answer 2

That sorted it, thanks for your help.