有关于canvas几个新知识点
对于canvas的初学者来说,以下几点应该是不知道的知识点:
1、canvas有兼容IE6/7/8的脚本文件 下载地址:https://github.com/arv/explorercanvas
2、用canvas对象获取的2d绘图上下文其实可以自己往里面扩展自己的绘图方法:如 绘制星星、画虚线等等
/**
画五角星的方法
参数:cxt canvas上下文
* x:星星的中心坐标 ,y: 星星的中心y轴坐标
*r : 星星中间尖的圆半径
*R : 星星外接圆半径
*rotation:星星逆时针旋转的角度
*lw: 线条宽度
*/
CanvasRenderingContext2D.prototype.fillStar = function( x, y , r, R,rotation,lw,color){
this.beginPath();
this.lineWidth=lw || 5;
this.fillStyle=color || '#000';
for (var i=0;i<5;i++){
this.lineTo(Math.cos((18+i*72-rotation)/180*Math.PI)*R+x , Math.sin(-(18+i*72-rotation)/180*Math.PI)*R+y);
this.lineTo(Math.cos((54+i*72-rotation)/180*Math.PI)*r+x , Math.sin(-(54+i*72-rotation)/180*Math.PI)*r+y);
}
this.closePath();
this.fill()
}
getElementById('canvas').getContext('2d').fillStar(100,100, 200,300, 0, 10, 'red') //画一个红色的边框为10的五角星
3、canvas还有很多新的api已经出台,但是浏览器支持不是很好,所以我们不常用,想知道canvas还有哪些新的api 可以去 http://www.w3.org/TR/2dcontext/ 看看
4、你想知道浏览器是否支持某个canvas的api 可以这样写
if(context.ellipse){
context.beginPath()
context.ellipse(400,400,200,300,0,0,2*Math.PI)
context.stroke()
//画一个中心在400,400,短半轴为200,长半轴为300,旋转角度为0 的一个椭圆
}else{
alert('您的浏览器不支持ellipse 的方法')
}
有关于canvas几个新知识点的更多相关文章
- 自定义控件学习之canvas和paint相关知识点学习
1,继承自view,实现ondraw方法: 初始化画笔,TextPaint paint,并设置画笔属性: paint.setFlags(Paint.ANTI_ALIAS_FLAG):画笔抗锯齿. pa ...
- 关于c#知识的学到的新知识点
开头:对这段时间学习的小知识点做一个整理.希望自己能理清思路.当然如果能帮到大家那就更好了. 1.判断写法 !True=false 思考:以前判断一直写if(布尔变量==false),今天看到这个,才 ...
- UCS-2和UTF8的四个新知识点和新的疑问
最初的unicode编码是固定长度的,16位,也就是2两个字节代表一个字符,这样一共可以表示65536个字符.显然,这样要表示各种语言中所有的字符是远远不够的.Unicode4.0规范考虑到了这种情况 ...
- C++11 新知识点
翻了下新版的C++ Primer,新的C++ 11真是变化很大,新增了很多语法特性.虽然已经很久没在写C++了,但一直对这门经典语言很感兴趣的,大致看了看前几章基础部分,总结下新特性备个忘吧.估计也很 ...
- ES6的新知识点
一.变量 原有变量: var的缺点: 1.可以重复声明 2.无法限制修改 3.没有块级作用域 新增变量: let :不能重复声明,变量-可以修改,块级作用域 const:不能重复声明,变量-不可以修改 ...
- 【干货系列之萌新知识点】python与变量和运算符
一.注释 注释一行:# 为注释符 注释多行:'或者"为注释符 二.print输出 print()函数,作用是打印一些信息语屏幕上. 例如:print("hello world!&q ...
- Mysql新知识点150928
1.select distinct(DATE_FORMAT(updatetime,'%Y-%m')) as updatetime from barcode where pid!=0 order by ...
- 8-2 canvas专题-线条样式
8-2 canvas专题-线条样式 学习要点 对第五章知识进行简单的回顾和总结 进一步讲解canvas绘图相关的知识点 第八章内容介绍 在第八章中我们将对以前的知识进行简单的回顾,着重对canvas绘 ...
- 【Canvas真好玩】从黑客帝国开始
前言 笔者之前有一段时间一直在学习Canvas相关的技术知识点,通过参考网上的一些资料文章,学着利用简单的数学和物理知识点实现了一些比较有趣的动画效果,最近刚好翻看到以前的代码,所以这次将这些代码实践 ...
随机推荐
- ssh 与 irc
ssh $ssh -l signup openshells.net(23.239.220.55) password: wanker66 申请 opensheels 的免费 ssh 帐号,注册帐号后的审 ...
- MySql 里的IFNULL、NULLIF和ISNULL用法
MySql 里的IFNULL.NULLIF和ISNULL用法 mysql中isnull,ifnull,nullif的用法如下: isnull(expr) 的用法: 如expr 为null,那么isnu ...
- maven学习(下)利用Profile构建不同环境的部署包
接上回继续,项目开发好以后,通常要在多个环境部署,象我们公司多达5种环境:本机环境(local).(开发小组内自测的)开发环境(dev).(提供给测试团队的)测试环境(test).预发布环境(pre) ...
- sharepoint关键位置
GAC:C:\Windows\assembly,也就是部署的位置: ISAPI位置,SharePoint API:C:\Program Files\Common Files\microsoft sha ...
- [Android Pro] 完美Android Cursor使用例子(Android数据库操作)
reference to : http://www.ablanxue.com/prone_10575_1.html 完美 Android Cursor使用例子(Android数据库操作),Androi ...
- linux常用命令备忘
scp使用非默认端口 scp -P port username@.....IP:/dir 要拷贝到的地方
- webServer-----Spring 集成cxf笔录
目前webserver主要有俩中方式:1,传统的webserver标准集成方式-生成WSDL的xml文档. 2, 基于restful风格的webserver java RESTful We ...
- iOS设计 - 一款APP从设计稿到切图过程概述
这篇文章站在GUI设计师的角度概述了APP从项目启动到切片输出的过程,相当于工作流程的介绍.这里写的不是一种规范,只是一种工作方法,加上技术的更新是非常快的,大家在具体工作中,一定要灵活运用. 这里我 ...
- FPGA 开发笔记 点滴
1.添加包含的文件或参数文件(define.v)的方式:如果文件在工程目录下的一个文件夹下,则可用 `include "../文件夹名/define.v", 文件和工程载同一目录 ...
- Java研发岗位面试归类B(附答案)
本文承接上文:Java研发岗位面试归类A(附答案): http://www.cnblogs.com/wp5719/p/5870243.html 答案自己网上找的,如有纰漏或错误,烦请指教. 七.数据库 ...