| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" |
| "http://www.w3.org/TR/html4/loose.dtd"> |
| <html> |
| <head> |
| <script> |
| var img; |
| |
| function imageLoaded() { |
| var NUM_IMAGE = 16; |
| for (var i = 0; i < NUM_IMAGE; i++) { |
| var canvases = document.getElementById('canvases'); |
| var canvas = document.createElement('canvas'); |
| canvas.width = 3; |
| canvas.height = 3; |
| var ctx = canvas.getContext('2d'); |
| |
| var pattern = ctx.createPattern(img, 'no-repeat'); |
| ctx.fillStyle = pattern; |
| ctx.translate(img.width / 2, img.height / 2); |
| var angle = 2 * Math.PI * i / NUM_IMAGE; |
| ctx.rotate(angle); |
| ctx.translate(- img.width / 2, - img.height / 2); |
| ctx.fillRect(0, 0, img.width, img.height); |
| |
| var div = document.createElement('div'); |
| div.appendChild(canvas); |
| canvases.appendChild(div); |
| } |
| |
| if (window.testRunner) { |
| testRunner.notifyDone(); |
| } |
| } |
| |
| function runTests() { |
| if (window.testRunner) { |
| testRunner.dumpAsText(true); |
| testRunner.waitUntilDone(); |
| } |
| |
| img = new Image(); |
| img.onload = imageLoaded; |
| img.src = ('data:image/png;base64,' + |
| 'iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAIAAADZSiLoAAAAAXNSR0IArs4c6QAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9kHEAcrAR/kt7IAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAAFElEQVQI12P4//8/AwMDhIQBuBgAs2oL9bpyMd8AAAAASUVORK5CYII='); |
| |
| } |
| </script> |
| </head> |
| <body onload="runTests();"> |
| You should see (almost) straight vertical line below. |
| <div id="canvases"></div> |
| </pre> |
| </body> |
| </html> |