Login lub e-mail Hasło   

Pisanie witryny internetowej wykorzystującej kartę graficzną

Z pewnością wszystkie nowoczesne karty graficzne mogą być przeprogramowywane z poziomu procesora centralnego komputera, a więc w komputerze windowsowym przez uruchomienie aplika...
Wyświetlenia: 510 Zamieszczono 19/09/2014

Z pewnością wszystkie nowoczesne karty graficzne mogą być przeprogramowywane z poziomu procesora centralnego komputera, a więc w komputerze windowsowym przez uruchomienie aplikacji .EXE. Sztukę tę posiedli tylko twórcy silników gier komputerowych i innych zaawansowanych narzędzi graficznych. Jednak ostatnio drzwi do tych tajemnic znacząco się otworzyły za sprawą nowego standardu HTML, a ściślej jej części z grafiką 3D zwaną webGL. Pojawił się tam podobny do C język GCSL nazywany językiem shading służący do pisania programów zwanych szejderami, które działają właśnie na procesorach karty graficznej. Są to programy komputerowe, które umożliwiają tworzenie złożonych efektów wizualnych.

W webGL wyróżnia się dwa rodzaje szejderów: szejder wierzchołków i szejder fragmentów. Ten pierwszy przetwarza wierzchołki obiektów 3D uruchamiając się dla każdego. Zmienne atrybutowe pozwalają przekazać charakterystykę każdego z wierzchołków umożliwiając odpowiednie ich przetworzenie. Z szejderem fragmentów może się połączyć zmienną varying, która przekazuje atrybuty konkretnych fragmentów, które mogą być wyliczane z interpolacji wierzchołków. Szejder fragmentów może również przyjmować dane wprost ze sterującego całością programu Java Script, który w ten sposób może ustalić parametry wyświetlania obowiązujące dla całego rysunku.

Obydwa szejdery to oddzielne moduły, a każdy zbudowany jest podobnie jak program w C. Składa się bowiem z deklaracji zmiennych globalnych i definicji funkcji. Program szejdera musi zawierać dokładnie jedną deklarację funkcji main() bez parametrów i zwrotnej wartości funkcji - void. 

Fragment to piksel wyświetlany na ekranie, jednakowoż technicznie fragment to piksel razem z jego pozycją, kolorem i innymi informacjami. Szejder wierzchołków:

var VSHADER_SOURCE =

'void main() {\n' +

'  gl_Position = vec4 (0.0, 0.0, 0.0, 1.0);\n' +

'  gl_PointSize = 10.0;\n' +

'}\n';

Powyższa funkcja definiuje pozycję punktu, który ma zostać wyświetlony oraz jego rozmiar. Zmienne gl_Position i gl_PointSize są predefiniowane. Poniżej jest definicja szejdera fragmentów, który za pomocą zmiennej predefiniowanej gl_FragColor nadaje fragmentowi barwę.

var FSHADER_SOURCE =

'void main() {\n' +

'  gl_FragColor =  vec4(1.0, 0.0, 0.0, 1.0);\n' +

'}\n';

Wartość koloru jest typu vec4 składających się z czterech wartości RGBA
Czerwony punkt będzie wyświetlany po nadaniu wartości (1.0, 0.0, 0.0, 1.0) zmiennej.

To zaledwie niewielki skrawek możliwości szejderów, które nadają się do programowania wielu zaawansowanych zadań grafiki komputerowej.

Przygotowując artykuł korzystano z ksiażki  Kouichi Matsuda i  Rodger Lea "WebGL programming guide".

Podobne artykuły


111
komentarze: 32 | wyświetlenia: 61998
54
komentarze: 58 | wyświetlenia: 33212
54
komentarze: 68 | wyświetlenia: 31749
50
komentarze: 27 | wyświetlenia: 64351
49
komentarze: 18 | wyświetlenia: 65706
39
komentarze: 50 | wyświetlenia: 23867
39
komentarze: 30 | wyświetlenia: 29719
37
komentarze: 9 | wyświetlenia: 29182
36
komentarze: 37 | wyświetlenia: 24359
34
komentarze: 21 | wyświetlenia: 26740
33
komentarze: 78 | wyświetlenia: 13022
 
Autor
Artykuł

Powiązane tematy






Brak wiadomości


Dodaj swoją opinię
W trosce o jakość komentarzy wymagamy od użytkowników, aby zalogowali się przed dodaniem komentarza. Jeżeli nie posiadasz jeszcze swojego konta, zarejestruj się. To tylko chwila, a uzyskasz dostęp do dodatkowych możliwości!
 

© 2005-2018 grupa EIOBA. Wrocław, Polska