Płaska wizualizacja funkcji 3D

2009-06-02 18:43

Funkcje, których dziedziną jest podzbiór R2 (czyli płaszczyzna) ciężko jest przedstawić na płaskim ekranie w sposób poglądowy, a jednocześnie pozwalający na odczytanie jakichś wartości. O ile bowiem izometryczny rzut 3D wygląda efektownie, to poza ogólnym kształtem powierzchni nie przedstawia wielkiej ilości informacji. Sprawa wygląda trochę lepiej, jeśli taką figurę możemy jeszcze obracać… co aczkolwiek może być z kolei trudne do zrealizowania np. na wydruku :]

Jednym z wyjść może być tutaj zastosowanie sposobu używanego do map wysokości w grach. Nietrudno zauważyć, że są one niczym innym jak właśnie funkcjami typu R2->R, a reprezentowane są najczęściej jako bitmapy w odcieniach szarości: jasność piksela x,y odpowiada w nich wysokości odpowiedniego punktu terenu.
Takie heightmapy wprawdzie łatwo się rysuje, ale niespecjalnie nadają się do pokazania jako ilustracja czegokolwiek – odcienie szarości są przecież z definicji szare i nieciekawe :) Dlatego bardzo spodobał mi się prosty pomysł na uczynienie tej reprezentacji znacznie ładniejszą, o którym to usłyszałem niedawno.

Idea jest prosta: po co używać samych szarości, skoro mamy do dyspozycji całą paletę kolorów?… Każdy kolor w reprezentacji RGB jest przecież tożsamy z liczbą, co widać najbardziej, jeśli weźmiemy jego typową reprezentację 32-bitową:

W niej “największym” kolorem jest kolor biały (0x00FFFFFF, czyli 224 – 1), zaś “najmniejszym” czarny (0x0), a pomiędzy nimi włącznie występuje każdy z 2563 możliwych kolorów. Jeśli teraz przeskalujemy wartości naszej funkcji do tak określonego przedziału (lub nieco mniejszego), a następnie przekonwertujemy każdą z tych 32-(a właściwie 24-)bitowych liczb na odpowiadający jej kolor RGB, to otrzymamy w ten sposób heightmapę o znacznie bogatszej palecie barw niż poprzednio.
Jeśli ponadto używamy dokładnie takiej reprezentacji liczbowej kolorów, jak powyżej (najmłodsze bity na kolor niebieskie, a najstarsze używane na czerwony), to zauważymy, że rozkład barw w wyniku jest całkiem znajomy. I tak obszary niebieskie odpowiadają wartościom najmniejszym, zielone średnim, żółte – wysokim, a czerwone – najwyższym. Łącznie przypomina mapę hipsometryczną – czyli, jakby nie patrzył, mapę wysokości właśnie :)

Do czego może przydać się takie cudo, oprócz wspomnianej już wizualizacji funkcji R2->R na płaszczyźnie? Pewnie do niewielu rzeczy :) Ja wpadłem jednak na jeszcze jedno potencjalne zastosowanie.
Ponieważ wynikowy obrazek używa tak “geograficznych” barw, może on całkiem dobrze wyglądać jako… tło minimapy pokazywanej w grze, która rozgrywa się na terenie opisanym mapą wysokości. Oczywiście rzecz wymagałaby dopracowania: przede wszystkim bardziej starannego dobrania kolorów brzegowych (niekoniecznie białego i czarnego) oraz być może kolorów pośrednich (np. kolor poziomu morza), a i pewnie zastosowania jakichś filtrów na wynikowym obrazku (np. wygładzania). Efekty mogłyby być jednak interesujące, co widać obok.

Tags: , , ,
Author: Xion, posted under Math, Programming »


7 comments for post “Płaska wizualizacja funkcji 3D”.
  1. Asmodeusz:
    June 2nd, 2009 o 23:19

    Cóż, jak dla mnie to takie kolory mają raczej sens w przypadku przeglądania/edycji mapy niż do rzeczywistego pokazywania jako minimapy – to niepraktyczne. Idealne rozwiązanie jest w dwóch grach: World in Conflict oraz Supreme Commander – jako opcja. Najlepsza “minimapa” to obraz na drugim ekranie :D

  2. BTM:
    June 3rd, 2009 o 12:54

    Jak już kolega wyżej wspomniał, to minimap się to średnio nadaje ;-)

    Podobny trick był chyba zastosowany w Mass Effect – tam mapa obszaru była w odcieniach błękitu, co pozwalało na lepszą orientację w faktycznej wysokości obiektu (na mapie grayscale nie widać subtelnych różnic, które widać dopiero na Twojej kolorowej mapie).

  3. Tomasz Smykowski:
    June 6th, 2009 o 15:42

    Mapa kolorów utrudnia umieszczanie piktogramów postaci czy jednostek na mapie. Także z jednej strony może to być efektowne, ale czy praktyczne?

  4. MFN:
    September 5th, 2009 o 18:25

    Z nieba mi spadł ten artykuł – próbuję zrobić coś dokładnie odwrotnego, ale na bardzo wiem jak. Mam taką mapę wysokości ( http://tiny.pl/hqq5k ) i chciałbym ją prze konwertować na zwykłą czarno-białą heightmap. Czy autor zna jakiś szybki i prosty sposób na przetwarzanie takich kolorowych map na zwykłe heightmap?

  5. Xion:
    September 6th, 2009 o 17:05

    W prawym dolnym rogu tej mapy masz legendę, która ma na szczęście tę zaletę, że jej skala jest liniowa. Zrób sobie z niej osobny obrazek (wystarczy tak naprawdę taki o wysokości 1 piksela); będzie on miał jakąś szerokość W.

    Teraz dla każdego piksela mapy, znajdź w tej legendzie piksel o takim samym kolorze (dla pewności uwzględnij jakiś epsilon dokładności). Będzie on miał jakąś współrzędną poziomą X (na obrazku z legendą). Na czarno-białej heightmapie odpowiadający mu piksel będzie miał wtedy kolor RGB(1-X/W, 1-X/W, 1-X/W) (przy zakresie RGB 0-1 i założeniu, że obszary ciemniejsze są wyżej).

    Oczywiście jeśli obszary najniższe i najwyższe mają mieć inne kolory niż biały i czarny, to trzeba to sobie jeszcze odpowiednio przesunąć.

  6. MFN:
    September 7th, 2009 o 0:23

    Wielkie dzięki za odpowiedź. Jeszcze nie sprawdzałem, ale man nadzieję, że się w tym jakoś połapię i przerobię tą mapkę. :)

    Pozdrawiam

  7. greg:
    September 9th, 2009 o 12:41

    Hi MFN. You can access the source data for that map – it’s a better solution than converting (16-bit instead of 8). Contact me through the site if you need help.

    Greg

Comments are disabled.
 


© 2017 Karol Kuczmarski "Xion". Layout by Urszulka. Powered by WordPress with QuickLaTeX.com.