canvas清除filltext
时间: 2023-10-26 13:10:02 浏览: 33
要清除 `fillText` 绘制的文本,可以使用 `clearRect()` 方法清除指定区域内的像素。例如,如果要清除整个 Canvas,请使用以下代码:
```javascript
const canvas = document.querySelector('canvas');
const context = canvas.getContext('2d');
// 清除整个 Canvas
context.clearRect(0, 0, canvas.width, canvas.height);
```
如果只想清除特定区域的文本,请使用相应区域的坐标和大小作为 `clearRect()` 方法的参数。例如,如果只想清除文本在 Canvas 的中心绘制的部分,请使用以下代码:
```javascript
const canvas = document.querySelector('canvas');
const context = canvas.getContext('2d');
// 在 Canvas 中心绘制文本
context.fillText('Hello world!', canvas.width / 2, canvas.height / 2);
// 清除 Canvas 中心区域的文本
context.clearRect(canvas.width / 2 - 50, canvas.height / 2 - 10, 100, 20);
```
在这个例子中,我们首先绘制了一个文本,然后使用 `clearRect()` 方法清除了中心区域的文本。 `clearRect()` 方法接受四个参数:清除区域的左上角 x 坐标、左上角 y 坐标、清除区域的宽度和高度。在这个例子中,我们计算了中心区域的坐标和大小,并将它们作为参数传递给 `clearRect()` 方法。