Question

我正在尝试在画布上绘制方格。数组填充顶点。但页面仍然是空白的。似乎没有错误。谢谢

    var canvas;
    var gl;
    var grid = [];

    var maxNumTriangles = 200;
    var maxNumVertices = 3 * maxNumTriangles;
    var index = 0;

    window.onload = function init() {
        canvas = document.getElementById("gl-canvas");
        gl = WebGLUtils.setupWebGL(canvas);
        if (!gl) { alert("WebGL isn't available"); }
        canvas.addEventListener("mousedown", function (event) {
            gl.bindBuffer(gl.ARRAY_BUFFER, vBuffer);
            gridarray();
            document.write(grid[0]);
            gl.bufferSubData(gl.ARRAY_BUFFER, 8 * index, flatten(grid));

        });


        gl.viewport(0, 0, canvas.width, canvas.height);
        gl.clearColor(1.0, 1.0, 1.0, 1.0);

        var program = initShaders(gl, "vertex-shader", "fragment-shader");
        gl.useProgram(program);


        var vBuffer = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER, vBuffer);
        gl.bufferData(gl.ARRAY_BUFFER, 8 * maxNumVertices, gl.STATIC_DRAW);

        var vPosition = gl.getAttribLocation(program, "vPosition");
        gl.vertexAttribPointer(vPosition, 2, gl.FLOAT, false, 0, 0);
        gl.enableVertexAttribArray(vPosition);

        var cBuffer = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER, cBuffer);
        //gl.bufferData(gl.ARRAY_BUFFER, 16 * maxNumVertices, gl.STATIC_DRAW);

        render();

    }

    function gridarray() {
        p = 10;

        for (var x = 0; x <= 500; x += 40) {
            var g = new Float32Array([0.5 + x + p, p]);
            var g1 = new Float32Array([0.5 + x + p, 500 + p]);
            grid.push(g);
            grid.push(g1);
        }


        for (var x = 0; x <= 500; x += 40) {
            var g = new Float32Array([p, 0.5 + x + p]);
            var g1 = new Float32Array([500 + p, 0.5 + x + p]);
            grid.push(g);
            grid.push(g1);
        }
    }
    function render() {

        gl.clear(gl.COLOR_BUFFER_BIT);
        gl.drawArrays(gl.LINES, 0, 20);
        window.requestAnimFrame(render);

    }
Fragment and Vertex shader

属性vec4 vPosition; 空虚主要（） { gl_Position = vPosition; }

void main()
    {
    gl_FragColor = vec4( 1.0, 0.0, 0.0, 1.0 );
    }

Answer 1

你应该发布可执行代码。如果没有看到其余的代码，很难说出错了什么。

我的头脑中

flatten返回什么？

我知道没有flatten采用Float32Array和Float32Array数组并返回node，但我想你的确是吗？
看起来你正在以像素坐标传递但是 WebGL requires clip space coordinates

Webgl不绘制数组

1 个答案: