对越来越多游戏的着迷,很好奇,他们是怎么写出来的。
看了http://www.iteye.com/topic/1122395的文章,的确佩服作者的毅力及学习能力。
如何才算是“熟悉”?
- HTML常用标签你全都认识并能说出它们相同、和不同的特性吗?
- CSS中所有属性是否熟悉?特别是CSS3中的新特性和动画?
- 是否已经完全明白JavaScript面向对象、闭包、原型链、作用域等概念,并能熟练运用?
- 是否掌握了一系列JavaScript性能优化的方法和经验?
http://www.cnblogs.com/tim-li/archive/2012/08/06/2580252.html
context:一直觉得这个翻译成“上下文”真够蛋疼的,context是一个封装了很多绘图功能的对象,获取这个对象的方法是
var context =canvas.getContext("2d");
也许这个2d勾起了大家的无限遐想,但是很遗憾的告诉你html5还只是个少女,不提供3d服务。
style:在进行图形绘制前,要设置好绘图的样式
context.fillStyle//填充的样式
context.strokeStyle//边框样式
context.lineWidth//图形边框宽度
颜色的表示方式:
直接用颜色名称:"red" "green" "blue"
十六进制颜色值: "#EEEEFF"
rgb(1-255,1-255,1-255)
rgba(1-255,1-255,1-255,透明度)
/清除矩形 :context.clearRect(50,50,240,120)。
二:圆弧 context.arc(x, y, radius, starAngle,endAngle, anticlockwise)
straAngle:开始角度;endAngle结束角度;anticlockwise 顺时针:true,逆时针:false 无论顺时针、逆时针角度都沿着顺时针扩张。
三:路径 context.beginPath() context.closePath()
、系统默认在绘制第一个路径的开始点为beginPath
*2、如果画完前面的路径没有重新指定beginPath,那么画第其他路径的时候会将前面最近指定的beginPath后的全部路径重新绘制
3、每次调用context.fill()的时候会自动把当次绘制的路径的开始点和结束点相连,接着填充封闭的部分
ps:书本的结论是 如果没有closePath那么前面的路劲会保留,实验证明正确的结论是 如果没有重新beginPath那么前面的路劲会保留