7th Feb 2021, 7:10 AM
Carbon dioxide
Carbon dioxide - avatar
2 Answers
+ 4
something like this works because your canvas is being called without the window being load properly. Also X, Y, Width and Height in your code is not defined and initialise, so I've used raw values here. window.onload = function(){ var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); ctx.rect(50, 60, 1500, 1500); ctx.rect(0, 0, 200, 50); ctx.fillStyle = "red"; ctx.fillStyle = "blue"; ctx.rect(0, 0, 200, 200); ctx.strokeRect(0, 0, 100, 100); ctx.strokeStyle = "red"; ctx.strokeRect(0, 0, 100, 100); }
7th Feb 2021, 7:17 AM
minirkk
minirkk - avatar
+ 3
js tab in android sololearn app' is loaded as it was included in the <head> section of the html tab, so when it run, document is not loaded (canvas is not yet accessible through DOM), so you need to wrap your code in an onload event handler: onload = () => { var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); // ctx.rect(X, Y, Width, Height); // there's no X, Y, Width, nor Height variables ctx.rect(0, 0, 200, 50); ctx.fillStyle = "red"; ctx.fillStyle = "blue"; ctx.rect(0, 0, 200, 200); ctx.strokeRect(0, 0, 100, 100); ctx.strokeStyle = "red"; ctx.strokeRect(0, 0, 100, 100); }; commented one line throwing error ;)
7th Feb 2021, 7:18 AM
visph
visph - avatar