请选择进入手机版 | 继续访问电脑版

设为首页

收藏本站

html5作品展

官方QQ群

开启辅助访问

HTML5星空 › 首页 › HTML5教程›Canvas

Canvas

对HTML5 Canvas应用的思考: 下面对我们在实际开发中对Canvas应用的具体环境和情况作出的一个思考，在HTML5被越来越多的技术人员和公司接受后，大量的应用开始在Canvas上开发和设计，但是，我们认为并不是所有的地方都必须用Canvas才可以做出好 ...; 2013-12-16 09:54

HTML5 Canvas的一些经验: 回答两个问题在这里，我们要郑重提醒一些已经学习了Canvas的读者，在设计应用的时候做足相关的技术理论准备工作，在一些基本的问题上花费一些时间，可以避免重大缺陷，并能创造更加令人惊艳的效果。大家想一下两个问 ...; 2013-12-16 09:50

HTML5 Canvas事件感应: 在实际的开发过程中，对于Canvas来说，某一区域的鼠标事件感应是一件非常重要而常见的需求，本节会提供一个感应事件的示例代码。在下面代码中，我们对整个Canvas的click和mouseover事件进行了监听，并在此事件执行时 ...; 2013-12-16 09:38

HTML5 Canvas像素操作: 本文介绍Canvas中强大的像素操作功能。这是非常有价值的一个功能，有了这一功能，就可以直接访问Canvas底层像素数据。注意由于人们可以直接操纵像素数据，因此出现了某些人利用从Canvas直接获取并且修改数据的能力 ...; 2013-12-15 19:01

HTML5 Canvas裁剪clip(): 裁剪（即clip()）是渲染上下文中的绘制方法之一。很多人都以为这是一个清除概念，其实是错的。虽然从表现上看像清除，但是由于剪切区域由绘图路径设定，因此这是一个独立的显示区域。在Canvas动画中，裁剪区域之外的 ...; 2013-12-15 18:51

HTML5 Canvas图形叠加(合成): 本文介绍的组合其实就是两个或以上的图形绘制在一起（或“合成”）时所产生的效果。默认的情况是，最后绘制的图形覆盖先前绘制的图形。在Canvas中有12个组合类型，这些类型用属性globalCompositeOperation来设置，下 ...; 2013-12-15 18:44

HTML5 Canvas变形: 变形（即transform()）是一个不太常用的方法。在介绍此方法之前，有必要向读者介绍一下变形矩阵的概念（这里涉及图形学知识，若无兴趣可以跳过）。在数学上，矩阵是指纵横排列的二维数据表格，最早来自方程组的系数 ...; 2013-12-15 18:39

HTML5 Canvas旋转和缩放: Canvas旋转在实际开发中，往往需要从多个角度旋转一个元素，使之呈现另外一种状态。接下来我们要熟悉的就是rotate(angle)方法，angle是旋转的角度，旋转的中心是Canvas坐标系统原点。最关键的是，我们可以通过transl ...; 2013-12-15 18:33

HTML5 Canvas坐标转换: 在Canvas绘图过程中，坐标始终是从左上角的起始位置开始的。但是，在实际的开发中，常常有多个元素的坐标系统混合在一起，translate()是一个非常有用的转换元素坐标的方法。translate()方法的理解见下图：示例代码如 ...; 2013-12-15 18:29

HTML5 Canvas绘图状态之保存和恢复: 保存与恢复（即save()和restore()）这两个方法在Canvas绘图状态中是极其重要的。 save()方法。在渲染上下文中，所有的Canvas状态都存储在栈里，当使用save()方法时，当前的绘图状态将被保存在栈中。 ...; 2013-12-15 18:25

HTML5 Canvas阴影与透明: 在学习过CSS3关于阴影部分的特效后，此处就非常简单了。阴影特效主要有以下几个属性。 shadowOffsetX = float shadowOffsetY = float shadowBlur = float shadowColor = color其中s ...; 2013-12-15 17:14

HTML5 Canvas渐变特效: 渐变是在网页设计中经常出现的一种特效。在Canvas中，我们可以通过canvasGradient为线条和填充使用颜色渐变。在CSS3中也有类似的特效，这里就不详细讲解了。创建canvasGradient对象时，可以使用createLinearGradient ...; 2013-12-15 17:10

HTML5 Canvas绘制文字: 在Canvas中，文字的显示也有两种方式，一种是用fillText()，另一种是用strokeText()。顾名思义，前者是填充式文本，后者是描绘式文本。这两者的区别是：填充式文本是实心的，描绘式文本是空心的。本文希望通过简单的 ...; 2013-12-15 16:00

HTML5 Canvas绘制图片方法详解: 图片操作是Canvas极其重要的一部分功能。如果没有图片操作， Canvas就无法与大量的图片交互，无法产生绚丽的动画效果。在Canvas中，生成图片的方式有两种，一种是用drawImage()方法，它有3种参数格式；另一种是用cre ...; 2013-12-15 15:47

HTML5 Canvas绘制圆与扇形: canvas绘制圆形的过程也是画线围边的过程。与传统的Canvas不同，目前 Canvas没有fillarc()方法，因此只能采用下面这样的方式实现圆的绘制： ctx.fillStyle = "blue"; //填充色为蓝色 ctx.strokeStyle = "red ...; 2013-12-15 15:37

12 / 2 页下一页

相关分类

• Canvas
• Video
• Audio
• WebGL
• CSS3
• WebSocket
• 本地存储
• WebWorker
• Form
• 文件拖拽
• 地理定位
• HTML5移动

快讯

分享

关注微信

京ICP备14042305号

html5star team © 2012-2013 html5星空 Comsenz Inc.

GMT+8, 2020-4-8 18:55 , Processed in 0.111354 second(s), 21 queries .

返回顶部