transformed-gradient.html (465B)
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 8 ctx.translate(500, 500); 9 var lineargradient = ctx.createLinearGradient(-500,-500,0,0); 10 lineargradient.addColorStop(0,'red'); 11 lineargradient.addColorStop(1,'black'); 12 ctx.fillStyle = lineargradient; 13 ctx.beginPath(); 14 ctx.rect(-500, -500, 250, 250); 15 ctx.fill(); 16 </script> 17 </body> 18 </html>