HTML5 Canvas 起步(3) - 颜色与渐变
作者:xujiwei 来源:xujiwei博客 发布时间:2009-06-08 12:58:00
标签:html5,canvas,颜色,渐变
上一篇介绍了 HTML5 中 Canvas 的路径,这篇将要介绍一下 Canvas 中的颜色及渐变。
Canvas 中的基本颜色系统
在 Canvas 中,颜色主要用途就是在绘制路径时,用来指定填充颜色和边框颜色。
Canvas 中的颜色参数值有两种格式:
1. 如果透明度为 1.0,也就是不透明,颜色值的格式就与一般使用一样,为:#AABBCC,其中 AA、BB、CC 分别为 Red、Green、Blue 分量。
2. 如果透明度不为 1.0,也就是带透明,颜色值格式可以使用 rgba(r, g, b, a),其中 r、g、b、a 分别为 Red、Green、Blue 分量和透明度。透明度的值为 0 至 1.0 之间的一个数值。
3. 颜色值还可以为已知的颜色名称,例如 red、blue、green 等。
总的说来,Canvas 中颜色值的格式与 CSS 中一致,因此颜色值没有特别需要注意的地方。
[提示:你可先修改部分代码,再按运行]
注意,以上代码需要使用 Firefox 3.5 来查看,在 Firefox 3.0.x 中,Canvas 的 Context 对象不支持 fillText 方法,而我安装的 Chrome 2.0.174.0 对 translate 方法的实现有误。
0
投稿
猜你喜欢
- 在MySQL的管理过程中,会遇到PC Server脱机或者重启,我需要在主机启动后再将MySQL服务启动。如果上百台或者更多的MySQL主机
- 我想大多写web的朋友应该和我一样,正则是不可少的,可是每次到用时去百度一下,也麻烦,存在电脑里也得找半天~换了电脑还是得靠google了~
- 这是一个非常简单的解决方案,柱状图中每一条柱都是一个 div,数据的大小呈现在 div 的宽或高上。 查看演示 例子下载实现的原理
- 代码如下:Dim strName, iLoop For Each strName 
- 看下面的一组例子:alert(true.toString());alert(false.toString());alert(1.123.to
- 我刚进入5gsns的时候,我真不知道怎么玩,我是通过白鸦的博客过去的,之前也没有怎么去玩过这类的网站。对于sns网站还算是陌生,不过还好网站
- 由于ajax在跨域的访问上有问题,目前最好的方法是做代理.写了个代理程序和心得为了做ajax的代理,研究了下服务器端的xmlhttp并和客户
- icech: 在制作网页的时候,常常要遇到制作虚线表格的问题,下面的文章就能解决这个问题。方法一:作一个1X2的图。半黑半白,再利用表格作成
- 好多同志对 iframe 是如何控制的,并不是十分了解,基本上还处于一个模糊的认识状态.注意两个事项,ifr 是一个以存在的 iframe
- 解决Microsoft VBScript 运行时错误 (0x800A0046) 没有权限的解决方案,0x800a0046错误。前段时间在做站
- 原理:第一步:应用程序把查询SQL语句发给服务器端执行。我们在数据层执行SQL语句时,应用程序会连接到相应的数据库服务器,把SQL语句发送给
- SQL Server数据库查询速度慢的原因有很多,常见的有以下几种:1、没有索引或者没有用到索引(这是查询慢最常见的问题,是程序设计的缺陷)
- 在计算机普及的现代设计领域,文字的设计的工作很大一部分由计算机代替人脑完成了(很多平面设计软件中都有制作艺术汉字的引导,以及提供了数十上百种
- 代码如下: 代码如下:<% '用ASP获取远程目标网页指定内容On Error Resume Next Server.Scri
- 精妙的"SQL"语句:◆复制表(只复制结构,源表名:a 新表名:b)SQL: select * into b from
- 作为一个网页设计师,不知道各位是否有这样的经历:客户给你的网站材料很多都是Word文档,虽然阅读起来很
- 同事在准备新老系统的切换,清空一个表的时候往往发现这个表的主键被另一个表用做外键,而系统里有太多层次的引用.所以清起来相当麻烦用下面这个脚本
- 这是网站制作很流行的下拉列表两级连动的代码,也是很多人使用的代码。下面,先来看这段代码:<%dim countset&nbs
- 图片的间隙 (1)问:我有一张大图片,把它切割后在Dreamweaver中进行拼接,可是总是有间隙,不知为什么? 答:不知你是否把表格的边距
- 水平线对于制作网页的朋友来说一定不会陌生,它在网页的版式设计中是非常有作用的,可以用来分隔文本和对象。