如何在canvas中使用clip抠出一个区域

今天就跟大家聊聊有关如何在canvas中使用clip抠出一个区域，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

创新互联专注于双流网站建设服务及定制，我们拥有丰富的企业做网站经验。 热诚为您提供双流营销型网站建设，双流网站制作、双流网页设计、双流网站官网定制、成都微信小程序服务，打造双流网络公司原创品牌,更为您提供双流网站排名全网营销落地服务。

  
  
      
          
          
      
      
          
      
      
        var canvas = document.getElementById("canvas");  
        var context = canvas.getContext("2d");  
        context.fillStyle = "lightgreen";  
        context.fillRect(0, 0, canvas.width, canvas.height);  
        context.beginPath();  
        context.fillRect(100, 100, 200, 100);  
        context.clip();  
        context.closePath();  
        context.fillStyle = "lightblue";  
        context.fillRect(0, 0, canvas.width, canvas.height);  
      

发现如果要抠出一个新的路径的话应该使用rect、arc等方法

所有应该在改为

context.beginPath();  
context.rect(100, 100, 200, 100);  
context.clip();

看完上述内容，你们对如何在canvas中使用clip抠出一个区域有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注创新互联行业资讯频道，感谢大家的支持。