zl程序教程

您现在的位置是:首页 >  后端

当前栏目

[WebGL] Setting Up WebGL

WebGL Up setting
2023-09-14 08:59:19 时间

In this lesson we cover setting up WebGL for use, including creating a canvas, getting the WebGL rendering context and clearing the canvas to a particular color.

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Setup</title>

</head>
<body>
    <canvas id="canvas" width="600" height="600"></canvas>
    <script src="./mian.js"></script>
</body>
</html>

 

var gl;

initGL();
draw();

function initGL(){
    var canvas = document.getElementById("canvas");
    gl = canvas.getContext("webgl");

    gl.viewport(0,0,canvas.width, canvas.height);
    gl.clearColor(1,0,0,1); //red, blue, green, alpha
}

function draw(){
    gl.clear(gl.COLOR_BUFFER_BIT); //Paint the color to the canvas
}