在Html5Canvas中,有几种清除屏幕的方法

在Html5Canvas中,有几种清除屏幕的方法,第1张

擦除canvas画布有两个方法可以使用:

clearRect方法

重新设置高宽度

示例:

/* 本示例使用jQuery描述 */

var canvas = $('#myCanvas')  //选择要擦除的canvas元素

var context = canvas.get(0).getContext('2d')  //获取canvas上下文

//第一种方法擦除(clearRect方法)

context.clearRect(0, 0, canvas.width(), canvas.height())

//第二种方法擦除(重新设置高宽度)

canvas.attr('width', canvas.width())

canvas.attr('height', canvas.height())

1. 在这个图片的位置接着画一个矩形,覆盖这个图片,并且把颜色设置成和背景色一样就OK了!

context.fillStyle="ffffff"//白色为例子;

context.fillRect(400,100,400,100)

注意,上面的代码要放在imageObj.onload里面才有效果;

2. 用clearRect()方法,代码如下:

context.clearRect(400,100,imageObj.width,100)//清除画布上的指定区域;

注意,上面的代码要放在imageObj.onload里面才有效果;

不知道你要的效果是怎么样的,(1)如果仅清除这一条线,可以用clearRect()方法,类似橡皮擦。(2)如果想不影响其他的画布,可以设置分层的canvas (3)保存原先的画,擦除部分,重画


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6270338.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-19
下一篇 2023-03-19

发表评论

登录后才能评论

评论列表(0条)

保存