Can't read getContext property...

Question

<canvas id="canvas"></canvas>
In javascript
When I am trying this...
var canvas= document.getElementById('canvas');
var ctx= canvas.getContext('2d');
It is showing me an error message that it can't read getContext...why it's happening
Will you please tell me where am I going wrong

Answer 1

// You haven't use "window.onload" to get a context for the canvas.

For example :
https://code.sololearn.com/Wp7VT4YaZJgg/?ref=app
https://code.sololearn.com/WZXfgNIuw41S/?ref=app

Answer 2

//it's seems no problem here.

//Can you attach full source code so we can look further in codes

Answer 3

Make sure than getElementById return the canvas element and not null (eg. call js after browser load canvas and not before)

Answer 4

Is it necessary to add window.onload everytime

Answer 5

Its not necessary use window.onload though its used often... The important is than you get a reference to an element AFTER its loaded by browser else you will get a null reference. This is source of confusion among many users, above all on SL where the content of JS tab is inserted into head element of final generated html file then, get a reference DIRECTLY inside it, you will get a null ref... Read and observe this code for understand
https://code.sololearn.com/WlA8Fx8bl6nI/?ref=app