transformed-path.html (463B)
1 <html> 2 <body> 3 <canvas width="500" height="500"></canvas> 4 <script> 5 var canvas = document.getElementsByTagName('canvas')[0]; 6 var ctx = canvas.getContext('2d'); 7 ctx.scale(0.5, 0.5); 8 9 ctx.translate(41, 41.); 10 ctx.rect(0, 0, 100, 100); 11 ctx.translate(100, 0); 12 ctx.moveTo(0,0); 13 ctx.quadraticCurveTo(100, 100, 200,0); 14 ctx.translate(200, 0); 15 ctx.moveTo(0,0); 16 ctx.bezierCurveTo(100, 100, 200, -100, 300,0); 17 18 ctx.stroke(); 19 </script> 20 </body> 21 </html>