所以,這是試圖不使用矩陣變換旋轉三角形的結果,我的任務需要一個浮動傳遞到頂點着色器和然後在着色器內進行變換數學運算。
我使用
uPosition.x = (cos(fRotation)*uPosition.x)-(sin(fRotation)*uPosition.y);
uPosition.y = (cos(fRotation)*uPosition.y)+(sin(fRotation)*uPosition.x);
從我所隨處可見,做一個矩陣將執行相同的數學旋轉頂點,我不想用一個矩陣來執行它。下面 WebGL的代碼
全碼:
var gl;
var points;
var colours;
var fRotation;
var program;
window.onload = function init()
{
canvas = document.getElementById("gl-canvas");
gl = WebGLUtils.setupWebGL(canvas);
if (!gl) { alert("WebGL isn't available"); }
fRotation = 1;
//
// Initialize our data for the Triangle
//
// First, initialize the corners of our triangle with three points.
points = [
vec2(0, 0.6),
vec2(-0.5, -0.3),
vec2(0.5, -0.3)
];
//Next, initialize the colours for each corner in Red,Green,Blue
colours = [
vec3(1, 0,0),
vec3(0, 1,0),
vec3(0, 0,1)
];
//
// Configure WebGL
//
gl.viewport(0, 0, canvas.width, canvas.height);
gl.clearColor(0.0, 0.0, 0.0, 1.0);
// Load shaders and initialize attribute buffers
program = initShaders(gl, vBasicShaderCode,
fBasicShaderCode);
gl.useProgram(program);
// Load the positional data into the GPU
var posBufferId = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, posBufferId);
gl.bufferData(gl.ARRAY_BUFFER, flatten(points), gl.STATIC_DRAW);
// Associate out shader variables with our data buffer
var vPos = gl.getAttribLocation(program, "aPosition");
gl.vertexAttribPointer(vPos, 2, gl.FLOAT, false, 0, 0);
gl.enableVertexAttribArray(vPos);
// Load the colour data into the GPU
var colBufferId = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, colBufferId);
gl.bufferData(gl.ARRAY_BUFFER, flatten(colours), gl.STATIC_DRAW);
// Associate out shader variables with our data buffer
var vCol = gl.getAttribLocation(program, "aColour");
gl.vertexAttribPointer(vCol, 3, gl.FLOAT, false, 0, 0);
gl.enableVertexAttribArray(vCol);
render();
};
function render()
{
gl.uniform1f(gl.getUniformLocation(program, "fRotation"), fRotation);
gl.clear(gl.COLOR_BUFFER_BIT);
gl.drawArrays(gl.TRIANGLES, 0, 3); //Draw a single triangle (3 points)
fRotation += 0.1;
}
頂點着色器
var vBasicShaderCode =`
attribute vec2 aPosition;
attribute vec3 aColour;
uniform float fRotation;
varying vec3 vColour;
void
main()
{
vColour=aColour;
vec2 uPosition = vec2(0.0,0.0);
//translate
uPosition.x = aPosition.x;
uPosition.y = aPosition.y;
uPosition.x = (cos(fRotation)*uPosition.x)-(sin(fRotation)*uPosition.y);
uPosition.y = (cos(fRotation)*uPosition.y)+(sin(fRotation)*uPosition.x);
gl_Position = vec4(uPosition.x,uPosition.y,0.0,1.0);
}`;
我說,這是一個任務,這是講師的意願。另外爲什麼我只想跳過這一點,從不發現爲什麼它不工作,似乎對我來說有點無知。我想學習,我認爲這很容易做到,我沒有理由不工作。 – Chad
我道歉,我明白了。但是,你的問題到底是什麼? – Rabbid76