HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>canvas</title>
</head>
<body onload="main()">
<canvas id="webgl" width="500" height="500"
style="border:1px solid #000000;">
Please use a browser that supports "canvas"
</canvas>
<script src="../lib/webgl-utils.js"></script>
<script src="../lib/webgl-debug.js"></script>
<script src="../lib/cuon-utils.js"></script>
<script src="HelloCanvas.js"></script>
</body>
</html>
JS:
function main() {
//获取canvas元素
var canvas = document.getElementById('webgl');
//获取WevGL绘图上下文
var gl = getWebGLContext(canvas);
//判断时候获得画笔,不成功则报错
if (!gl) {
console.log('Failed to get the rendering context for WebGL');
return;
}
//指定清空颜色
gl.clearColor(0.5, 0.2, 0.3, 1.0);
//清空<canvas>
gl.clear(gl.COLOR_BUFFER_BIT);
}
'
运行
运行结果:
© 版权声明
文章版权归作者所有,未经允许请勿转载。
相关文章
暂无评论...