1201272-1.html (752B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <script> 6 function draw() { 7 var ctx = document.getElementById('c').getContext('2d'); 8 9 ctx.beginPath(); 10 ctx.arc(75, 75, 74, 0, 2 * Math.PI); 11 ctx.closePath(); 12 ctx.fill(); 13 14 ctx.globalCompositeOperation = 'destination-out'; 15 ctx.shadowColor = 'rgba(0, 0, 0, 0.8)'; 16 ctx.shadowBlur = 3; 17 ctx.beginPath(); 18 ctx.arc(75, 75, 40, 0, 2 * Math.PI); 19 ctx.closePath(); 20 ctx.fill(); 21 ctx.shadowBlur = 0; 22 23 ctx.globalCompositeOperation = 'source-over'; 24 ctx.lineWidth = 10; 25 ctx.strokeStyle = 'green'; 26 ctx.beginPath(); 27 ctx.arc(75, 75, 40, 0, 2 * Math.PI); 28 ctx.closePath(); 29 ctx.stroke(); 30 } 31 </script> 32 </head> 33 <body onload='draw()' style='background: white;'> 34 <canvas id='c' width='200' height='200'></canvas> 35 </body> 36 </html>