| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Test that restoring a valid matrix after aplying non-invertible doesn't collapse all path to 0,0.</title> |
| </head> |
| <body> |
| <canvas id='canvas0' width='100' height='100'></canvas> |
| <canvas id='canvas1' width='100' height='100'></canvas> |
| <canvas id='canvas2' width='100' height='100'></canvas> |
| <canvas id='canvas3' width='100' height='100'></canvas> |
| <canvas id='canvas4' width='100' height='100'></canvas> |
| <canvas id='canvas5' width='100' height='100'></canvas> |
| <canvas id='canvas6' width='100' height='100'></canvas> |
| <canvas id='canvas7' width='100' height='100'></canvas> |
| <script> |
| var canvas0 = document.getElementById('canvas0'); |
| var canvas1 = document.getElementById('canvas1'); |
| var canvas2 = document.getElementById('canvas2'); |
| var canvas3 = document.getElementById('canvas3'); |
| var canvas4 = document.getElementById('canvas4'); |
| var canvas5 = document.getElementById('canvas5'); |
| var canvas6 = document.getElementById('canvas6'); |
| var canvas7 = document.getElementById('canvas7'); |
| var ctx0 = canvas0.getContext('2d'); |
| var ctx1 = canvas1.getContext('2d'); |
| var ctx2 = canvas2.getContext('2d'); |
| var ctx3 = canvas3.getContext('2d'); |
| var ctx4 = canvas4.getContext('2d'); |
| var ctx5 = canvas5.getContext('2d'); |
| var ctx6 = canvas6.getContext('2d'); |
| var ctx7 = canvas7.getContext('2d'); |
| |
| // Testing moveTo. |
| ctx0.moveTo(80,80); |
| ctx0.lineTo(20,80); |
| ctx0.moveTo(0,0); |
| ctx0.lineTo(20,80); |
| ctx0.stroke(); |
| |
| // Testing lineTo. |
| ctx1.moveTo(80,80); |
| ctx1.lineTo(20,80); |
| ctx1.lineTo(0,0); |
| ctx1.stroke(); |
| |
| // Testing quadraticCurveTo. |
| ctx2.moveTo(80,80); |
| ctx2.lineTo(20,80); |
| ctx2.quadraticCurveTo(0,0,0,0); |
| ctx2.stroke(); |
| |
| // Testing bezierCurveTo. |
| ctx3.moveTo(80,80); |
| ctx3.lineTo(20,80); |
| ctx3.bezierCurveTo(0,0,0,0,0,0); |
| ctx3.stroke(); |
| |
| // Testing arcTo. |
| ctx4.moveTo(80,80); |
| ctx4.lineTo(20,80); |
| ctx4.arcTo(0,0,0,0,0); |
| ctx4.stroke(); |
| |
| // Testing lineTo with scale (1,0). |
| ctx5.moveTo(80,80); |
| ctx5.lineTo(20,80); |
| ctx5.lineTo(0,20); |
| ctx5.stroke(); |
| |
| // Testing lineTo with scale (0,1). |
| ctx6.moveTo(80,80); |
| ctx6.lineTo(20,80); |
| ctx6.quadraticCurveTo(20,0,80,0); |
| ctx6.stroke(); |
| |
| // Different way to go from a non-infertible CTM to an invertible one. |
| ctx7.moveTo(0,0); |
| ctx7.lineTo(20,80); |
| ctx7.lineTo(80,80); |
| ctx7.stroke(); |
| |
| </script> |
| </body> |
| </html> |
