2D上下文
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上下文的更多相关文章
- 《JAVASCRIPT高级程序设计》Canvas绘图-2D上下文
Canvas是HTML5添加的新元素,这个元素负责在页面中设定一个区域,然后通过JavaScript动态的在这个区域绘制图形.<canvas>由几组API组成,除了具备基本绘图能力的2D上 ...
- Javascript高级编程学习笔记(85)—— Canvas(2)2D上下文
2D上下文 使用2D上下文提供的方法可以绘制简单的2D图形,如矩形,弧线和路径; 2D上下文的坐标开始域<canvas>元素的左上角,原点坐标为(0,0) 后续所有操作的计算都基于原点,x ...
- canvas之2D上下文
1.填充和描边 (1)fillStyle (2)strokeStyle 2.绘制矩形 (1)fillRect() (2)strokeRect() (3)clearRect() :清除画布上的矩形区 ...
- 【Web动画】CSS3 3D 行星运转 && 浏览器渲染原理
承接上一篇:[CSS3进阶]酷炫的3D旋转透视 . 最近入坑 Web 动画,所以把自己的学习过程记录一下分享给大家. CSS3 3D 行星运转 demo 页面请戳:Demo.(建议使用Chrome打开 ...
- HTML5移动开发学习笔记之Canvas基础
1.第一个Canvas程序 看的是HTML5移动开发即学即用这本书,首先学习Canvas基础,废话不多说,直接看第一个例子. 效果图为: 代码如下: <!DOCTYPE html> < ...
- 简介 jCanvas:当 jQuery遇上HTML5 Canvas
https://github.com/caleb531/jcanvas HTML5 可以直接在你的网页中使用 <canvas> 元素及其相关的 JavaScript API绘制的图形. 在 ...
- 初步了解Canvas
<--------一些理论储备: ------------------------------------------------------------------------------ ...
- 使用canvas元素-art方法绘制圆弧
最近在学习HTML5,发现canvas真的很棒,canvas元素是一种可供绘图的平面,我们用JavaScript对它进行配置和操作.我这里说一下arc方法绘制圆弧,顺便提一下涉及到的基础知识. 首先看 ...
- HTML5之Canvas时钟(网页效果--每日一更)
今天,带来的是使用HTML5中Canvas标签实现的动态时钟效果. 话不多说,先看效果:亲,请点击这里 众所周知,Canvas标签是HTML5中的灵魂,HTML5 Canvas是屏幕上的一个由Java ...
随机推荐
- [Javascript] Simplify Creating Immutable Data Trees With Immer
Immer is a tiny library that makes it possible to work with immutable data in JavaScript in a much m ...
- CodeForces 52B Right Triangles 矩阵上的计数
题目链接:点击打开链接 题意: 问有多少个与矩阵边平行的直角三角形.且三角形的3个顶点都是* 对于 L形 或者_| 形的三角形.我们仅仅须要知道在_ 上方有多少个*就可以,下底边则任取2个 所以用l[ ...
- HDU 3652 B-number(数位dp&记忆化搜索)
题目链接:[kuangbin带你飞]专题十五 数位DP G - B-number 题意 求1-n的范围里含有13且能被13整除的数字的个数. 思路 首先,了解这样一个式子:a%m == ((b%m)* ...
- MFC,C++,VC++,VS2010 之间究竟是什么关系
C++是在C语言的基础上发展而来的面向对象的一种语言: MFC是基于C++类的窗口开发工具,内含大量的基类.降低编程人员的工作量: VC++是一种开发工具. VS2010是更高版本号的开发工具,功能强 ...
- Java - 多线程Callable、Executors、Future
http://blog.csdn.net/pipisorry/article/details/44341579 Introduction Callable接口代表一段能够调用并返回结果的代码; Fut ...
- sass05 数据类型,数据运算
/*! 数字类型 */ $n1: 1.2; $n2: 12; $n3: 14px; p{ font-size: $n3; } /*! 字符串类型*/ $s1: container; $s2: 'con ...
- bzoj1211: [HNOI2004]树的计数(prufer序列+组合数学)
1211: [HNOI2004]树的计数 题目:传送门 题解: 今天刚学prufer序列,先打几道简单题 首先我们知道prufer序列和一颗无根树是一一对应的,那么对于任意一个节点,假设这个节点的度数 ...
- hdoj--1237--简单计算器(栈模拟)
简单计算器 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Subm ...
- springboot Ehcache缓存配置
例牌的导包 <!-- 包含支持UI模版(Velocity,FreeMarker,JasperReports), 邮件服务, 脚本服务(JRuby), 缓存Cache(EHCache), 任务计划 ...
- 6.boostTCP通信
客户端 #include <boost/asio.hpp> #include <iostream> #include <stdlib.h> using namesp ...