WebGL 简单范例 代码
首先,先讲最简单的 HTML 的部分。由于这部分除了网页本身的内容外,就只是单纯地需要额外配置一个 <canvas>,来指定 WebGL 的区域,所以其实相当地单纯。下方就是一个很简单的例子:
<body onload="RunWebGL();"> <canvas id="canvas_object" width="500" height="500"></canvas></body>这样写的话,就是会在网页里产生一个 id 是「canvas_object」、大小是 500 x 500 的画布,可以用来呈现 WebGL 的绘制结果。
另外,这个网页也会在读取完成后,就自动执行 RunWebGL() 这个 JavaScript 的函式、开始执行 WebGL 的程序;这个函式的性质接近一般 C/C++ 程序的 main(),也就是前面所提的第二部分。他的内容如下:
function RunWebGL(){
// get WebGL Context
var canvas = document.getElementById( "canvas_object" );
g_WebGLContext = canvas.getContext( "experimental-webgl" ); // setup viewport
g_WebGLContext.viewport(0, 0, canvas.width, canvas.height); // set clear color
g_WebGLContext.clearColor( 0.0, 0.0, 0.0, 1.0 ); // create shader and data
CreateShader();