-
Html5 canvas画图教程22:获取与操作像素信息getI
getImageData的直译即获得图像数据，他的作用是从canvas中提取像素出来。所以，他是有返回值的。 语法及返回值 ctx.getImageData(x,y,width,height); 这就是他的语法。而他的返回值是一个ImageData对象： ImageData { width=10, height=10, data=Uint8Clampe...
2015-09-07 14:21 -
Html5 canvas画图教程21:画图阴影shadow
canvas也能画出阴影，也就是投影效果。 上节课我讲了在canvas中写字的方法，阴影和字体一样需要设置，但设置的方式却大相径庭。 字体的设置由一个font包办，而阴影却不能用一个shadow来垄断。 canvas的阴影有4个分开的设置项： 属性 描述 shadowOffsetX 阴影...
2015-09-07 14:20 -
Html5 canvas画图教程21:阴影shadow
canvas也能画出阴影，也就是投影效果。 上节课我讲了在canvas中写字的方法，阴影和字体一样需要设置，但设置的方式却大相径庭。 字体的设置由一个font包办，而阴影却不能用一个shadow来垄断。 canvas的阴影有4个分开的设置项： 属性 描述 shadowOffsetX 阴影...
2015-09-07 14:19 -
Html5 canvas画图教程20:在canvas里写字
文章写到现在才发现我忘了介绍在canvas上写字的方法，呃，这篇补上。 其实在canvas里写字是很简单的，他有两个原生方法，即 strokeText （描边文字）和 fillText （填充文字）一看就知道他们和strokeRect与fillRect是一伙的啦。 他们不能产生路径 。 他们的...
2015-09-07 14:19 -
Html5 canvas画图教程19:canvas动画与HTML动画效
上一篇讲动画原理的文章中，我说过要测试canvas动画的效率。说到做到！不过碰到一些让人尴尬的问题。 我由一个本来就有的html文件直接拖了两个副本出来，分别取名叫canvas版与html版，然后各自写了一个动画，但动画的外观是一样的，都是在一个800*600的区域...
2015-09-07 14:18 -
Html5 canvas画图教程18:动画原理解析
假设你的妹子，本来站在你面前一米，你叫她一声，她就过来抱住你，这个过程就是一个动画。动画的原理都是这样的，反正就是要动。 即使没接触canvas的时候，我们也用JS写过一些动画，比如常见的图片切换效果。产生动画的原因，是改变元素的形态，比如透明度，...
2015-09-07 14:16 -
Html5 canvas画图教程17:论beginPath的重要性
beginPath 这个canvas函数我很早就讲过了，他的作用很简单，就是开始一段新路径，我们先来看下面的一小段代码： 1 2 3 4 5 6 7 8 9 var ctx = document. getElementById ( cvs ) . getContext ( 2d ) ; ctx. beginPath ( ) ; ctx. moveTo ( 100.5 , 20.5 ) ;...
2015-09-07 14:16 -
Html5 canvas画图教程16:切割clip
此文讲一个之前提都没提但功能强大的方法，即clip clip的字面意思是切割，实际上他的功能也差不多这么个意思，但如果你学过flash，那我说他的功能相当于遮罩，那你估计就理解了。 clip的作用是依照前面创建的路径进行一次切割，然后所有在clip之后画的图形都...
2015-09-07 14:15 -
Html5 canvas画图教程15：画扇形
画扇形这个事儿，貌似不应该拖到现在讲，因为这明显跟前面几章画圆形，画矩形是一路的，但我拖到现在才讲是有理由的，因为画扇形需要用到我上两章讲的知识。 扇形，就是一个不完整的圆，提到圆，我们就能马上想到用arc方法来画。的确，arc可以画出扇形的弧线...
2015-09-07 14:14 -
Html5 canvas画图教程14：画面的位移translate，
首先说在前头，大家要千万注意标题，是 画面 的位移，缩放和旋转，而 不 是 画布 。画布是指canvas，但画面是指canvas的Context2d对象，他们千万不能混淆。 画面的位移缩放和旋转，即画布不变，而把画布上的那一层画给进行变化。 首先是位移：translate 大家...
2015-09-07 14:13
排行榜- html5 Canvas画图教程24：测量文字
- html5 canvas 使用示例
- personalbusinessmodelcanvas.it在
- suyanxinsheng的课程
- Android实战简易教程第六十九枪（
- Melborne さんの華麗な技巧を鑑賞
- html5 canvas简单的直线路径
- Canvas + JS 实现简易的时钟
- asp加法验证码的方法
编辑推荐
关注我们
