Skip to content

Latest commit

 

History

History
91 lines (62 loc) · 3.13 KB

File metadata and controls

91 lines (62 loc) · 3.13 KB

Κατάλογος Ασκήσεων Javascript & WebGL

Antonios Kokkinos
Student ID: 20390107

GitHub

jsExample1.html

Ένα απλό πρόγραμμα σε Javascript για tutorial.


jsExample2.html

Ένας low budget calculator σε Javascript.


webGLExercise1.html

Σύνδεση με το WebGL API για δημιουργία ενός τριγώνου σε καμβά.


webGLExercise2.html

Απεικόνιση του τριγώνου στον καμβά και διαχείριση λαθών με τη βιβλιοθήκη webgl-debug.


webGLExercise3.html

Μετακίνηση και περιστροφή του τριγώνου.
Υπάρχει διαφορά αν εφαρμόσετε πρώτα μετακίνηση και μετά περιστροφή ή αντίστροφα.


webGLExercise4.html

Culling και χρήση triangle.split για δημιουργία τετραγώνου από τρίγωνο.
Προσοχή στη σωστή σειρά κορυφών για σωστή απεικόνιση.
Δημιουργία σχήματος "T" από τρίγωνο.


webGLExercise5.html

Μια άσκηση που έγινε σε χαμένη θεωρία, με αποτέλεσμα ένα απλό screensaver.


webGLExercise6.html

3D τετράεδρο — κατασκευή 3 τετραέδρων σε διαγώνιο και περιστροφή τους.


webGLExercise7.html

Άσκηση 3.2:
Χρήση εντολών:

glMatrix.mat4.identity(finalMatrix);
gl.uniformMatrix4fv(modelUniformPointer, false, finalMatrix);
gl.drawElements(gl.TRIANGLES, metablhthIndexBuffer.itemCount, gl.UNSIGNED_SHORT, 0);

Προσοχή στα ορθογραφικά λάθη στα σχόλια.


webGLExercise8.html

Απαιτούνται 3 συναρτήσεις:

  • lookAt() για τη σωστή θέση και περιστροφή κάμερας.
  • perspective() για την προοπτική της κάμερας.
  • multiply() για πολλαπλασιασμό πινάκων (πρώτος πίνακας είναι perspectiveMatrix).

Προσοχή στο βήμα 6: Δημιουργία text box για μετακίνηση κάμερας προς τα πάνω.


webGLExercise9.html

  • Χρήση Firefox (προτεινόμενος browser).
  • Ρυθμίσεις και ονόματα εικόνων πρέπει να ταιριάζουν με τον κώδικα.
  • Εικόνες για mipmapping πρέπει να έχουν διαστάσεις δύναμης του 2.

webGLExerciseA_B.html

Κίνηση ποντικιού:

  • Συμπλήρωση βημάτων για λειτουργία και σε σταματημένη σκηνή (requestID στην stopAnimation()).
  • Εκτέλεση drawScene() για ενημέρωση.
  • Ρυθμός κύλισης με ροδέλα μπορεί να φαίνεται αργός - πειραματιστείτε αν χρειάζεται.