HTML5中Canvas元素的使用总结
  TEZNKK3IfmPf 2024年03月29日 63 0

    Canvas提供了开发者自定义绘图的接口,我们可以公国getContext()函数来获取绘图上下文进行绘制操作,这个函数中可以传入两个参数,其中第1个参数设置绘图上下文的类型,比较常用的是"2d",我们也可以使用"webgl"来使用webOpenGL实现3D绘制。本篇博客主要总结2d绘制的相关方法。

1.进行简单的图形绘制

    使用Canvas进行平面图形绘制比较简单。例如使用如下函数则可以直接绘制一个矩形区域。

    var c = document.getElementById("canvas");
var context = c.getContext("2d");
context.strokeRect(20,20,100,100);

图形效果如下:

HTML5中Canvas元素的使用总结

    var c = document.getElementById("canvas");
var context = c.getContext("2d");
context.fillRect(20,20,100,100);
【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2024年03月29日 0

暂无评论

TEZNKK3IfmPf