WebGL 2 Guide - #7 Das erste Dreieck

-
Im letzten Schritt haben wir einen Einblick in Shader erhalten und gelernt, wie diese funktionieren.
In diesem Schritt werden wir uns mit Buffern auseinandersetzen und uns ein Dreieck erstellen und anzeigen.


Dazu schauen wir uns zuerst einmal Vertices und Indices genauer an:



Wie in dem Diagramm zu sehen, ist dort ein Dreieck definiert mit den Vertexpunkten 0, 1 und 2.
Wobei Vertex 0 die x- und y-Koordinaten (0, 0) hat, Vertex 1 (10, 10) und Vertex 2 (20, 0).
Diese Koordinaten werden in einem Vertex array gespeichert und dieses wiederum dem Vertex Buffer übergeben. Dasselbe mit dem Index array, hier wird die Beziehung der Vertexkoordinaten beschrieben, welche ein Dreieck ergeben: nämlich Vertex mit dem Index 0, Index 1 und Index 2 ergeben zusammen ein Dreieck. Diese Beziehung wird in einem Index array gespeichert und dem Index Buffer übergeben. Es ist in der 3D-Welt üblich, diese Beziehung gegen den Uhrzeigersinn zu definieren. Im Uhrzeigersinn würde aber auch funktionieren. Wichtig ist nur, konsistent zu bleiben. Denn dies wird bei der Vertexnormalen-Berechnung später wichtig. Da so die Innenseite bzw. Außenseite berechnet wird. Sind nun die Beziehungen inkonsistent (mal im Uhrzeigersinn, mal gegen den Uhrzeigersinn) definiert, kommt es bei der Normalenberechnung zu Fehlern: Außenseiten werden fälschlicherweise als Innenseiten berechnet und umgekehrt. Dies hat dann weitere Folgen: Texturen werden nicht dargestellt, Lichtberechnungen sind falsch etc. .
Es ist also wichtig konsistent zu bleiben, sich am besten an den Standard zu halten und die Beziehungen gegen den Uhrzeigersinn zu definieren.




Comments

Post a Comment

Popular posts from this blog

[Python] Machine Learning Intro #1 - Hello World

-
Image
The Machine Learning Intro series is going to be a series about Machine Learning and will cover the very basics of what Machine Learning actually is and how to implement it using Python. What is SciKit-Learn? SciKit-Learn is a Python module for Machine Learning. It provides simple and efficient tools for data mining, data analysis and various classification, regression and clustering algorithms. So in short - it makes our lives a lot easier dealing with Machine Learning, because we don't have to write all those algorithms by hand. And that's why we will use it here. What is Machine Learning? You can think of it as a subfield of Artificial Intelligence (AI). The algorithm learns from experience and examples - like a human does. So with Machine Learning, you can solve problems you couldn't solve with regular hard coded rules. For example, given the case, you have to write a program that takes images of apples and oranges as input and then it has to
Read more

[Python] Passwort cracker for Zip-archives

-
Image
Do you have a zip-file with a password and you can't remember it? Then let's write a little tool, that tries to recover it. Disclaimer: "Cracking passwords and getting access to files of others without their permission is criminal! This blog post is only for illustrative purposes, to get an insight of how an hacker would probably do it, so you know how to protect yourself against it. This blog post is not meant to seduce you in any way to use it for criminal purposes! So i don't take any responsibility if you use it for criminal purposes, nor do i take any responsibility for the consequences which arise from it. Also, the authors of the linked pages are responsible for their sites and their content, so i don't take any responsibility for that." So, that being said, let's begin. The dictionary attack There are several ways to crack a password, however we will discuss only one of them, the dictionary attack. How does it work? It
Read more

WebGL 2 Guide - #1 Einführung

-
Image
Hintergrund Dieser Guide ist als Referenz gedacht und soll einen Einblick in WebGL 2 geben. Ich beziehe mich hier auf WebGL 2 und ESSL 3.00 welches auf OpenGL ES basiert. WebGL 1 ist veraltet und sollte nicht mehr verwendet werden. Zudem werde ich hier den ES6 -Standard verwenden. Warum WebGL 2 Warum nicht ein Framework/Engine verwenden in der man schneller und einfacher zum Ziel kommt und sich stattdessen mit so einer Low-Level-API auseinander setzen? Sicherlich kommt man mit einem Framework oder einer Engine schneller zum Ziel, jedoch werden dort viele interne Abläufe vor dem Anwender versteckt, bei denen es von Vorteil wäre, diese zu verstehen, bzw. von ihrer Existenz überhaupt zu wissen. Voraussetzungen Um optimalen Nutzen aus diesem Guide zu ziehen, solltest du einige Dinge mitbringen: Grundlegendes Verständnis der Programmierung (Da WebGL, wäre JavaScript von Vorteil) Mathematische Kenntnisse (Vektoren und Matrizen sind elementare Bestandteile der
Read more