1447035-1.html (659B)
1 <html> 2 <body onload="fillCanvas('white'); fillCanvas('purple');"> 3 <script> 4 function fillCanvas(gradColor) { 5 var c = document.getElementById(gradColor + 'Canvas'); 6 var ctx = c.getContext("2d"); 7 // Create solid-color gradient, with all stops same color 8 var grd = ctx.createRadialGradient(75,50,5,90,60,100); 9 grd.addColorStop(0,gradColor); 10 grd.addColorStop(1,gradColor); 11 // Fill with gradient, but effectively a solid fill 12 ctx.fillStyle = grd; 13 ctx.fillRect(0,0,200,100); 14 } 15 </script> 16 <canvas id="whiteCanvas" width="200" height="100"></canvas> 17 <br> 18 <canvas id="purpleCanvas" width="200" height="100"></canvas> 19 </body> 20 </html>