如何删除canvas画过的直线

任志强 2017-05-18 10:25:19
我在用h5的canvas模拟时钟,但是每次秒针走的时候上一次绘制的直线都还在,应该怎样删除上次画过的线条吗
...全文
3264 8 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
8 条回复
切换为时间正序
请发表友善的回复…
发表回复
不恋水的雨 2018-11-09
  • 打赏
  • 举报
回复
用背景色的线条将之前的线覆盖掉就好了
mirrorspace 2017-05-20
  • 打赏
  • 举报
回复
重绘啊。哪怕只有一点点改变都重绘。这是动画
前端很忙 2017-05-19
  • 打赏
  • 举报
回复
每画新的一秒,就清空画布,再重新渲染新的时间图
任志强 2017-05-19
  • 打赏
  • 举报
回复
@天际的海浪 我都不知道咋样檫除画布,clearRect是檫除矩形,它能檫除lineTo画的直线吗
天际的海浪 2017-05-19
  • 打赏
  • 举报
回复
引用 3 楼 Rq_goUp 的回复:
@天际的海浪 我都不知道咋样檫除画布,clearRect是檫除矩形,它能檫除lineTo画的直线吗
用clearRect只能檫除矩形区域, 檫除别的形状可以用 globalCompositeOperation="destination-out" 合成模式,绘制要檫除的形状。 不过在用canvas做动画时,一般都是每一帧先擦除整个的画布,再重新在这个清空的画布上绘制新的画面。每一帧都是如此。 这是用canvas做动画基本做法。
yingxiaxin 2017-05-19
  • 打赏
  • 举报
回复
只能重新画一遍,不能单独清楚 某个指针
天际的海浪 2017-05-18
  • 打赏
  • 举报
回复
canvas画布中没办法直接删除指定的内容,只能擦除整个的画布,重新从头绘制新的画面。
任志强 2017-05-18
  • 打赏
  • 举报
回复
就是去掉这里绘过的直线 setInterval(function(){ //获取当前时间 var d=new Date(); var s=d.getSeconds();//秒 //秒对应的度数 var scount=s*6; console.log(s+","+scount); t.save(); t.beginPath(); t.strokeStyle="black"; t.lineWidth=2; t.moveTo(240,240); t.lineTo(240+150*Math.cos(scount*Math.PI/180),240+150*Math.sin(scount*Math.PI/180)); t.stroke(); // t.clip(); },1000);

39,118

社区成员

发帖
与我相关
我的任务
社区描述
HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准,是构建以及呈现互联网内容的一种语言方式.被认为是互联网的核心技术之一。
社区管理员
  • HTML5社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧