html5 canvas 清除可以使用clearRect() 方法

clearRect() 方法的作用是清空给定矩形内的指定像素。
JavaScript 语法：
context.clearRect(x,y,width,height);

x 要清除的矩形左上角的 x 坐标
y 要清除的矩形左上角的 y 坐标
width 要清除的矩形的宽度，以像素计
height 要清除的矩形的高度，以像素计

<!DOCTYPE html>
<html>
<body>

<canvas id="myCanvas_keleyi_com" width="300" height="150" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.
</canvas>

<script>

var c=document.getElementById("myCanvas_ke"+"leyi_com");
var ctx=c.getContext("2d");
ctx.fillStyle="red";
ctx.fillRect(0,0,300,150);
ctx.clearRect(20,20,100,50);

</script>

</body>
</html>

clearRect清除html5画布的更多相关文章

  1. HTML5画布(CANVAS)速查简表

    HTML5画布(CANVAS)速查简表 http://www.webhek.com/misc/html5-canvas-cheat-sheet/

  2. HTML5画布生成的3D飞船舰队效果

    在线演示 本地下载 使用HTML5画布2D来模拟3D的空间效果,生成舰队飞行效果,了解如何开发,请阅读下面代码相关“轻视频”: HTML5画布模拟生成3D的舰队飞行效果

  3. 使用HTML5画布（canvas）生成阴影效果

    来源:GBin1.com 使用HTML5的画布特性,我们可以创建图形,在这片文章中,我们将创建图形的阴影. var canvas = document.getElementById('shadowca ...

  4. 设置清除html5页面缓存

    设置清除html5页面缓存 html5端设置 meta 标签: <meta http-equiv="Pragma" content="no-cache" ...

  5. HTML5 画布参考

    描述 HTML5 <canvas> 标签用于绘制图像(通过脚本,通常是 JavaScript). 不过,<canvas> 元素本身并没有绘制能力(它仅仅是图形的容器) - 您必 ...

  6. 06. Web大前端时代之：HTML5+CSS3入门系列~HTML5 画布

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 我们先看看画布的魅力: 初始画布 canvas默认是宽3 ...

  7. html5画布基础

    canvas 元素用于在网页上绘制图形. 什么是canvas? HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像. 画布是一个矩形区域,您可以控制其每一像素. canva ...

  8. html5画布的旋转效果

    keleyi.htm的代码如下: <!DOCTYPE HTML> <html> <head> <title>html旋转画布-柯乐义</title ...

  9. html5 画布上的rotate使用

    作为刚进公司的毕业生,第一个项目便是开发html5游戏,于是网上搜寻各种有关html5的资料,把w3School中有关html5的教程通通过了一遍,发现里面的教程非常适合刚接触html5的人,作为菜鸟 ...

随机推荐

  1. T-SQL ：联接查询练习 (杂)

    1.每个客户返回一行订单 日期在~到~之间 SELECT E.empid, , ') AS dt FROM HR.Employees AS E CROSS JOIN Nums AS D ORDER B ...

  2. [PHP] 数据结构-单链表头插法PHP实现

    1.创建头结点 2.创建新结点 3.新结点next指向头结点next 4.头结点next指向新结点 <?php class Node{ public $data; public $next; } ...

  3. Java集合之LinkedHashMap源码分析

    概述 HashMap是无序的, 即put的顺序与遍历顺序不保证一样. LinkedHashMap是HashMap的一个子类, 它通过重写父类的相关方法, 实现自己的功能. 它保留插入的顺序. 如果需要 ...

  4. Mybatis事务管理

    一.Mybatis事务 1.事务管理方式 Mybatis中的事务管理方式有两种: 1.JDBC的事务管理机制,即使用JDBC事务管理机制进行事务管理 2.MANAGED的事务管理机制,Mybatis没 ...

  5. canvas-0trasform.html

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 【读书笔记】iOS-动态类型和动态绑定

    id是泛类型,可以用来存放各种类型的对象,使用id也就是使用“动态类型”. 动态类型,就是指,对象实际使用的是哪一个类是在执行期间确定的,而非在编译期间. 虽然id类型可以定义任何类型的对象,但是不要 ...

  7. CSS的引入方式及CSS选择器

    一 CSS介绍 现在的互联网前端分三层: a.HTML:超文本标记语言.从语义的角度描述页面结构. b.CSS:层叠样式表.从审美的角度负责页面样式. c.JS:JavaScript .从交互的角度描 ...

  8. Android Studio_更新Gradle

    一.Gradle更新问题 Android Studio每次更新版本都会更新Gradle这个插件,而且有时候提示更新,却一直更新不了,那是因为中国伟大的长城问题.就是下图,我刚刚更新了,提示更新grad ...

  9. Mongodb的入门（8）mongodb事物分析

    老生常谈:<在前面博客中也介绍过> mongodb官网:https://docs.mongodb.com/manual/introduction/ mongodb:官网上是这样定义的Mon ...

  10. web工程设计<mysql数据模型-数据类型的优化>

    Schema与数据类型优化 良好的逻辑设计和物理设计是高性能的基石,应该根据系统将要执行的查询语句来设计schema,这往往需要权衡各种因素. 一:选择优化的数据类型 ①:更小的通常更好 整数类型:M ...