本篇文章给大家带来的内容是介绍html5的canvas元素有什么作用?
在HTML5中
你可以使用getElementById()方法在DOM中轻松找到
var canvas = document.getElementById("mycanvas");渲染上下文
立即学习“前端免费学习笔记(深入)”;
canvas元素有一个DOM方法,名为getContext()方法,拥有获取渲染上下文及其绘图功能。此函数采用一个参数,即context2d的类型。
以下是获取所需上下文的代码,并检查浏览器是否支持
XpShop网络商城系统是新普软件根据多年的电子商务应用实践,结合国际先进技术和国内企业的特点开发出来的一套电子商务购物平台。新普商城系统汇聚国内优秀商城系统的成功元素,傻瓜式的管理后台,人性化的创新体验,风格各异的页面模板,在给您事业带来无限动力的同时,也让您切身感受到新普“简单体验科技”的产品理念。XpShop .Net v6.6具有如下特点:1、使用A
var canvas = document.getElementById("mycanvas");
if (canvas.getContext) {
var ctx = canvas.getContext('2d');
// 此处是绘图代码
} else {
// 此处不支持canvas代码
}canvas的示例:绘制矩形
效果图:

说明:
在画布上绘制矩形有三种方法:

这里x和y指定矩形左上角的画布上的位置(相对于原点),宽度和高度是矩形的宽度和高度。
总结:以上就是本篇文的全部内容,希望能对大家的学习有所帮助。










