window.onload = () => { var canvasObject = document.getElementById("webglview"); var webgl = canvasObject.getContext("experimental-webgl"); if (webgl == null) { alert("do not support webgl"); return; } var vsh = "attribute vec4 position;void main(){gl_Position = position;}"; var fsh = "void main(){gl_FragColor=vec4(1.,0.,0.,1.);}"; var vshader = webgl.createShader(webgl.VERTEX_SHADER); var fshader = webgl.createShader(webgl.FRAGMENT_SHADER); webgl.shaderSource(vshader, vsh); webgl.shaderSource(fshader, fsh); webgl.compileShader(vshader); webgl.compileShader(fshader); var program = webgl.createProgram(); webgl.attachShader(program, vshader); webgl.attachShader(program, fshader); webgl.bindAttribLocation(program, 0, "test"); webgl.linkProgram(program); if (!webgl.getProgramParameter(program, webgl.LINK_STATUS)) { alert(webgl.getProgramInfoLog(program)); return; } webgl.useProgram(program); var buffer = webgl.createBuffer(); webgl.bindBuffer(webgl.ARRAY_BUFFER, buffer); webgl.bufferData(webgl.ARRAY_BUFFER, new Float32Array([0, 0, 0, 1, 1, 0, 1, 0, 0]), webgl.STATIC_DRAW); webgl.enableVertexAttribArray(0); webgl.vertexAttribPointer(0, 3, webgl.FLOAT, false, 0, 0); webgl.clearColor(0, 0, 0, 1); webgl.clear(webgl.COLOR_BUFFER_BIT); webgl.drawArrays(webgl.TRIANGLE_STRIP, 0, 3); };