HTML5 Canvas 清除畫布

HTML5 Canvas clearRect()的使用方法，2D上下文功能clearRect()用于清除畫布的矩形。清除的矩形變為透明。

在線示例

2D上下文功能clearRect()用于清除畫布的矩形。清除的矩形變為透明。這是一個代碼示例:

示例

HTML5?Canvas?not?supported

var?canvas??=?document.getElementById("ex1");

var?context?=?canvas.getContext("2d");

context.fillStyle?=?"#ff0000";

context.fillRect(10,10,?100,100);

context.strokeStyle?=?"#0000ff";

context.strokeRect(30,20,?120,?110);

context.clearRect(50,?30,?110,?35);

測試看看 ?/?HTML5 Canvas not supported

請注意，現在如何清除紅色和藍色矩形中的矩形。

如前所述，清除的使用clearRect()區域變為透明。如果canvas元素已放置在另一個元素的頂部，則該元素的內容將通過清除區域可見。

clearRect(x, y, width, height)

就像繪制矩形一樣，傳遞給的4個參數clearRect()表示要清除的矩形的左上角，以及要清除的矩形的寬度和高度。

這是一個更明確的示例：var?x?=?50;

var?y?=?30;

var?width??=?110;

var?height?=?25;

context.clearRect(x,?y,?width,?height);

總結

以上是生活随笔為你收集整理的java 怎么清除画布_HTML5 Canvas 清除画布的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。