HTML5 Canvas 起步(2) - 路径(4)
作者:xujiwei 来源:xujiwei博客 发布时间:2009-05-12 12:06:00
4. fill, stroke, clip
fill 与 stroke 这两个方法很好理解,分别用来填充路径与绘制路径线条。
clip 方法用来给 Canvas 设置一个剪辑区域,在调用 clip 方法之后的代码只对这个设定的剪辑区域有效,不会影响其他地方,这个方法在要进行局部更新时很有用。默认情况下,剪辑区域是一个左上角在 (0, 0),宽和高分别等于 Canvas 元素的宽和高的矩形。
在画这个图时,虽然两次都是使用 fillRect(0, 0, 100, 100) 填充了一个 100x100 大小矩形,但是显示的结果却是第二次填充的只是中间的一小块,这是因为在两次填充之间使用 clip 方法设定了剪辑区域,这样第二次填充时只会影响到所设定的中间那一小部分区域。
5. clearRect, fillRect, strokeRect
这三个方法并不是路径方法,而是用来直接处理 Canvas 上的内容,相当于 Canvas 的背景,调用这三个方法也不会影响 Context 绘图的起点。
要清除 Canvas 上的所有内容时,可以直接调用 context.clearRect(0, 0, width, height) 来直接清除,而不需要使用路径方法绘制一个与 Canvas 同等大小的矩形路径再使用 fill 方法去清除。
结语
通过 Canvas 的路径方法,可以使用 Canvas 处理一些简单的矢量图形,这样在缩放时也不会失真。不过 Canvas 的路径方法也不是很强大,至少连个椭圆的路径都没有……
这篇写得有点长了,Cnavas 中路径相关的内容就写这么多,后面再讲讲 Canvas 其他的东西。
参考资料
猜你喜欢
- 在一群里有朋友发问,有时间,也就看看了,不多说了,看图了:用一般的 select .... order 排序出来,就如下图了,是
- 使用MySQL,安全问题不能不注意。以下是MySQL提示的23个注意事项:1.如果客户端和服务器端的连接需要跨越并通过不可信任的网络,那么就
- function createobj() { if (window.ActiveXObject)&n
- 以前没见过这个效果,滚动纵向滚动条看看效果就明白了这样的效果,广告商应该比较喜欢。<!DOCTYPE html PUBLIC &quo
- jQuery居然都没有JSON的decode和encode,精确类型判断也没有,囧……自己动手写吧!不过这些东西在网上都已经有很好的版本了,
- 当前记录集不支持更新。这可能是提供程序的限制,也可能是选定锁定类型的限制 问题的解决方法如下:第一:ACC
- 最近看到一个词叫css reset。什么叫做css reset呢?我理解为重置css,也就是重置默认样式。我在HTML下的默认样式中讲到,一
- google前不久推出了Google Ajax Library API,说白了就是提供几个知名js库的host,目前有:jQueryprot
- 在Internet上我们每天都会遇到数不清的表单,也看到其中大部分并没有限制用户多次提交同一个表单。缺乏这种限制有时候会产生某些预料不到的结
- 这篇分享几个在地址栏实现的Javascript有趣效果和应用。能在浏览器地址栏实现的效果太多了,字体放大、显示所有图片、显示Cookie等等
- 使用ASP处理XSLT转换XML比较简单,思路如下:创建一个XSLTemplate的对象,再创建一个XMLDOM对象,然后在家Xml文件和X
- 虽然说表单验证在客户端使用javascript来验证已经可以了,但是我们为了防止访客绕过客户端验证也为了数据安全最好还是在服务器端加上必要的
- Oracle中表的外键是保证系统参照完整性的手段,而参照完整性是指分布在两个表中的列所满足的具有主从性质的约束关系。外键涉及到两个表,其中一
- 这些天因为有数据割接的需求,于是有要写关于批量更新的程序。我们的数据库使用的是SQLSERVER2005,碰到了一些问题来分享下。首先注意S
- 直接调用系统的颜色显示在网页上本来是件很好玩滴事,但是,也有个缺点,就是可用的色太少 比如Bindows在它的启动画面一点点应用。=。= 上
- CREATE TABLE table1( [ID] [bigint] IDENTITY(1,1) NOT NULL, [Name] [nva
- 增大 SGA 已经缓冲看来对于性能的提升并不显著,加载时间只提升了 1.73%。下面我们增加 SGA 重做日志的大小: DB3: Log B
- 下面是一些有助于更有效地使用 SQL 事件探查器的提示和技巧。运行的跟踪过多如果 Microsoft? SQL Server? 实例运行得过
- 好多同志对 iframe 是如何控制的,并不是十分了解,基本上还处于一个模糊的认识状态.注意两个事项,ifr 是一个以存在的 iframe
- 内容摘要合理使用渐变留白网格布局提高字体应用明确而有效的导航设计漂亮、有用的页脚介绍优秀设计和卓越设计之间的区别是比较小的。一般人可能无法解