| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
| <title>Canvas Incremental Repaint</title> |
| <style type="text/css" media="screen"> |
| canvas { |
| width: 200px; |
| height: 150px; |
| border: 20px solid black; |
| } |
| </style> |
| <script src="../../resources/run-after-layout-and-paint.js"></script> |
| <script type="text/javascript" charset="utf-8"> |
| |
| function repaintTest() |
| { |
| var canvas = document.getElementById('canvas1'); |
| var ctx = canvas.getContext('2d'); |
| |
| ctx.fillStyle = 'green'; |
| ctx.save(); |
| ctx.setTransform(1, 0, 0, 1, 50, 200); |
| // Test the the transform applies the matrix in the correct order. |
| ctx.transform(1, 0, 0, -1, 0, 0); |
| ctx.fillRect(0, 100, 200, 80); |
| ctx.restore(); |
| } |
| </script> |
| </head> |
| <body onload="runAfterLayoutAndPaint(repaintTest, true)"> |
| <canvas id="canvas1"></canvas> |
| </body> |
| </html> |