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. tensorflow入门指南

    TensorFlow是Google公司2015年11月开源的第二代深度学习框架,是第一代框架DistBelief的改进版本. TensorFlow支持python和c/c++语言, 可以在cpu或gp ...

  2. C#中的Action和Func和Predicate

    一.[action<>]指定那些只有输入参数,没有返回值的委托 用了Action之后呢: 就是相当于省去了定义委托的步骤了. 演示代码: using System; using Syste ...

  3. 启动设置mongodb

    启动 ①:启动之前,我们要给mongodb指定一个文件夹,这里取名为”db",用来存放mongodb的数据. ②:微软徽标+R,输入cmd,首先找到“mongodb”的路径,然后运行mong ...

  4. Abp中自定义Exception的HttpStatusCode

    Abp中在新版本中,抛出的异常(比如:UserFriendlyException)通过AjaxResponse封装后返回的时候,HttpStatusCode默认指定成了500. 对于一些默认封装好的处 ...

  5. Linux路由表信息-route命令

    使用命令 :route route 命令    显示和设置Linux路由表 -A:设置地址类型: -C:打印将Linux核心的路由缓存: -v:详细信息模式: -n:不执行DNS反向查找,直接显示数字 ...

  6. Xshell配置密钥公钥(Public key)与私钥(Private Key)登录

    ssh登录提供两种认证方式:口令(密码)认证方式和密钥认证方式.其中口令(密码)认证方式是我们最常用的一种,这里介绍密钥认证方式登录到linux/unix的方法. 使用密钥登录分为3步:1.生成密钥( ...

  7. MyBatis学习笔记(三) Configuration类

    一.初探Configuration类 我们先来看一下MyBatis的XML配置文件的结构,(摘自mybatis.org) 下面这个是Configuration类的部分变量 一点不一样是不是??? 其实 ...

  8. Linux环境变量详解与应用

    在bash shell中,环境变量分为: >全局变量 >局部变量 全局变量,不仅对shell可见,对其子进程也可见 查看预设的全局环境变量: ghostwu@dev:~$ printenv ...

  9. 2017-12-02 编程语言试验之Antlr4+JavaScript实现"圈4"

    参考: ANTLR4: Making a compiler with the JavaScript runtime 演示效果虽弱, 还是先上图吧: 在线演示: 地址. 源码库: program-in- ...

  10. docker 安装jenkins

    基于docker 进行安装 软件,首先需要有docker环境. 1.docker 下载 jenkins 镜像 指定版本 ,因为低版本的后面安装 软件会失败(亲测). docker pull jenki ...