From 702f63ba570ff334179b8a5a8dba6f9f191c80a9 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sat, 22 Oct 2022 23:10:39 +0300 Subject: [WGL/HW02] Added separation lines --- .../Homework 02 - The rug/Homework.html | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/Year 2/Computer Graphics with WebGL/Homework 02 - The rug/Homework.html b/Year 2/Computer Graphics with WebGL/Homework 02 - The rug/Homework.html index e141f00..c174ff9 100644 --- a/Year 2/Computer Graphics with WebGL/Homework 02 - The rug/Homework.html +++ b/Year 2/Computer Graphics with WebGL/Homework 02 - The rug/Homework.html @@ -45,21 +45,27 @@ // от тук до края на функцията да се сложи код, // който създава и рисува m цветни вълнообразни ленти - const aspectRatio = 600 / 400; const resolution = 50; const lineAreaWidths = 2 / 11; - const maxAmplitude = lineAreaWidths / 2.1; + const separatorWidth = 0.02; + const maxAmplitude = lineAreaWidths / 2.1 - separatorWidth; const step = 2 / resolution; var prevFrequency = 0; - for (var x = -1; x < 1; x += lineAreaWidths) { + for (var x = -1; x < 1.0001; x += lineAreaWidths) { var frequency = Math.random() * 2.4 + 0.8; // [0.8, 3.2] var colR = Math.random() + 0.2; var colG = Math.random() + 0.2; var colB = Math.random() + 0.2; for (var y = 1; y > -1.0001; y -= step) { - data.push((x + maxAmplitude * Math.sin(Math.PI * (y + 1) * prevFrequency)), y, colR, colG, colB); - data.push((x + lineAreaWidths + maxAmplitude * Math.sin(Math.PI * (y + 1) * frequency)), y, colR, colG, colB); + data.push(x + maxAmplitude * Math.sin(Math.PI * (y + 1) * prevFrequency), y, colR, colG, colB); + data.push(x + lineAreaWidths - separatorWidth + maxAmplitude * Math.sin(Math.PI * (y + 1) * frequency), y, colR, colG, colB); + } + for (var y = 1; y > -1.0001; y -= step) { + data.push(x + maxAmplitude * Math.sin(Math.PI * (y + 1) * prevFrequency), y, 0, 0, 0); + } + for (var y = 1; y > -1.0001; y -= step) { + data.push(x + lineAreaWidths - separatorWidth + maxAmplitude * Math.sin(Math.PI * (y + 1) * frequency), y, 0, 0, 0); } prevFrequency = frequency; } @@ -75,7 +81,9 @@ var acc = 0; for (var i = 0; i < m; i++) { gl.drawArrays(gl.TRIANGLE_STRIP, acc, 2 * resolution + 2); - acc += 2 * resolution + 2; + gl.drawArrays(gl.LINE_STRIP, acc + 2 * resolution + 2, resolution + 1); + gl.drawArrays(gl.LINE_STRIP, acc + 3 * resolution + 3, resolution + 1); + acc += 4 * resolution + 4; } } -- cgit v1.3.1-26-gb76a