==========================================


Example:
  	1. To revel "fillStyle" property, type "fist" and enter TAB
  	2. To insert "clearRect()" methods, type "clre" and enter TAB
  	and so on............

  How to Use this CheatSheet:
  	ctx.method/property - TabTrigger + TAB

  Note:
  	1. The Canvas' Context is set to "ctx" and cannot be changed
  	2. There are some MISC snippets, take a look at the MISC section
  	3. If you use Canvas Snippets often, save this file for easy reference

  COLOR, STYLE and SHADOW
  	ctx.fillStyle - fist + TAB
  	ctx.strokeStyle - stat + TAB
  	ctx.shadowColor - shco + TAB
  	ctx.shadowBlur - shbl + TAB
  	ctx.shadowOffsetX - sox + TAB
  	ctx.shadowOffsetY - soy + TAB
  	ctx.createLinearGradient() - clg + TAB
  	ctx.createRadialGradient() - crg + TAB
  	ctx.createPattern() - cp + TAB
  	ctx.addColorStop() - acs + TAB

  LINE STYLE
  	ctx.lineCap - lic + TAB
  	ctx.lineJoin - lijo + TAB
  	ctx.lineWidth - liwi + TAB
  	ctx.miterLimit - mili + TAB

  RECTANGLE
  	ctx.rect() - re + TAB
  	ctx.fillRect() - fire + TAB
  	ctx.strokeRect() - stre + TAB
  	ctx.clearRect() - clre + TAB

  PATH
  	ctx.fill() - fi + TAB
  	ctx.stroke() - st + TAB
  	ctx.beginPath() - bepa + TAB
  	ctx.closePath() - clpa + TAB
  	ctx.moveTo() - mot + TAB
  	ctx.lineTo() - lit + TAB
  	ctx.quadraticCurveTo() - qua + TAB
  	ctx.bezierCurveTo() - bez + TAB
  	ctx.arc() - ar + TAB
  	ctx.arcTo() - art + TAB
  	ctx.clip() - cl + TAB
  	ctx.isPointInPath() - ipip + TAB

  TRANSFORMATION
  	ctx.scale() - sc + TAB
  	ctx.rotate() - ro + TAB
  	ctx.translate() - trsl + TAB
  	ctx.transform() - trsf + TAB
  	ctx.setTransform() - strsf + TAB

  TEXT/FONT
  	ctx.font - fo + TAB
  	ctx.textAlign - teal + TAB
  	ctx.textBaseline - teba + TAB
  	ctx.fillText() - fite + TAB
  	ctx.strokeText() - stte + TAB
  	ctx.measureText() - mete + TAB

  IMAGE DRAWING
  	ctx.drawImage() - dr + TAB

  PIXAL MANIPULATION
  	ctx.createImageData() - cid + TAB
  	ctx.getImageData() - gid + TAB
  	ctx.putImageData() - pid + TAB

  COMPOSITING
  	ctx.globalAlpha - glal + TAB
  	ctx.globalCompositeOperation - glco + TAB

  OTHER
  	ctx.save() - sa + TAB
  	ctx.restore() - res + TAB
  	ctx.createEvent() - crev + TAB
  	ctx.getContext() - gco + TAB
  	ctx.toDataURL() - tdu + TAB

  MICS
  	Height - he + TAB
  	Width - wi + TAB
  	Data - da + TAB
  	HTML BoilerPlate with a Canvas Tag - htmlcan + TAB
  	Canvas Tag with useful Attributes - cat + TAB
  	Initialize Canvas and Context - initcan + TAB
  	Center all Canvas Tags - centcan + Tab

  MATH
  	Math.PI - pi + TAB
  	Math.random() - rnd + TAB
  	Math.min() - min + TAB
  	Math.max() - max + TAB
  	Math.round() - round + TAB
  	Math.ceil() - cil + TAB
  	Math.floor() - flr + TAB

我的文档吗?想要的话可以全部给你.去找出来吧,这里所有的一切都在那里! 

Canvas Snippets的更多相关文章

  1. [OpenCV] Install OpenCV 3.4 with DNN

    目标定位 一.开始全面支持 Tensorflow OpenCV3.4 新功能 当前最新进展OpenCV 3.4 dev:https://github.com/opencv/opencv/tree/ma ...

  2. canvas简介

    一.canvas简介 1.1 什么是canvas?(了解) 是HTML5提供的一种新标签 <canvas></canvas> 英 ['kænvəs] 美 ['kænvəs] 帆 ...

  3. Canvas入门到高级详解(上)

    神奇的 canvas--AICODER 全栈培训 IT 培训专家 一.canvas 简介 1.1 什么是 canvas?(了解) 是 HTML5 提供的一种新标签 <canvas>< ...

  4. 第157天:canvas基础知识详解

    目录 一.canvas简介 1.1 什么是canvas?(了解) 1.2 canvas主要应用的领域(了解) 二.canvas绘图基础 2.0 sublime配置canvas插件(推荐) 2.1 Ca ...

  5. Dom vs Canvas (译)

    原文:dom_vs_canvas 在web上做动画我们有很多选择:svg,dom,canvas,flash等等.但是根据业务场景我们一定能找到最优的技术解决方案,但是何时选择dom,何时使用canva ...

  6. html5 canvas常用api总结(三)--图像变换API

    canvas的图像变换api,可以帮助我们更加方便的绘画出一些酷炫的效果,也可以用来制作动画.接下来将总结一下canvas的变换方法,文末有一个例子来更加深刻的了解和利用这几个api. 1.画布旋转a ...

  7. 【探索】利用 canvas 实现数据压缩

    前言 HTTP 支持 GZip 压缩,可节省不少传输资源.但遗憾的是,只有下载才有,上传并不支持.如果上传也能压缩,那就完美了.特别适合大量文本提交的场合,比如博客园,就是很好的例子. 虽然标准不支持 ...

  8. 简单入门canvas - 通过刮奖效果来学习

    一 .前言 一直在做PC端的前端开发,从互联网到行业软件.最近发现移动端已经成为前端必备技能了,真是不能停止学习.HTML5新增的一些东西,canvas是用的比较多也比较复杂的一个,简单的入门了一下, ...

  9. 获取Canvas当前坐标系矩阵

    前言 在我的另一篇博文 Canvas坐标系转换 中,我们知道了所有的平移缩放旋转操作都会影响到画布坐标系.那在我们对画布进行了一系列操作之后,怎么再知道当前矩阵数据状态呢. 具体代码 首先请看下面的一 ...

随机推荐

  1. js隐藏元素、jquery隐藏、css隐藏

    $("#yh").css("display","none");//隐藏元素 $("#yh").css("dis ...

  2. Python协程与asyncio

    asyncio(解决异步io编程的一整套解决方案,它主要用于异步网络操作.并发和协程)协程(Coroutine一种用户态的轻量级微线程,它是程序级别的,在执行过程中可以中断去执行其它的子程序,别的子程 ...

  3. redis初步入门(1)

    一.redis是一款高性能NOSQL系列的非关系型的数据库,其是用C语言开发的一个开源高性能键值对(key-value)数据库. 二.redis的应用场景 1.缓存(数据查询.短连接.新闻内容.商品内 ...

  4. python一些语法糖用法

    @修饰符 '@'符号用作函数修饰符是python2.4新增加的功能,修饰符必须出现在函数定义前一行,不允许和函数定义在同一行.也就是说@A def f(): 是非法的. 只可以在模块或类定义层内对函数 ...

  5. 05-BootStrap

    今日任务 使用JQuery发送请求局部刷新页面 使用BootStrap制作一个响应式的页面 使用BootStrap制作网站的首页 教学目标 掌握什么是响应式及响应式的原理 掌握BootStrap的栅格 ...

  6. idea 自定义注释模板

    一.类注释模板 打开Preferences Editor -> File and Code Templates -> Files -> Class 效果图: 注释模板 /** * @ ...

  7. 一个bat病毒分析(part1)

    之前没学过bat,这里借分析顺便学一波,分析过程可能有点啰嗦 这里的@echo off关闭回显,病毒一般都是隐秘的执行的,然后setlocal enabledelayedexpansion是设置本地变 ...

  8. 九、JSP入门(2)

    day12 JSP指令 1 JSP指令概述 JSP指令的格式:<%@指令名 attr1=”” attr2=”” %>,一般都会把JSP指令放到JSP文件的最上方,但这不是必须的. JSP中 ...

  9. 正则序RegExp

    正则的理解 1.正则的懒惰性    每次在exec()中捕获的时候,只捕获第一次匹配的内容,而不往下不捕获了.我们把这叫正则的懒惰性,每一次捕获的开始位置都是从0开始 解决正则的懒惰性 修饰符g 正则 ...

  10. Python练手例子(5)

    25.求1+2!+3!+...+20!的和. 程序分析:此程序只是把累加变成了累乘. #python3.7 n = 0 s = 0 t = 1 for n in range(1, 21): t *= ...