0
Canvas code wouldnât work
I tried same canvas code as the sololearn but it doesnât work. Iâm Using Notepad++. <html>.... <body> <canvas id="canvas1" width="400" height="300"></canvas> <script> var canvas=Document.getElementByid("canvas1"); var ctx=canvas.getContext("2d"); ctx.fillstyle = "#FF0000"; ctx.fillRect(10,10, 100, 100); <!-- ctx.fillrect(x,y,width,height) --> ctx.rotate( (Math.PI / 180) * 25); //rotate 25 degrees. ctx.fillstyle = "#0000FF"; ctx.fillRect(10,10, 100, 100); </script> </body> ....</html>
6 RĂ©ponses
+ 6
Because it's document.getElementById but you wrote Document.getElementByid which is incorrect.
//check below it's correct
var canvas=document.getElementById("canvas1");
+ 5
did you remove the dots & write document.getElementById correctly?
The below code is working fine. if the below doesn't work then it may be your browser or device.
<html>
<body>
<canvas id="canvas1" width="400" height="300"></canvas>
<script>
var canvas=document.getElementById("canvas1");
var ctx=canvas.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(10,10, 100, 100); // ctx.fillrect(x,y,width,height)
ctx.rotate( (Math.PI / 180) * 25); //rotate 25 degrees.
ctx.fillStyle = "#0000FF";
ctx.fillRect(10,10, 100, 100);
</script>
</body>
</html>
+ 5
There was a typo in fillStyle the S should be capital in it. check the demo it shows colors now.
+ 1
Yeah. Let me try this...
Thanks.
0
It still doesnât work!!
0
I think my browser is the problem. When i changed it though, in firefox too it has problem. Two squares appear but they both are black.