js中说明的上下文表示的意思为C++中作用域(个人理解),因此2D上下文说明的是这个2D的作用域

像素:用来描述图片清晰度的小矩阵

填充和描边

填充:context.fillStyle = "yellow";

描边:context.strokeStyle = "red";

如果单纯的使用这两个属性,不会再网页上面显示的。

var drawing = document.getElementById("drawing");
if(drawing.getContext)
{
  var context = drawing.getContext("2d");
  context.strokeStyle = "red";
  context.fillStyle = "yellow";
  context.fillRect(20,20,150,100)
  context.strokeRect(20,20,150,100)
  console.log(context)
}

2D上下文的更多相关文章

  1. 《JAVASCRIPT高级程序设计》Canvas绘图-2D上下文

    Canvas是HTML5添加的新元素,这个元素负责在页面中设定一个区域,然后通过JavaScript动态的在这个区域绘制图形.<canvas>由几组API组成,除了具备基本绘图能力的2D上 ...

  2. Javascript高级编程学习笔记(85)—— Canvas(2)2D上下文

    2D上下文 使用2D上下文提供的方法可以绘制简单的2D图形,如矩形,弧线和路径; 2D上下文的坐标开始域<canvas>元素的左上角,原点坐标为(0,0) 后续所有操作的计算都基于原点,x ...

  3. canvas之2D上下文

    1.填充和描边 (1)fillStyle (2)strokeStyle 2.绘制矩形 (1)fillRect() (2)strokeRect() (3)clearRect()   :清除画布上的矩形区 ...

  4. 【Web动画】CSS3 3D 行星运转 && 浏览器渲染原理

    承接上一篇:[CSS3进阶]酷炫的3D旋转透视 . 最近入坑 Web 动画,所以把自己的学习过程记录一下分享给大家. CSS3 3D 行星运转 demo 页面请戳:Demo.(建议使用Chrome打开 ...

  5. HTML5移动开发学习笔记之Canvas基础

    1.第一个Canvas程序 看的是HTML5移动开发即学即用这本书,首先学习Canvas基础,废话不多说,直接看第一个例子. 效果图为: 代码如下: <!DOCTYPE html> < ...

  6. 简介 jCanvas:当 jQuery遇上HTML5 Canvas

    https://github.com/caleb531/jcanvas HTML5 可以直接在你的网页中使用 <canvas> 元素及其相关的 JavaScript API绘制的图形. 在 ...

  7. 初步了解Canvas

      <--------一些理论储备: ------------------------------------------------------------------------------ ...

  8. 使用canvas元素-art方法绘制圆弧

    最近在学习HTML5,发现canvas真的很棒,canvas元素是一种可供绘图的平面,我们用JavaScript对它进行配置和操作.我这里说一下arc方法绘制圆弧,顺便提一下涉及到的基础知识. 首先看 ...

  9. HTML5之Canvas时钟(网页效果--每日一更)

    今天,带来的是使用HTML5中Canvas标签实现的动态时钟效果. 话不多说,先看效果:亲,请点击这里 众所周知,Canvas标签是HTML5中的灵魂,HTML5 Canvas是屏幕上的一个由Java ...

随机推荐

  1. maven跳过单元测试-maven.test.skip和skipTests的区别以及部分常用命令

    -DskipTests,不执行测试用例,但编译测试用例类生成相应的class文件至target/test-classes下. -Dmaven.test.skip=true,不执行测试用例,也不编译测试 ...

  2. 一个leetcode解题报告类目,代码很简洁

    http://bookshadow.com/leetcode/ 里面的代码很简洁.可以看.

  3. 3、Python字典集合

    2.3字典 字典是键值对的无序可变序列.键值之间用冒号隔开,相邻元素之间用逗号隔开,所有元素放在大括号之间{},键可以是Python中所有不可变的数据,不能用列表.元组.字典作为字典的键,键不可重复, ...

  4. Block的使用--初探Block

    看了两天的Block. 网上是有非常多解说与教程,也有讲得非常好的.这里就主要解说下我的理解与收获.欢迎拍砖. 所谓block.我觉得应该是一个闭包函数.而闭包,就是说block以及内部全部的变量生命 ...

  5. Android笔记——Activity中的数据传递案例(用户注冊)

    1.创建程序activity_main: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/andro ...

  6. JAVA输出带BOM的UTF-8编码的文件

    当从http 的response输出CSV文件的时候,设置为utf8的时候默认是不带bom的,可是windows的Excel是使用bom来确认utf8编码的,全部须要把bom写到文件的开头. 微软在 ...

  7. 几种常见sqlalchemy查询:

        #简单查询     print(session.query(User).all())     print(session.query(User.name, User.fullname).all ...

  8. 搭建Mysql双机热备 (主从同步)

    准备两台centos7主机:10.0.18.132 master 10.0.18.136  slave 先把selinux关闭,iptables关闭  或者添加端口 132 master安装好Mysq ...

  9. jqueryEasyUI form表单提交的一个困惑

    今天用到了jqueryEasyUI的form表单做一个增加操作的提交,想打开调试(用的是火狐)看看传的参数,但是怎么也看不到form表单提交的http请求?而且还会发送一个另外的请求! 在页面加载时, ...

  10. POJ 1320 Street Numbers(佩尔方程)

    Street Numbers Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 3078   Accepted: 1725 De ...