OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <body> | 3 <body> |
4 <canvas id ="one" width="100" height="100"></canvas> | 4 <canvas id ="one" width="100" height="100"></canvas> |
5 <canvas id ="two" width="100" height="100"></canvas> | 5 <canvas id ="two" width="100" height="100"></canvas> |
6 <script> | 6 <script> |
7 function drawCircle(ctx, geom) { | 7 function drawCircle(ctx, geom) { |
8 var x = geom.width / 2; | 8 var x = geom.width / 2; |
9 var y = geom.height / 2; | 9 var y = geom.height / 2; |
10 | 10 |
(...skipping 15 matching lines...) Expand all Loading... |
26 for (var i = 0; i < 5; i++) { | 26 for (var i = 0; i < 5; i++) { |
27 drawCircle(ctx2, {width: 50, height: 20}); | 27 drawCircle(ctx2, {width: 50, height: 20}); |
28 ctx2.translate(0, 20); | 28 ctx2.translate(0, 20); |
29 } | 29 } |
30 ctx2.resetTransform(); | 30 ctx2.resetTransform(); |
31 ctx2.translate(50, 25); | 31 ctx2.translate(50, 25); |
32 drawCircle(ctx2, {width: 50, height: 50}); | 32 drawCircle(ctx2, {width: 50, height: 50}); |
33 </script> | 33 </script> |
34 </body> | 34 </body> |
35 </html> | 35 </html> |
OLD | NEW |