OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <body> | 3 <body> |
4 <canvas id ="output" width="100" height="100" style="background: blue;"></canvas
> | 4 <canvas id ="output" width="100" height="100" style="background: blue;"></canvas
> |
5 <script> | 5 <script> |
6 var canvas = document.getElementById('output'); | 6 var canvas = document.getElementById('output'); |
7 var ctx = canvas.getContext('2d'); | 7 var ctx = canvas.getContext('2d'); |
8 | 8 |
9 ctx.fillStyle = 'green'; | 9 ctx.fillStyle = 'green'; |
10 ctx.fillRect(0, 0, 100, 100); | 10 ctx.fillRect(0, 0, 100, 100); |
11 | 11 |
12 ctx.clearRect(40, 40, 20, 20); | 12 ctx.clearRect(40, 40, 20, 20); |
13 | 13 |
14 ctx.strokeStyle = 'red'; | 14 ctx.strokeStyle = 'red'; |
15 ctx.lineWidth = 4; | 15 ctx.lineWidth = 4; |
16 ctx.strokeRect(20, 20, 60, 60); | 16 ctx.strokeRect(20, 20, 60, 60); |
17 </script> | 17 </script> |
18 </body> | 18 </body> |
19 </html> | 19 </html> |
OLD | NEW |