| OLD | NEW |
| (Empty) | |
| 1 <html> |
| 2 <body> |
| 3 <canvas id="c1" width="300" height="300"></canvas> |
| 4 <canvas id="c2" width="300" height="300"></canvas> |
| 5 <script type="text/javascript"> |
| 6 var canvas1 = document.getElementById('c1'); |
| 7 var canvas2 = document.getElementById('c2'); |
| 8 var bgcanvas = document.createElement('canvas'); |
| 9 bgcanvas.width = 100; |
| 10 bgcanvas.height = 100; |
| 11 var bgctx = bgcanvas.getContext('2d'); |
| 12 bgctx.fillStyle = 'green'; |
| 13 bgctx.fillRect(0, 0, bgcanvas.width, bgcanvas.height); |
| 14 var img = new Image(); |
| 15 img.src = bgcanvas.toDataURL(); |
| 16 var ctx1 = canvas1.getContext('2d'); |
| 17 var ctx2 = canvas2.getContext('2d'); |
| 18 |
| 19 ctx1.drawImage(bgcanvas, -100, -100, 300, 300, 0, 0, 300,300); |
| 20 ctx1.drawImage(bgcanvas, -100, -100, 200, 200, 0, 0, 100,100); |
| 21 ctx1.drawImage(bgcanvas, 0, -100, 100, 200, 100, 0, 100,100); |
| 22 ctx1.drawImage(bgcanvas, 0, -100, 200, 200, 200, 0, 100,100); |
| 23 ctx1.drawImage(bgcanvas, -100, 0, 200, 100, 0, 100, 100,100); |
| 24 ctx1.drawImage(bgcanvas, 0, 0, 200, 100, 200, 100, 100,100); |
| 25 ctx1.drawImage(bgcanvas, -100, 0, 200, 200, 0, 200, 100,100); |
| 26 ctx1.drawImage(bgcanvas, 0, 0, 100, 200, 100, 200, 100,100); |
| 27 ctx1.drawImage(bgcanvas, 0, 0, 200, 200, 200, 200, 100,100); |
| 28 |
| 29 ctx2.drawImage(bgcanvas, -100, -100, 300, 300, 0, 0, 300,300); |
| 30 ctx2.drawImage(bgcanvas, -100, -100, 200, 200, 0, 0, 100,100); |
| 31 ctx2.drawImage(bgcanvas, 0, -100, 100, 200, 100, 0, 100,100); |
| 32 ctx2.drawImage(bgcanvas, 0, -100, 200, 200, 200, 0, 100,100); |
| 33 ctx2.drawImage(bgcanvas, -100, 0, 200, 100, 0, 100, 100,100); |
| 34 ctx2.drawImage(bgcanvas, 0, 0, 200, 100, 200, 100, 100,100); |
| 35 ctx2.drawImage(bgcanvas, -100, 0, 200, 200, 0, 200, 100,100); |
| 36 ctx2.drawImage(bgcanvas, 0, 0, 100, 200, 100, 200, 100,100); |
| 37 ctx2.drawImage(bgcanvas, 0, 0, 200, 200, 200, 200, 100,100); |
| 38 |
| 39 </script> |
| 40 </body></html> |
| OLD | NEW |