Conversation
| uniform sampler2D uSampler; | ||
|
|
||
| void main(void) { | ||
| vec4 textureColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t)); |
|
|
||
| void main(void) { | ||
| vec4 textureColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t)); | ||
| gl_FragColor = vec4(textureColor.rgb * vLightWeighting, textureColor.a); |
There was a problem hiding this comment.
В принципе альфа-канал не используется.
Попробуйте написать gl_FragColor.rgb = textureColor.rgb * vLightWeighting;
| vLightWeighting = vec3(1.0, 1.0, 1.0); | ||
| } else { | ||
| vec3 transformedNormal = uNMatrix * aVertexNormal; | ||
| float directionalLightWeighting = max(dot(transformedNormal, uLightingDirection), 0.0); |
There was a problem hiding this comment.
Освещение лучше считать в фрагментном шейдере из-за таких штук, early z test, линейная интерполяция выходных переменных вершинного шейдера + когда вы освещаете фрагменты, вы с нужной детализацией считаете освещение там, где оно нужно, а когда вы освещаете вершины, вы освещаете их независимо от их угловых размеров и попадания в камеру.
| gl.useProgram(shaderProgram); | ||
|
|
||
| shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram, "aVertexPosition"); | ||
| gl.enableVertexAttribArray(shaderProgram.vertexPositionAttribute); |
There was a problem hiding this comment.
Вы редактируете VAO, привязанный по умолчанию. Это, в принципе допускается, т.к. создание VAO в WebGL требует или специального расширения, или спецификации версии 2. Но этого точно не нужно делать при создании шейдера.
| gl.uniformMatrix4fv(shaderProgram.mvMatrixUniform, false, mvMatrix); | ||
|
|
||
| let normalMatrix = mat3.create(); | ||
| mat4.toInverseMat3(mvMatrix, normalMatrix); |
There was a problem hiding this comment.
Если сужение матрицы модели до матрицы 3х3 даёт ортогональную матрицу, то спец. матрица для нормалей вам не нужна. Ну и если масштабирование по осям равномерное, тоже.
| } | ||
| } | ||
|
|
||
| spaceVertexNormalBuffer = gl.createBuffer(); |
There was a problem hiding this comment.
Сделайте один interleaved буфер - уложите все атрибуты в него. Зачем использовать лишние идентификаторы буферов, если у они "живут" вместе?
В принципе, когда у вас несколько объектов и вы понимаете, что им "долго вместе существовать", имеет смысл их пихать в один буфер, чтобы в случае совпадения набора текстур (если сильно заморочиться, можно их текстуры в мегатекстуру сложить, тогда вообще будет вах) можно было сэкономить на количестве команд отрисовки (glDraw...).
| gl.uniform1i(shaderProgram.samplerUniform, 0); | ||
|
|
||
| gl.bindBuffer(gl.ARRAY_BUFFER, spaceVertexPositionBuffer); | ||
| gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, spaceVertexPositionBuffer.itemSize, gl.FLOAT, false, 0, 0); |
There was a problem hiding this comment.
Вот как раз сюда рядом и нужно enableVertexAttribArray.
Вообще, делают так: создают VAO на связку шейдер + буфер и настраивают это отдельно, вне цикла рендеринга.
К сожалению, похоже на то, что концепция separate attribute format, когда можно отдельно задать формат атрибутов и отдельно одной командой привязать буферы, ещё не прижилась в WebGL (если бы прижилась, можно было создавать VAO на связку шейдер + набор атрибутов + способ укладки атрибутов в буфере(-ах)).
| uniform mat4 uPMatrix; | ||
| uniform mat3 uNMatrix; | ||
|
|
||
| uniform vec3 uAmbientColor; |
There was a problem hiding this comment.
Похоже на то, что значения юниформ-переменных света нигде не передаются.
По умолчанию они улетают в 0, можно устанавливать дефолтные значения какие угодно.
| gl.bindTexture(gl.TEXTURE_2D, texture); | ||
| gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.image); | ||
| gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); | ||
| gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST); |
There was a problem hiding this comment.
Попробуйте LINEAR_MIPMAP_LINEAR, а то текстура мажется.
|
|
||
| uniform vec3 uAmbientColor; | ||
|
|
||
| uniform vec3 uPointLightingLocation; |
There was a problem hiding this comment.
Обычно источнику света задают только один вид интенсивности на все случаи, а вот у материала настраивают диффузный, спекулярный цвет (в модели Блинна-Фонга)
| gl.bindTexture(gl.TEXTURE_2D, texture); | ||
| gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.image); | ||
| gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); | ||
| gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST); |
2 participants
No description provided.