clip-multiple-paths-badref.html (382B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <canvas id="canvas" width="100" height="100"></canvas> 5 <script> 6 7 var canvas = document.getElementById('canvas'); 8 var ctx = canvas.getContext('2d'); 9 10 ctx.fillStyle = '#0f0'; 11 ctx.fillRect(0, 0, 100, 100); 12 13 ctx.beginPath(); 14 ctx.arc(50, 50, 25, 0, 2 * Math.PI); 15 ctx.clip(); 16 17 ctx.fillStyle = '#f00'; 18 19 ctx.fillRect(0, 0, 100, 100); 20 21 </script> 22 </body></html>