Canvas清除画布

一、简单填充

使用白色背景色简单地填充整个画布,可以清除当前内容。

复制代码
var context= getContext("2d");
context.fillStyle = 'white';
context.fillRect(0, 0, theCanvas.width, theCanvas.height);

二、重置画布区域

当画布的宽或高被重置时,当前画布内容就会被移除。

复制代码
 var width = theCanvas.width;
 var height = theCanvas.height;
 theCanvas.width = width;
 theCanvas.height = height;

三、使用clearRect函数

clearRect() 函数指定起始点的x, y 位置以及宽度和高度来清除画布。

复制代码
var context= getContext("2d");
var width = theCanvas.width;
var height = theCanvas.height;
context.clearRect(0, 0, width, height);
相关推荐
苏州第一深情几秒前
终结加班眼酸?明基RD280U测评:程序员的双倍快乐,竟是4K护眼大屏给的!
前端·后端
i18nsite5 分钟前
互联网重构日记:1 - 开篇
前端·后端
洋不写bug7 分钟前
html表格,无序,有序,自定义,无语义,表单标签,特殊字符详解
前端·html
JarvanMo18 分钟前
Flutter. 适用于 GetX 5 的 CLI (命令行接口/工具)
前端
dyxal21 分钟前
VS Code 1.52.1 对应一些插件版本
前端·chrome
融化的雪33 分钟前
reactflow整理节点,尾节点位置的大坑
开发语言·前端·javascript
Gazer_S44 分钟前
【理解React Hooks与JavaScript类型系统】
前端·javascript·react.js
鹏多多1 小时前
前端IndexedDB数据库高效管理插件localForage的教程+案例
前端·javascript·vue.js
我血条子呢1 小时前
[HTML]播放wav格式音频
前端·html·音视频
CodeSheep1 小时前
大家有没有发现一个奇特现象:你能在一个公司工作 12 年以上,无论你多忠诚多卖力,一旦公司赚的少了,那你就成了“眼中钉肉中刺”
前端·后端·程序员