From 76c05e1ae083ec872d69ab45b7d65afaeae322f6 Mon Sep 17 00:00:00 2001 From: Forest Belton Date: Mon, 18 Oct 2021 17:48:43 -0400 Subject: [PATCH] Try things --- lib/render/gat.ts | 107 ++++++++++++++++++++++++++++++++------------ lib/render/gat.vert | 2 +- 2 files changed, 79 insertions(+), 30 deletions(-) diff --git a/lib/render/gat.ts b/lib/render/gat.ts index e85b43d..bb76461 100644 --- a/lib/render/gat.ts +++ b/lib/render/gat.ts @@ -8,15 +8,47 @@ import fragmentSource from "./gat.frag"; /* @ts-ignore */ import vertexSource from "./gat.vert"; +const ORIGIN = vec4.fromValues(0, 0, 0, 1); const UP = vec3.fromValues(0, 1, 0); -export const renderGAT = (gl: WebGLRenderingContext, gat: GAT) => { - console.log("gat", gat); +const printMat4 = (name: string, m: mat4) => { + console.log(name); + console.log([m[0], m[1], m[2], m[3]]); + console.log([m[4], m[5], m[6], m[7]]); + console.log([m[8], m[9], m[10], m[11]]); + console.log([m[12], m[13], m[14], m[15]]); +}; - gl.viewport(0, 0, gl.canvas.width, gl.canvas.height); +// Function to download data to a file +function download(data: BlobPart, filename: string, type: string) { + var file = new Blob([data], { type: type }); + // Others + var a = document.createElement("a"), + url = URL.createObjectURL(file); + a.href = url; + a.download = filename; + document.body.appendChild(a); + a.click(); + setTimeout(function () { + document.body.removeChild(a); + window.URL.revokeObjectURL(url); + }, 0); +} + +const exportObj = (vertices: number[]): string => { + let obj = ""; + for (let i = 0; i < vertices.length / 3; ++i) { + obj += `v ${vertices[i]} ${vertices[i + 1]} ${vertices[i + 2]}\n`; + } + for (let i = 0; i < vertices.length / (3 * 2); ++i) { + obj += `f ${i + 1} ${i + 2} ${i + 3}\n`; + obj += `f ${i + 4} ${i + 5} ${i + 6}\n`; + } + return obj; +}; - gl.clearColor(0, 0, 0, 1); - gl.clear(gl.COLOR_BUFFER_BIT); +export const renderGAT = (gl: WebGLRenderingContext, gat: GAT) => { + console.log("gat", gat); const fragmentShader = createShader(gl, ShaderType.FRAGMENT, fragmentSource); const vertexShader = createShader(gl, ShaderType.VERTEX, vertexSource); @@ -43,10 +75,16 @@ export const renderGAT = (gl: WebGLRenderingContext, gat: GAT) => { const model = mat4.create(); mat4.identity(model); - mat4.translate(model, model, vec3.fromValues(-centerX, 0, -centerZ)); + mat4.translate( + model, + model, + vec3.fromValues(-centerX, -maxAltitude - 10, -centerZ) + ); const view = mat4.create(); - mat4.lookAt(view, camera, center, UP); + mat4.identity(view); + mat4.rotateX(view, view, -Math.PI / 2); + // mat4.lookAt(view, camera, center, UP); const perspective = mat4.create(); const aspect = gl.canvas.clientWidth / gl.canvas.clientHeight; @@ -54,15 +92,20 @@ export const renderGAT = (gl: WebGLRenderingContext, gat: GAT) => { const matrix = mat4.create(); mat4.multiply(matrix, view, model); + printMat4("view * model", matrix); mat4.multiply(matrix, perspective, matrix); const matrixLoc = gl.getUniformLocation(program, "u_matrix"); gl.uniformMatrix4fv(matrixLoc, false, matrix); - console.log("model", model); - console.log("view", view); - console.log("projection", perspective); - console.log("matrix", matrix); + printMat4("model", model); + printMat4("view", view); + printMat4("projection", perspective); + printMat4("matrix", matrix); + + const origin = vec4.create(); + vec4.transformMat4(origin, ORIGIN, matrix); + console.log("origin", origin); const vertices: number[] = []; @@ -85,31 +128,37 @@ export const renderGAT = (gl: WebGLRenderingContext, gat: GAT) => { ); }); - let failCount = 0; - for (let i = 0; i < vertices.length / 3; ++i) { - const vec = vec3.fromValues(vertices[i], vertices[i + 1], vertices[i + 2]); - const result = checkPixelCoord(vec, matrix); - if (result) { - if (failCount < 10) { - console.log(vec); - console.log(result); - } - failCount++; - } - } - console.log("failCount", failCount); - console.log("totalCount", vertices.length / 3); - - const positionLoc = gl.getAttribLocation(program, "a_position"); + console.log("# vertices", vertices.length / 3); + + // download(exportObj(vertices), "heightmap.obj", "text/plain"); + + // let failCount = 0; + // for (let i = 0; i < vertices.length / 3; ++i) { + // const vec = vec3.fromValues(vertices[i], vertices[i + 1], vertices[i + 2]); + // const result = checkPixelCoord(vec, matrix); + // if (result) { + // if (failCount < 10) { + // // console.log(vec); + // // console.log(result); + // } + // failCount++; + // } + // } + // console.log("failCount", failCount); + // console.log("totalCount", vertices.length / 3); const vertexBuffer = gl.createBuffer(); gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer); gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW); - gl.enableVertexAttribArray(positionLoc); - + const positionLoc = gl.getAttribLocation(program, "a_position"); gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer); gl.vertexAttribPointer(positionLoc, 3, gl.FLOAT, false, 0, 0); + gl.enableVertexAttribArray(positionLoc); + + gl.clearColor(0, 0, 0, 1); + gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); + gl.viewport(0, 0, gl.canvas.width, gl.canvas.height); gl.drawArrays(gl.TRIANGLES, 0, vertices.length / 3); }; diff --git a/lib/render/gat.vert b/lib/render/gat.vert index 208dc9a..c517623 100644 --- a/lib/render/gat.vert +++ b/lib/render/gat.vert @@ -3,5 +3,5 @@ attribute vec3 a_position; uniform mat4 u_matrix; void main() { - gl_Position = u_matrix * vec4(a_position, 1.0); + gl_Position = vec4(a_position, 1.0); }