如何为 webgl 模型实现 gouraud 着色

如何解决如何为 webgl 模型实现 gouraud 着色

这是我用来加载茶壶模型的代码：

function loadTeapot() {
        var request = new XMLHttpRequest();
        request.open("GET","./model/Teapot.json");
        request.onreadystatechange = function () {
            if (request.readyState == 4) {
                handleLoadedTeapot(JSON.parse(request.responseText));
            }
        }
        request.send();
    }

这是我加载茶壶后使用的函数：

function handleLoadedTeapot(teapotData) {
        teapotVertexPositionBuffer = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER,teapotVertexPositionBuffer);
        gl.bufferData(gl.ARRAY_BUFFER,new Float32Array(teapotData.vertexPositions),gl.STATIC_DRAW);
        teapotVertexPositionBuffer.itemSize = 3;
        teapotVertexPositionBuffer.numItems = teapotData.vertexPositions.length / 3;

        teapotVertexnormalBuffer = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER,teapotVertexnormalBuffer);
        gl.bufferData(gl.ARRAY_BUFFER,new Float32Array(teapotData.vertexnormals),gl.STATIC_DRAW);
        teapotVertexnormalBuffer.itemSize = 3;
        teapotVertexnormalBuffer.numItems = teapotData.vertexnormals.length / 3;

        teapotVertexFrontColorBuffer = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER,teapotVertexFrontColorBuffer);
        gl.bufferData(gl.ARRAY_BUFFER,new Float32Array(teapotData.vertexFrontcolors),gl.STATIC_DRAW);
        teapotVertexFrontColorBuffer.itemSize = 3;
        teapotVertexFrontColorBuffer.numItems = teapotData.vertexFrontcolors.length / 3;
    }

这是我用来初始化着色器的函数：

function initShaders() {
        var fragmentShader = getShader(gl,"fragmentShader");
        var vertexShader   = getShader(gl,"vertexShader");

        shaderProgram = gl.createProgram();
        gl.attachShader(shaderProgram,vertexShader);
        gl.attachShader(shaderProgram,fragmentShader);
        gl.linkProgram(shaderProgram);

        if (!gl.getProgramParameter(shaderProgram,gl.LINK_STATUS)) {
            alert("Could not initialise shaders");
        }

        gl.useProgram(shaderProgram);

        shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram,"aVertexPosition");
        gl.enabLevertexAttribArray(shaderProgram.vertexPositionAttribute);
        shaderProgram.vertexFrontColorAttribute = gl.getAttribLocation(shaderProgram,"aFrontColor");
        gl.enabLevertexAttribArray(shaderProgram.vertexFrontColorAttribute);

        shaderProgram.pMatrixUniform  = gl.getUniformlocation(shaderProgram,"uPMatrix");
        shaderProgram.mvMatrixUniform = gl.getUniformlocation(shaderProgram,"uMVMatrix");
    }

我想对这个茶壶模型应用古罗着色。你能帮我吗。