220
社区成员
发帖
与我相关
我的任务
分享？？html5怎么清除canvas画布内容？？？？
用context.drawImage(img,10,0);后怎么清除画进去的这张图
请求高人指点！！
请求高人指点！！
...全文
请发表友善的回复…
发表回复
qq_38109269 2017-03-29
- 打赏
- 举报
用fabric的remove()
baidu_31302759 2016-05-26
- 打赏
- 举报
我用clearRect 好像无效 我是用fabric画的
qq_34697792 2016-04-17
- 打赏
- 举报
<!DOCTYPE html>
<html>
<script type="text/javascript">
function clearMap{
context.clearRect(0,0,300,200);
}
</script>
<body>
<canvas id="myCanvas" style="border:1px solid"; width="300" height="200">
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var context=c.getContext("2d");
context.strokeStyle="FF00FF";
context.beginPath();
context.arc(200,150,100,-Math.PI*5/6,true);
context.stroke();
</script>
</br>
<input name="" type="button" value="清空画布" onClick="clearMap();">
</body>
</html>
从此程序员 2014-08-13
- 打赏
- 举报
试了下好像是可以，2楼正解
sun_7_flower 2014-08-13
- 打赏
- 举报
不错不错，学习了，很有用的说。
君鹏不姓贾 2014-08-13
- 打赏
- 举报
我找到了一些相关的资料，分享给你
链接是：http://blog.sina.com.cn/s/blog_65b9816e0101pb8n.html
清除方法一、
在这个图片的位置接着画一个矩形，覆盖这个图片，并且把颜色设置成和背景色一样就OK了！代码如下：
context.fillStyle="ffffff";//白色为例子；
context.fillRect(400,100,400,100);
注意，上面的代码要放在imageObj.onload里面才有效果；
清除的方法二，用clearRect()方法，代码如下：
context.clearRect(400,100,imageObj.width,100);//清除画布上的指定区域；
注意，上面的代码要放在imageObj.onload里面才有效果；
效果图如下：
链接是：http://blog.sina.com.cn/s/blog_65b9816e0101pb8n.html
清除方法一、
在这个图片的位置接着画一个矩形，覆盖这个图片，并且把颜色设置成和背景色一样就OK了！代码如下：
context.fillStyle="ffffff";//白色为例子；
context.fillRect(400,100,400,100);
注意，上面的代码要放在imageObj.onload里面才有效果；
清除的方法二，用clearRect()方法，代码如下：
context.clearRect(400,100,imageObj.width,100);//清除画布上的指定区域；
注意，上面的代码要放在imageObj.onload里面才有效果；
效果图如下：
君鹏不姓贾 2014-08-13
- 打赏
- 举报
同是新手，我也不会。不过这个问题是不是可以通过一个投机取巧的方法来做呢？在原有图像上新画一个同样大小的东西，颜色设置为跟背景一致，这样不就看不出来了，欺骗了大家的眼睛
