Grafika trójwymiarowa. Grafika trójwymiarowa. Pojęcie kamery. Źródła światła - przykłady. Rzutowanie trójwymiarowych obiektów. Grafika trójwymiarowa

Transkrypt

1 Z. Postawa, "Podstawy Informatyki II" Strona: 1 z 13 Grafika trójwymiarowa Komputer śledzi promienie wychodzące z oka Grafika 3D Darmowe programy do grafiki 3D: gopenmol PovRay vmd Oszczędność czasowa liczony jest bieg istotnych promieni Grafika trójwymiarowa Pojęcie kamery Rzutowanie trójwymiarowych obiektów Trójwymiarowy obiekt jest rzutowany na dwuwymiarową płaszczyznę Źródła światła - przykłady Punktowe (point light) Kierunkowe (parallel light) Położenie Linia centralna Kąt promienia Kąt zaniku Stożkowe (spot light) Obiekt 3D Obraz 2D Grafika trójwymiarowa Promienie po wyjściu ze źródła światła i po odbiciu i załamaniu od obiektów trafiają do oka 2D + perspektywa = 3D Większość z tych promieni nie trafia do oka Rzut prostokątny (ortograficzny) Rzut perspektywiczny

2 Z. Postawa, "Podstawy Informatyki II" Strona: 2 z 13 Perspektywa Tworzenie mapy wielokątów Etap 1 Rzut prostokątny (ortograficzny) Rzut perspektywiczny Szybsze operacje Usuwanie niewidocznych krawędzi Własności powierzchni Odbicie lustrzane i dyfuzyjne Powierzchnia lustrzana Powierzchnia chropowata Szkielet sześcianu Sześcian po usunięciu niewidocznych krawędzi Jeżeli obiekt jest nieprzeźroczysty i jest bryłą zamkniętą, to można wyznaczy w nim ścianki, które będą odwrócone do obserwatora (kamery) tyłem i usunąć je, ponieważ i tak będą niewidoczne Odbicie dyfuzyjne Prawo Lamberta Odbicie lustrzane Etapy wykonywania grafiki 3D Brak rozproszenia - ambient Modelowanie: kształty Cieniowanie: odbicie i oświetlenie Transformacje: pole widzenia Usunięcie niewidocznych krawędzi Etapy wykonywania grafiki 3D cd. Rozproszenie dyfuzyjne Rasteryzacja Mapowanie tekstury Kompozycja obrazu Wyświetlenie To wcale nie jest łatwe

3 Z. Postawa, "Podstawy Informatyki II" Strona: 3 z 13 Rozproszenie dyfuzyjne + odbicie (specular) Lepsze podejście do wprowadzenia cienia Wyrzutuj obiekt na podłoże Rasteryzacja cieniowanie - rendering Rasteryzacja zajmuje się tworzeniem map bitowych, gdy w układzie zdefiniowano już mapę wielokątów, oświetlenie i rodzaj występujących materiałów. Bez cieni trudno nam jest ocenić względne odległości do obiektów, ich rozmiar czy wysokość nad podłożem Rodzaje rasteryzacji: Płaska - Flat Goraud Phong Śledzenie promienia Algorytm: Rasteryzacja Ale liczenie cieni jest bardzo czasochłonne. Płaski - Goraud - Phonga - zakłada, że oświetlenie jest takie samo na całej powierzchni wieloboku każdemu z wierzchołków trójkąta przypisujemy średnią kolorów innych wierzchołków trójkątów, które go otaczają. Interpolujemy jasność wewnątrz dla każdego piksela interpolujemy wektor normalny. Liczymy oświetlenie uwzględniając kąty padania światła i kąt obserwacji w danym punkcie Cienie obiektów Algorytm: Rasteryzacja Śledzenia - promienia Oświetlenie jest podzielone na pojedyncze promienie. Każdy z nich zachowuje się w inny sposób w zależności od powierzchni, na którą pada. Algorytm uwzględnia prawa fizyki (obicia, załamania, rozproszenia, itd.) Nawet wstawienie bardzo przybliżonego cienia może być pomocne Wojciech Muła, Wikipedia

4 Z. Postawa, "Podstawy Informatyki II" Strona: 4 z 13 Rasteryzacja Flat Goraud Śledzenie promieni Gotowe biblioteki graficzne GKS - Graphical Kernel System r DirectX Microsoft Windows OpenGL Open Graphic Library wywołań Mesa open source OpenGL XWindow Unix, Linux Najlepszy jest algorytm śledzenia promieni, ale wymaga on dużej mocy obliczeniowej komputera Tekstura - w pogoni za realizmem Użyteczne programy graficzne Tworzenie plakatu CorelDraw PowerPoint Wizualizacja trójwymiarowa PovRay VMD Wprowadzenie tekstury Koncepcja jest prosta. Każdemu trójkątowi na modelu należy przyporządkować dwuwymiarową mapę bitową tekstury Jak zrobić plakat? Program CorelDraw Tworzenie obrazu Model Model+cieniowanie Tytuł Co powinien zawierać plakat? Listę autorów z adresami W którym momencie rysunek wygląda realistycznie? Model+cieniowanie + tekstura Streszczenie Rysunki i wykresy z krótkim komentarzem tekstowym Podsumowanie Podziękowania

5 Z. Postawa, "Podstawy Informatyki II" Strona: 5 z 13 Co powinien zawierać plakat? Ustawienie rozmiaru plakatu Wielkość liter? Plakat powinien być czytelny z odległości ok. 1.5 m Tytuł Czcionka >= 48 Listę autorów z adresami Czcionka >= 32 Streszczenie Czcionka >= 32 Podsumowanie - czcionka >= 32 Podziękowania czcionka >= 32 Ustawienie niewidocznego koloru PowerPoint Rozmieszczenie materiału Tytuł Ustawienie niewidocznego koloru Lista autorów Institute of Physics, Jagiellonian University, Kraków, Poland Streszczenie Kierunek przekazu informacji Wnioski Podziękowania Rozmieszczenie materiału Tytuł Lista autorów Institute of Physics, Jagiellonian University, Kraków, Poland Ustawienie niewidocznego koloru Bitmaps -> Bitmap Color Mask CorelDraw Streszczenie Kierunek przekazu informacji Wnioski Podziękowania

6 Z. Postawa, "Podstawy Informatyki II" Strona: 6 z 13 Drukowanie plakatu Rady praktyczne Plakat dostarczamy na nośniku w wersji wymaganej przez drukującego np. CorelDraw v.9.0 lub pdf Obrazki najlepiej w TIFF (min 300 dpi) Tekst pisany przy użyciu czcionek podstawowych lub czcionek zamienionych na linie Programy do wizualizacji 3D Język VRML Format tekstowy. Opis sceny 3D jest przesyłany z serwera do komputera klienta. Przeglądarka VRML zainstalowana na komputerze klienta dokonuje wizualizacja i eksploracja wirtualnego świata. plik VRML VRML Browser Parser Dane użytkownika Graf sceny Hierarchi a Trasy System wykonawczy Audiowizualna prezentacja Użytkownik Zapis na dysk Programy do wizualizacji 3D gopenmol Darmowy program do rysowania obiektów 3D i robienia animacji H H H C H H C H Jak wydrukować duży plakat na małej drukarce? Programy do wizualizacji 3D GopenMol - Aspiryna Struktura Orbitale molekularne Jak wydrukować duży plakat na małej drukarce? Granice kartek Praca z programem Wizualizacja struktury chemicznej Zaimportować zbiór z położeniami atomów Ustawić położenie kamery Ustawić kolory atomów Ustawić własności materiału Ustawić własności źródła światła Ustawić niewidoczne atomy Ustawić rozmiary atomów Zapisać obraz

7 Z. Postawa, "Podstawy Informatyki II" Strona: 7 z 13 Praca z programem Wizualizacja struktury chemicznej Zaimportować zbiór z położeniami atomów Ustawić położenie kamery Ustawić kolory atomów Ustawić własności materiału Ustawić własności źródła światła Ustawić niewidoczne atomy Ustawić rozmiary atomów Zapisać obraz Kolor tła Ustawienie położenia kamery - myszą Lewy przycisk obrót Lewy przycisk + SHIFT przesunięcie Prawy przycisk - powiększenie Ręcznie Edit -> Rotate/Translate Praca z programem Importowanie zbioru Ustawienie koloru atomów View -> Atom colour GopenMol formaty wejściowe Ustawienie koloru atomów Liczba atomów Komentarz Nazwa, X,Y,Z,parametr atomu Molekuła aspiryny C H GopenMol formaty wejściowe Zbiór wejściowy xmol: 12 Benzen H H H H H H C C C C C C Ustawienie koloru tła View -> Background colour-> Colour

8 Z. Postawa, "Podstawy Informatyki II" Strona: 8 z 13 Ustawienie koloru tła Ustawienie trójwymiarowego wyświetlania atomów Trójwymiarowe obrazowanie atomów znacznie spowolni rysowanie Ustaw wygląd sceny, kolory atomów, tła, rodzaj oświetlenia i właściwości materiału zanim uaktywnisz trójwymiarowe wyświetlanie atomów!!! Ustawienie własności materiału Typy wyświetlania - Stick Edit -> Material properties Określa jak intensywnie materiał będzie odbijał kierunkowo poszczególne kolory Określa stopień poblasku Brak wyświetlania wiązań Wyświetlanie wiązań Ustawienie światła Edit -> Light properties Kolor i jasność Typy wyświetlania - CPK Przy wyświetlaniu CPK brane są pod uwagę zakodowane w programie rozmiary atomów Położenie Możemy mieć tylko 1 światło CPK scale = 0.35 Rozmiar ostateczny = rozmiar ustawiony * rozmiar zakodowany Ustawienie trójwymiarowego wyświetlania atomów Typ wyświetlania Edit -> Atom type Nazwa atomu Typy wyświetlania - Licorice Przy wyświetlaniu Licorice rozmiar atomów równa się rozmiarowi ustawionemu Przy ustawieniu Licorice można zmienić ustawienie grubości wiązania Włączyć (On) czy wyłączyć (Off) operacje? Rozmiar Cyl. Rad =0.1 Sph. Rad = 0.3

9 Z. Postawa, "Podstawy Informatyki II" Strona: 9 z 13 Ustawienie trójwymiarowego wyświetlania atomów Wyświetlanie wiązań Aby usunąć wiązania 1) Ustaw Atom search window: 0 2) Naciśnij Apply przy okienku z 0 3) Nacisnij Apply okna lub Reset connectivity Cyl. Rad =0 Sph. Rad = 0 Cyl. Rad =0.1 Sph. Rad = 0.3 Ustawienie trójwymiarowego wyświetlania atomów Uwaga Wyświetlacze Stick, CPK i Licorise działają niezależnie, tzn. wynik ostateczny jest sumą działania każdego z nich. Usuwanie niepotrzebnych atomów View -> Atom mask Nazwa atomu CPK scale = 0.35 Cyl. Rad =0.1 Sph. Rad = 0.3 Pamiętaj, aby wyłączyć zbędne wyświetlacze Widoczny On lub niewidoczny - Off Wyświetlanie wiązań Calculate -> Connectivity C On H - Off Maskowanie niepotrzebnych atomów Nazwa atomu Zasięg poszukiwań Program ma zakodowane rzeczywiste długości wiązań dużej liczby związków Wyświetlanie wiązań Wyświetlenie nazw atomów View -> Atom labels Włączenie usługi Ustaw na ON Naciśnij Apply

10 Z. Postawa, "Podstawy Informatyki II" Strona: 10 z 13 Wyświetlenie nazw atomów PovRay POVRAY = Persistence of Vision Ray-Tracer Darmowy program do tworzenia wysokiej jakości grafiki trójwymiarowej Wykorzystuje metodę śledzenia promienia Dostępny na platformach: PC, Macintosh i Unix Resetowanie okna wyświetlacza File -> Reset -> View PovRay Scena zawiera informacje o wszystkich obiektach Stosować, gdy się pogubimy i nie wiemy, gdzie właściwie jesteśmy w stosunku do oglądanego obiektu Autor: Jaime Vives Piqueres Obiekty mogą być standardowe: np. kula, sześcian, walec, stożek lub stworzone przez ciebie Każdy obiekt ma swój atrybut: kolor, sposób odbicia światła, teksturę, itd. Zapis obrazu na dysk File -> Hardcopy Robienie animacji Trajectory PovRay - przykłady Następny wykład

11 Z. Postawa, "Podstawy Informatyki II" Strona: 11 z 13 PovRay - przykłady Wektory koloru Wektor <R, G, B >, <R, G, B, F> lub <R, G, B, T> R czerwony G zielony B niebieski Parametr filtracji Parametr transmisji Zmieniają się od 0. do 1. <1., 1., 1.> - biały <0., 0., 0.> - czarny PovRay - przykłady Własności kodu źródłowego Jest czuły na wielkość liter Ignoruje spacje Kolejność poleceń jest dowolna Polecenia kończą się nawiasami { Komentarze oznacza się przez // lub parę /* zzz */ // komentarz /* trzy wektory */ Istnieje mechanizm dołączania zbiorów zewnętrznych #include nazwa zbioru PovRay - przykłady Położenie kamery Taki zapis oznacza, że kamera znajduje się w punkcie <0,0,0> i jest skierowana na punkt <0,0, 5> Najprostszy zapis camera { location <0,0,0> look_at <0,0,5> I nagroda w konkursie wizualizacji naukowej organizowanym przez Stanowy Uniwersytet Pensylwanii 2009 rok W danej scenie może być tylko jedna kamera Wektory w programie PovRay Wektorem jest dowolny zespół kilku liczb, np. wektor koloru Wektory oznaczone są nawiasami < > np. <1, 0,0 > Położenie źródeł światła Może być wiele źródeł światła różnego typu. Np: Źródła punktowe: Kierunkowe: light_source { <10,10,-10> color rgb <1,1,1> Położenie źródła Świecący punkt Kolor light_source { <10,10,-10> at <0,0,0> color rgb <1,1,1>

12 Obiekty Obiekty są podstawowymi elementami tworzącymi sceny. Przykłady obiektów: płaszczyzna, kula, prostopadłościan, stożek, torus, walec, pryzmat, blob, tekst, ich połączenia (union), obszary wspólne (merge), przecięcia (intersection) oraz różnice (difference). Składnia struktury obiekt: Object { nazwa { <położenie>, rozmiar, atrybuty Kolor i tekstura Oprócz podania samego koloru możemy również określić teksturę materiału, z którego wykonany jest dany obiekt Dostępne tekstury są zdefiniowane w zbiorze textures.inc #include "textures.inc" sphere {<2, 0, 0> 1.8 texture {PinkAlabaster sphere {<-2, 0, 0> 1.8 pigment {color rgb <1, 0, 0> Kula Jest określana przez podanie: położenia środka kuli, promienia kuli, oraz atrybutów (kolor, rodzaj materiału, parametry odbicia, przenikania, itd. Zielona kula o w punkcie <-1,0,0> i promieniu 1 sphere {<-1,0,0>, 0.5 //położenie, promień pigment {color rgb <0,1.,0> // kolor Wykończenie - Finish Określa czy obiekt jest świecący, matowy, odbijający, itd. Określamy trzy parametry ambient, diffuse, specular Predefiniowane wartości finish są umieszczone w zbiorze colors.inc #include colors.inc" sphere {<2, 0, 0> 1.8 finish { ambient.2 Bez diffuse.5 specular.25 Z finish Walec Jest określana przez podanie współrzędnych początku - p, końca - k, promienia r i parametru stanu (opcjonalnie) otwarty, oraz atrybutów. Deklaracje Używane do deklarowania stałych i zmiennych #declare promien = 1.5 r k p sphere {<0, 1.5, 1> promien pigment {color rgb <1, 0, 0> Na zadeklarowanych zmiennych można wykonywać operacje matematyczne #declare promien = promien + 1. Cylinder camera { location <3, 3, 3> look_at <0, 0, 0> light_source {<10, 10, 10> color <1,1,1> light_source {<-10, 10, -10> color <1,1,1> cylinder {<0,-1,0>, <0,1,0>, 1 //open //usuń komentarz, //aby narysować rurę pigment {color rgb <1,1,1> open Transformacje Używane do przemieszczania obiektów Rodzaje transformacji: -translacje-translate -obroty-rotate - skalowania - scale sphere {<0, 1.5, 1> 1 pigment {color rgb <1, 0, 0> translate <1,5,1> rotate <30,20,0> scale <1.,0.5,1> Z kuli zrobiła się elipsa Z. Postawa, "Podstawy Informatyki II" Strona: 12 z 13

13 Z. Postawa, "Podstawy Informatyki II" Strona: 13 z 13 Geometria obiektowa Używane do tworzenia nowych obiektów z istniejących obiektów Rodzaje działań: - unia union -połączenie - merge -przecięcie intersection -różnica - difference Zapis np. #declare nowyobiekt = union { objekt1, object{obiekt2 Różnica - difference Nowy obiekt składa się z różnicy obiektów składowych #declare dwiekule= difference { sphere {<-1, 0, 0> 2 pigment {color rgb <1, 0, 0> sphere {<1.5, 0, 0> 2 pigment {color rgb <0, 1, 0> dwiekule Kula 1 bez części wyciętej przez kulę 2 Unia - union Nowy obiekt składa się z obiektów składowych #declare dwiekule= merge { sphere {<-1, 0, 0> 2 pigment {color rgbt <1, 0, 0,0.4> sphere {<1.5, 0, 0> 2 pigment {color rgbt <0, 1, 0,0.4> Co za tydzień? Animacje komputerowe object{dwiekule wywołanie w programie Dalej mamy dwie kule Połączenie - Merge Nowy obiekt składa się z obwiedni obiektów składowych #declare dwiekule= merge { sphere {<-1, 0, 0> 2 pigment {color rgb <1, 0, 0> sphere {<1.5, 0, 0> 2 pigment {color rgb <0, 1, 0> dwiekule Teraz w nowym obiekcie nie mamy części kul leżących wewnątrz Przecięcie - intersection Nowy obiekt składa się z części wspólnej obiektów składowych #declare dwiekule= intersection { sphere {<-1, 0, 0> 2 pigment {color rgb <1, 0, 0> sphere {<1.5, 0, 0> 2 pigment {color rgb <0, 1, 0> dwiekule Część wspólna kul