27.12.2020 19:46
[#1]
Jak generuje się grafikę dla ograniczonej palety, np chunky 256
Czesc,
Moze nie jasno napisałem w tytule.
Chodzi mi tu o gry generujące grafikę dynamicznie,
Np. Gry fps, dajmy na to wolf3d. I chodzi mi o tryb chunky
256 kolorów.
W takich grach, różne kolory pojawiaja sie na ekranie w zaleznosci
Od tego gdzie weszliśmy, jaki przeciwnik sie pojawił, no i
Jest jeszcze cieniowanie, np zaleznosci od odległości od sciany.
Tryb 256 chunky I tak korzysta z palety. Widzialem ze do wolfa
Jest jakas podstawowa paleta. I tu sie pojawia podstawowe pytanie
Jak zamienic wygenerowany kolor na taki ktory jest w palecie.
Zdaje sie ze w graphics.library jest funkcja wyszukujaca z palety
Najbardziej pasujacy kolor. Ale czy wywolanie tej funkcji dla kazdego
Pixela w buforze nie zamuli wszystkiego? Czy tak to sie robi czy inaczej?
Dzieks
Moze nie jasno napisałem w tytule.
Chodzi mi tu o gry generujące grafikę dynamicznie,
Np. Gry fps, dajmy na to wolf3d. I chodzi mi o tryb chunky
256 kolorów.
W takich grach, różne kolory pojawiaja sie na ekranie w zaleznosci
Od tego gdzie weszliśmy, jaki przeciwnik sie pojawił, no i
Jest jeszcze cieniowanie, np zaleznosci od odległości od sciany.
Tryb 256 chunky I tak korzysta z palety. Widzialem ze do wolfa
Jest jakas podstawowa paleta. I tu sie pojawia podstawowe pytanie
Jak zamienic wygenerowany kolor na taki ktory jest w palecie.
Zdaje sie ze w graphics.library jest funkcja wyszukujaca z palety
Najbardziej pasujacy kolor. Ale czy wywolanie tej funkcji dla kazdego
Pixela w buforze nie zamuli wszystkiego? Czy tak to sie robi czy inaczej?
Dzieks
27.12.2020 19:52
[wyróżniony]
[#2]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
27.12.2020 20:00
[wyróżniony]
[#3]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
27.12.2020 20:02
[wyróżniony]
[#4]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #1
Dzielisz 8 bitów, jakie masz do dyspozycji w 256-bitowej palecie, na R G i B. Przykładowo 3 bity na czerwony, 3 na zielony i 2 na niebieski. Paletę robisz w taki sposób, że dla danego numeru palety dzielisz ten numer na powyższe kawałki i potem każdy kolor rozszerzasz do 8 bitów, przesuwając w lewo. I taki kolor ustawiasz palecie. Przykładowo, kolor numer 177, to jest binarnie 10110001. Czyli 3 bity czerwone to 101, trzy zielone 100 i dwa niebieskie 01. Składową czerwoną koloru przesuwasz o 5 bitów w lewo: 10100000 = 160, zieloną też o 5 = 10000000 = 128, niebieską o 6 bitów = 01000000 = 64. Czyli kolor 177 w palecie ma składowe RGB (160, 128, 64). Robisz tak dla wszystkich 256 kolorów.
Potem jak silnik Ci generuje piksele, składową każdego piksela przesuwasz i robisz AND z maską, potem OR wszystkich trzech i masz od razu numer piksela w palecie, który bezpośrednio pchasz do pamięci graficznej.
Potem jak silnik Ci generuje piksele, składową każdego piksela przesuwasz i robisz AND z maską, potem OR wszystkich trzech i masz od razu numer piksela w palecie, który bezpośrednio pchasz do pamięci graficznej.
27.12.2020 20:16
[wyróżniony]
[#5]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
27.12.2020 20:50
[wyróżniony]
[#6]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #5
Przykład był po to, żeby wyjaśnić. Gdy silnik wygeneruje dowolny piksel, to nie trzeba szukać pasującego, wybór dokonuje się automatycznie. Kolejny przykład, silnik generuje piksel RGB (216, 37, 148). Binarnie wygląda to tak:
R 11011000 G 00100101 B 10010100Teraz zostawiamy najstarsze 3 bity z R i G, oraz dwa z B:
R 110 G 001 B 10a następnie ustawiamy składowe jedna za drugą: 110|001|10, co daje nam numer koloru 198. Jeżeli paleta będzie zbudowana w sposób opisany w poprzednim moim poście, to jest wszystko, co trzeba zrobić.
27.12.2020 21:26
[wyróżniony]
[#7]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
28.12.2020 00:31
[wyróżniony]
[#8]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@Krashan, post #6
Dodam do postu Krashana, że można sobie również podzielić paletę w bardziej równomierny sposób po wszystkich barwach.
Otóż można zakodować kolory w HSV (Hue, Saturation, Value) - Barwa, Nasycenie, Jasność.
- Hue koduje samą barwę i warto przeznaczyć na nią więcej bitów, np. 4 bity,
- Saturation to nasycenie koloru i można przeznaczyć 2 bity,
- Value to jasność i podobnie można przeznaczyć 2 bity.
Hue jest określone w kącie 0 - 360 stopni na kole barw. Kolory przechodzą płynnie. 0 to kolor czerwony, 120 to kolor zielony, a 240 to kolor niebieski. Inne, pośrednie barwy znajdują się pomiędzy tymi wartościami.
Kodowanie HSV masz na przykład w Palette lub Deluxe Paincie.
Możesz przygotować sobie tablicę barw z wartościami Hue (0 - 15). Wtedy nie musisz szukać danego koloru za każdym razem.
- Czerwony,
- Pomarańczowy,
- Żółty,
- Zielony,
- Seledynowy,
- Błękitny,
- Niebieski,
- Fioletowy,
- Różowy.
Oddzielnie szukasz nasycenia (0 - 3) oraz jasności barwy (0 - 3).
Zauważ, że odcienie szarości uzyskasz dając 0% dla nasycenia. Wtedy barwa nie gra roli. Oczywiście taką tablicę można sobie dostosować według potrzeb, żeby uniknąć powtórzeń barw.
Ostatnia aktualizacja: 28.12.2020 00:41:33 przez Hexmage960
Otóż można zakodować kolory w HSV (Hue, Saturation, Value) - Barwa, Nasycenie, Jasność.
- Hue koduje samą barwę i warto przeznaczyć na nią więcej bitów, np. 4 bity,
- Saturation to nasycenie koloru i można przeznaczyć 2 bity,
- Value to jasność i podobnie można przeznaczyć 2 bity.
Hue jest określone w kącie 0 - 360 stopni na kole barw. Kolory przechodzą płynnie. 0 to kolor czerwony, 120 to kolor zielony, a 240 to kolor niebieski. Inne, pośrednie barwy znajdują się pomiędzy tymi wartościami.
Kodowanie HSV masz na przykład w Palette lub Deluxe Paincie.
Możesz przygotować sobie tablicę barw z wartościami Hue (0 - 15). Wtedy nie musisz szukać danego koloru za każdym razem.
- Czerwony,
- Pomarańczowy,
- Żółty,
- Zielony,
- Seledynowy,
- Błękitny,
- Niebieski,
- Fioletowy,
- Różowy.
Oddzielnie szukasz nasycenia (0 - 3) oraz jasności barwy (0 - 3).
Zauważ, że odcienie szarości uzyskasz dając 0% dla nasycenia. Wtedy barwa nie gra roli. Oczywiście taką tablicę można sobie dostosować według potrzeb, żeby uniknąć powtórzeń barw.
Ostatnia aktualizacja: 28.12.2020 00:41:33 przez Hexmage960
28.12.2020 00:59
[wyróżniony]
[#9]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
28.12.2020 21:07
[#10]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@Hexmage960, post #9
Hej,
@Krashan, zrobiłem test wg Twoich wytycznych i tak, teraz rozumiem dokładnie o co chodzi -problem jest tylko taki, że paleta jest zafixowana i na poniższym przykładzie, na którym pracowałem gdzie dominuje nieco brązowo-żółtawy kolor (np. lochy) ta zafixowana paleta jest niewystarczająca. I nasuwa się pytanie czy można jakoś spersonalizować paletę np. wg używanych textur. Czy korzystać z rozwiazania które podał wczesniej @Hexamag
@Hexamag, dzięki.. to już widzę więcej zabawy, ale zakładam że można by bardziej spersonalizować czy tam dostosowac paletę. Czy jesteś w stanie podać jakis przykład tak jak to zrobił @Krashan wczesniej.. ewentulanie pod jakimi hasłami tego szukać w goglach, jeśli nie chcesz żeby Ci gitare zawracać :)
poniżej moj test, paleta w dolnym rogu to paleta utowrzona wg wytycznych @Krashana, a obok
obrazek z góry skonwertowany na ta paletę.
png out
@Krashan, zrobiłem test wg Twoich wytycznych i tak, teraz rozumiem dokładnie o co chodzi -problem jest tylko taki, że paleta jest zafixowana i na poniższym przykładzie, na którym pracowałem gdzie dominuje nieco brązowo-żółtawy kolor (np. lochy) ta zafixowana paleta jest niewystarczająca. I nasuwa się pytanie czy można jakoś spersonalizować paletę np. wg używanych textur. Czy korzystać z rozwiazania które podał wczesniej @Hexamag
@Hexamag, dzięki.. to już widzę więcej zabawy, ale zakładam że można by bardziej spersonalizować czy tam dostosowac paletę. Czy jesteś w stanie podać jakis przykład tak jak to zrobił @Krashan wczesniej.. ewentulanie pod jakimi hasłami tego szukać w goglach, jeśli nie chcesz żeby Ci gitare zawracać :)
poniżej moj test, paleta w dolnym rogu to paleta utowrzona wg wytycznych @Krashana, a obok
obrazek z góry skonwertowany na ta paletę.
png out
28.12.2020 21:32
[wyróżniony]
[#11]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #10
Jak będziesz interpolował teksturowanie techniką nearest neighbor to żaden nowy kolor Ci nie wpadnie i możesz mieć zoptymalizowaną paletę pod tekstury. Z cieniowaniem już gorzej. Możesz jasność sprogować na np 4 poziomy i mieć 4x tę samą 64-kolorową paletę w 4 różnych poziomach jasności. Wtedy nie liczysz dynamicznie kolorów pikseli, tylko bierzesz indeks koloru wynikający z tekstury i na bazie wyliczonej jasności piksela bierzesz odpowiednią subpaletę. Wszystko da się zrobić lepiej i ładniej ale to zawsze kompromis z prędkością.
Pamiętaj że loRez, loFi i ubogie kolory też potrafią mieć swój urok. Zobacz chociażby ostatnio wałkowany na ppa Poom na pico-8 lub pecetowe Devil Daggers. Prawdziwą sztuką jest zakamuflowanie ograniczeń platformy w stylistyce grafiki. ;)
Ostatnia aktualizacja: 28.12.2020 21:33:33 przez teh_KaiN
Pamiętaj że loRez, loFi i ubogie kolory też potrafią mieć swój urok. Zobacz chociażby ostatnio wałkowany na ppa Poom na pico-8 lub pecetowe Devil Daggers. Prawdziwą sztuką jest zakamuflowanie ograniczeń platformy w stylistyce grafiki. ;)
Ostatnia aktualizacja: 28.12.2020 21:33:33 przez teh_KaiN
28.12.2020 21:45
[#12]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #10
I nasuwa się pytanie czy można jakoś spersonalizować paletęMożna, ale kosztem dodatkowych obliczeń. Wyobraź sobie trójwymiarowy model wszystkich możliwych kolorów RGB, to będzie sześcian o boku 256, czyli złożony z 262144 kostek, przy czym każda kostka reprezentuje jeden możliwy kolor. To co ja robię to kroję ten sześcian na 256 dużych prostopadłościanów. Każdy piksel trafia do jakiegoś prostopadłościanu i dostaje kolor z jego narożnika.
Tu uwaga, można lekko zoptymalizować wygląd, jeżeli po trafieniu w dany prostopadłościan piksel dostanie kolor z jego środka, a nie z narożnika. W tym celu budując paletę według mojego przykładu, każdemu kolorowi w palecie ustawiamy dodatkowo bit 4 w składowych R i G, oraz bit 5 w składowej B (liczę: bit 7 = najstarszy). Wadą jest pozbycie sie z palety koloru całkowicie czarnego (0, 0, 0).
Dalszy krok: można przez prostą analizę maksymalnych i minimalnych wartości RGB generowanych pikseli (a może nawet tekstur, jeżeli założymy, że mamy tylko proste mapowanie, bez żadnego oświetlania) z tego wielkiego sześcianu 256×256×256 wybrać mniejszy prostopadłościan, w którym mieszczą się barwy wszystkich pikseli sceny. Wtedy ten mniejszy prostopadłościan tniemy na nasze paletowe pod-prostopadłościany. Dzięki temu będą one mniejsze, a więc precyzja oddania koloru większa. Sęk w tym, że o ile wcześniej mogliśmy wyznaczyć, w który prostopadłościan nasz piksel trafił, przez proste przesuwanie bitów, o tyle teraz sytuacja się komplikuje.
Na przykład, wyznaczyliśmy sobie, że składowe czerwone wszystkich pikseli ramki mieszczą się między 30 a 190. Ponieważ wcześniej daliśmy 3 bity na czerwony, to oznacza, że będzie w tym zakresie 8 przedziałów po 20. Dla któregoś tam piksela niech składowa czerwona wynosi r, wtedy, żeby znaleźć przedział trzeba najpierw od r odjąć 30, a potem to co zostanie podzielić przez 20. Dzielenie jest zazwyczaj masakrycznie wolne, więc może się okazać, że szybciej będzie mnożyc przez odwrotność, albo wręcz odejmować w pętli (mamy wszak maksymalnie 7 odejmowań). Na szczęście te dzielniki są stałe co najmniej dla całej ramki obrazu, więc jest tu pole dla różnorakich optymalizacji numerycznych.
28.12.2020 22:07
[#14]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #10
@Mateusz_S
No więc kodując w HSV również można przydzielić atrybuty do bitów indeksów pikseli, tylko w bardziej równomierny sposób (znaczek % w poniższym zapisie oznacza wartość binarną).
Założyłem tutaj, że dla Nasycenia %01 - %11 (1 - 3) mamy normalny kolor w Hue.
Oto bazowe wartości Hue: 0, 5 i 10 odpowiadające 0, 120 i 240 stopniom kąta w kole barw, czyli barwom: Czerwonej, Zielonej i Niebieskiej:
Wszystkie pośrednie wartości kodujemy pozostałymi wartościami Hue z przedziału 0 - 15.
Przykłady innych barw:
Takie kolory jak Brązowy uzyskujemy stosując kolor Pomarańczowy ze zmniejszoną Jasnością.
Każdy kolor w takiej dystrybucji ma 4 odcienie, każdy w 3 poziomach nasycenia. Oznacza to, że każdy z 16 różnych kolorów ma 12 wariantów.
W przypadku gdy Nasycenie jest 0 (co pociąga za sobą to, że Barwa przestaje mieć znaczenie - uzyskujemy odcienie szarości), zmieniamy znaczenie bitów Barwy ponieważ nie chcemy żeby barwy się w naszej palecie powtarzały.
Otóż wtedy Jasność przyjmujemy 6 bitów uzyskując 64 odcienie szarości.
Zapisujesz Hue np. na 4 najstarszych bitach, 2 bity na Nasycenie i 2 bity na Jasność.
Przykład: Piksel %1010 10 11 -> Koduje kolor średnio jasny, mocno nasycony kolor Niebieski.
Żeby wkleić piksel musisz posiadać jego parametry HSV - wówczas wystarczy zestawić bity i otrzymujesz indeks piksela. Uwaga: zwróć uwagę, że jeżeli potrzebujesz odcieni szarości kodujesz piksel inaczej.
Jeżeli masz tekstury w RGB, musisz je skonwertować do HSV.
Ostatnia aktualizacja: 28.12.2020 22:17:44 przez Hexmage960
No więc kodując w HSV również można przydzielić atrybuty do bitów indeksów pikseli, tylko w bardziej równomierny sposób (znaczek % w poniższym zapisie oznacza wartość binarną).
Założyłem tutaj, że dla Nasycenia %01 - %11 (1 - 3) mamy normalny kolor w Hue.
Oto bazowe wartości Hue: 0, 5 i 10 odpowiadające 0, 120 i 240 stopniom kąta w kole barw, czyli barwom: Czerwonej, Zielonej i Niebieskiej:
Hue %0000 (0) -> 0 stopni - Czerwony %0100 (5) -> 120 stopni - Zielony %1010 (10) -> 240 stopni - Niebieski
Wszystkie pośrednie wartości kodujemy pozostałymi wartościami Hue z przedziału 0 - 15.
Przykłady innych barw:
Hue %0001 (1) -> 24 stopni - Pomarańczowy %0010 (2) -> 48 stopni - Żółty %0111 (7) -> 168 stopni - Seledynowy
Takie kolory jak Brązowy uzyskujemy stosując kolor Pomarańczowy ze zmniejszoną Jasnością.
Każdy kolor w takiej dystrybucji ma 4 odcienie, każdy w 3 poziomach nasycenia. Oznacza to, że każdy z 16 różnych kolorów ma 12 wariantów.
W przypadku gdy Nasycenie jest 0 (co pociąga za sobą to, że Barwa przestaje mieć znaczenie - uzyskujemy odcienie szarości), zmieniamy znaczenie bitów Barwy ponieważ nie chcemy żeby barwy się w naszej palecie powtarzały.
Otóż wtedy Jasność przyjmujemy 6 bitów uzyskując 64 odcienie szarości.
Zapisujesz Hue np. na 4 najstarszych bitach, 2 bity na Nasycenie i 2 bity na Jasność.
Hue Value Saturation %0000 %00 %00 (dla Saturation w przedziale 1-3) Value Saturation %000000 %00 (dla Saturation równego 0 - odcienie szarości)
Przykład: Piksel %1010 10 11 -> Koduje kolor średnio jasny, mocno nasycony kolor Niebieski.
Żeby wkleić piksel musisz posiadać jego parametry HSV - wówczas wystarczy zestawić bity i otrzymujesz indeks piksela. Uwaga: zwróć uwagę, że jeżeli potrzebujesz odcieni szarości kodujesz piksel inaczej.
Jeżeli masz tekstury w RGB, musisz je skonwertować do HSV.
Ostatnia aktualizacja: 28.12.2020 22:17:44 przez Hexmage960
28.12.2020 23:41
[#16]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #13
Wygeneruj sobie tablicę jasności dla każdego koloru z palety. W tablicy 64kb zmieścisz 256 jasności dla każdego koloru. Tablica wygląda tak:
kolor 0. Jasność 0, jasność 1, jasność 2 ... jasność 255.
kolor 1. Jasność 0, jasność 1, jasność 2 ... jasność 255.
...
kolor 255. Jasność 0, jasność 1, jasność 2 ... jasność 255.
W każdej pozycji tablicy masz indeks koloru w palecie który najbardziej pasuje do wzoru PobierzKolor (indeks koloru tekstury, jasność).
Algorytm obliczy wartość koloru w RGB albo HSV a następnie przeszuka tablicę aby znaleźć najbardziej pasujący kolor w palecie. To oznacza że trzeba odpowiednio przygotować paletę aby algorytm tworzący tablicę miał z czego wybierać.
Tablicę przygotowujesz na początku programu a później to co musisz zrobić to obliczyć pod jaką pozycją w tablicy znajduje się interesujący kolor. Wystarczy zrobić operację (kolor tekstury) OR (jasność << 8) i już masz indeks do tablicy.
kolor 0. Jasność 0, jasność 1, jasność 2 ... jasność 255.
kolor 1. Jasność 0, jasność 1, jasność 2 ... jasność 255.
...
kolor 255. Jasność 0, jasność 1, jasność 2 ... jasność 255.
W każdej pozycji tablicy masz indeks koloru w palecie który najbardziej pasuje do wzoru PobierzKolor (indeks koloru tekstury, jasność).
Algorytm obliczy wartość koloru w RGB albo HSV a następnie przeszuka tablicę aby znaleźć najbardziej pasujący kolor w palecie. To oznacza że trzeba odpowiednio przygotować paletę aby algorytm tworzący tablicę miał z czego wybierać.
Tablicę przygotowujesz na początku programu a później to co musisz zrobić to obliczyć pod jaką pozycją w tablicy znajduje się interesujący kolor. Wystarczy zrobić operację (kolor tekstury) OR (jasność << 8) i już masz indeks do tablicy.
28.12.2020 23:54
[#17]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@Kefir_Union, post #16
nie do końca wszystko zrozumiałem, jeśli mógłbyś rozwinąć bardziej myśl..
tzn. ja w pierwszym założeniu myslałem, że będzie się dało zrobić coś takiego:
- tworzę sobie swoją zafixowaną paletę kolorów (np. sugerując się występowaniem okreslonych textur i potworów na danym poziomie + odcienie)
- silnik tworzy pixel o kolorze RGB24,
- następnie z powyższej palety wyszukiwany jest najbliższy kolor dla utworznego RGB24
niby wszystko ok, ale wydaje mi się, ze poszukiwanie najblizszego koloru dla wszsytkich pixeli na ekranie zamuli całość na maxa..
Ostatnia aktualizacja: 28.12.2020 23:55:13 przez mateusz_s
tzn. ja w pierwszym założeniu myslałem, że będzie się dało zrobić coś takiego:
- tworzę sobie swoją zafixowaną paletę kolorów (np. sugerując się występowaniem okreslonych textur i potworów na danym poziomie + odcienie)
- silnik tworzy pixel o kolorze RGB24,
- następnie z powyższej palety wyszukiwany jest najbliższy kolor dla utworznego RGB24
niby wszystko ok, ale wydaje mi się, ze poszukiwanie najblizszego koloru dla wszsytkich pixeli na ekranie zamuli całość na maxa..
Ostatnia aktualizacja: 28.12.2020 23:55:13 przez mateusz_s
29.12.2020 12:00
[wyróżniony]
[#19]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@Kefir_Union, post #18
No ale po co w ogóle jest chunky? 
Właśnie m.in do manipulacji kolorami. Można sobie też np. rezerwować kolory.
@Mateusz_S
Podsyłam Ci całkiem fajną uniwersalną paletę 256-kolorów na bazie HSV. Przetestowałem ją remapując za jej pomocą kilka różnych obrazków i efekt wygląda ładnie.
Miałem kilka podejść zanim doszedłem do dobrej dystrybucji barw.
Zauważ, że jest 16 odcieni szarości. Na kolory (wartość Hue) dałem większą precyzję (20 zamiast 16) - było to konieczne, żeby obrazki się dobrze remapowały.
Jeśli chcesz mogę podesłać Ci plik IFF z tą paletą.
P.S. Pewnie można to jeszcze poprawić, bo niektóre kolory wyglądają zbyt podobnie.
Ostatnia aktualizacja: 29.12.2020 12:11:20 przez Hexmage960
Właśnie m.in do manipulacji kolorami. Można sobie też np. rezerwować kolory.@Mateusz_S
Podsyłam Ci całkiem fajną uniwersalną paletę 256-kolorów na bazie HSV. Przetestowałem ją remapując za jej pomocą kilka różnych obrazków i efekt wygląda ładnie.
Miałem kilka podejść zanim doszedłem do dobrej dystrybucji barw.
Zauważ, że jest 16 odcieni szarości. Na kolory (wartość Hue) dałem większą precyzję (20 zamiast 16) - było to konieczne, żeby obrazki się dobrze remapowały.
Jeśli chcesz mogę podesłać Ci plik IFF z tą paletą.
P.S. Pewnie można to jeszcze poprawić, bo niektóre kolory wyglądają zbyt podobnie.
Ostatnia aktualizacja: 29.12.2020 12:11:20 przez Hexmage960
29.12.2020 13:08
[#20]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@Hexmage960, post #19
@HexMag, ok to poproszę jeśli można to zerknę :) dzięki..
tylko no własnie chodzi mi o sam sposób konwersji z RGB24 na Twoją paletę..
czy odnośniki do indeksów w tej palecie mam zrobić za pomocą metody @Krashana?
tj. tylko podmienić paletę @Krashana na Twoją?
Bo właśnie to jest dla mnie problem, którego nie ogarniam do końca.
Ja mogę sobie przygotować dla danego poziomu optymalną paletę.
Ale jesli dla każdego pixela na ekranie będę dodatkowo szukał najbliższego koloru
jakimś złożonym algorytmem to z anim nie osiągnę dobrej wydajności..
Jeszcze jest motyw ditheringu, który nawet przy bardzo ubogiej palecie
moze dawać swietne i wystylizowane efekty, no ale to dodatkowe liczenie które by
dodatkowo zmasakrowało wydajność, wiec nawet nie podejmuje tematu :)
tylko no własnie chodzi mi o sam sposób konwersji z RGB24 na Twoją paletę..
czy odnośniki do indeksów w tej palecie mam zrobić za pomocą metody @Krashana?
tj. tylko podmienić paletę @Krashana na Twoją?
Bo właśnie to jest dla mnie problem, którego nie ogarniam do końca.
Ja mogę sobie przygotować dla danego poziomu optymalną paletę.
Ale jesli dla każdego pixela na ekranie będę dodatkowo szukał najbliższego koloru
jakimś złożonym algorytmem to z anim nie osiągnę dobrej wydajności..
Jeszcze jest motyw ditheringu, który nawet przy bardzo ubogiej palecie
moze dawać swietne i wystylizowane efekty, no ale to dodatkowe liczenie które by
dodatkowo zmasakrowało wydajność, wiec nawet nie podejmuje tematu :)
29.12.2020 14:20
[#21]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #20
Jak chcesz żeby działało w 256 kolorach,
to wybierasz dla danego poziomu optymalną paletę,
potem trzymasz całą grafikę, postacie tła itp w tej palecie i nie robisz nic więcej z kolorami.
Kolor zawsze masz zakodowany na jednym bajcie i przepisujesz na ekran po jednym bajcie.
to wybierasz dla danego poziomu optymalną paletę,
potem trzymasz całą grafikę, postacie tła itp w tej palecie i nie robisz nic więcej z kolorami.
Kolor zawsze masz zakodowany na jednym bajcie i przepisujesz na ekran po jednym bajcie.
29.12.2020 15:30
[#22]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #20
Jeżeli zakładamy, że masz dowolną paletę 256 kolorów, to niestety problem będzie złożony obliczeniowo. Bez przyjęcia jakichś dodatkowych założeń, musisz dla każdego piksela RGB obliczyć „odległość koloru” do każdego z kolorów palety. W moim modelu sześcianu taka odległość, to odległość między dwoma punktami w przestrzeni trójwymiarowej. Każda odległość to jest pierwiastek kwadratowy z sumy kwadratów różnic współrzędnych RGB między Twoim piksleem a sprawdzanym kolorem z palety. Ponieważ nie interesują nas wartości tych odległości, a jedynie znalezienie najmniejszej, liczenie pierwiastka można sobie darować. Ale to nadal jest 768 mnożeń na każdy piksel sceny... Kolejne uproszczenie, ale już pogarszające mapowanie, to liczenie odległości w ”metryce miejskiej” jako suma wartości bezwzględnych tych różnic, zamiast ich kwadratów. Wtedy na każdy piksel mamy tylko 768 odejmowań i wartości bezwzględnych, wszystkie mnożenia znikają. Niemniej to jest i tak za dużo...
Wniosek: paleta musi być w jakiś specyficzny sposób ułożona, żeby ograniczyć ilość obliczeń.
Wniosek: paleta musi być w jakiś specyficzny sposób ułożona, żeby ograniczyć ilość obliczeń.
29.12.2020 16:10
[#23]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@Krashan, post #22
no właśnie myślałem o tym, i gdyby mieć jakaś szybką funkcję do szukania najbliższego koloru z palety, może np. za pomocą jakiś drzewek dało by się to zoptymalizować..
inne pomysł to zostać z tym przycinaniem palety, ale dociągnać wartości kolorów a platety do tych z oryginału..
inne pomysł to zostać z tym przycinaniem palety, ale dociągnać wartości kolorów a platety do tych z oryginału..
29.12.2020 16:50
[#24]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #20
@HexMag, ok to poproszę jeśli można to zerknę :) dzięki..
tylko no własnie chodzi mi o sam sposób konwersji z RGB24 na Twoją paletę..
czy odnośniki do indeksów w tej palecie mam zrobić za pomocą metody @Krashana?
tj. tylko podmienić paletę @Krashana na Twoją?
Tak, odnośniki do indeksów działają prawie tak samo jak w metodzie Krashana, wyjaśniłem to w poprzednim poście.
Jednakże najnowszą paletę troszkę zmodyfikowałem przydzielając inaczej parametry HSV.
Na szczęście raczej nie będziesz potrzebował drogich obliczeń, żeby znaleźć odpowiednią barwę.
Wystarczy przygotować wyliczenie z kolorami podstawowymi:
enum Barwy { SZARY, ZIELONY, POMARANCZOWY, ZOLTY, BLEKITNY, ... };Następnie określić liczbę wariantów kolorów podstawowych. Dajmy na to mamy 3 poziomy nasycenia i 4 odcienie (jak poprzednio).
Wówczas znalezienie pierwszego wariantu poszukiwanego koloru polega na pomnożeniu przez liczbę wariantów barw, zakładając że warianty są obok siebie w palecie:
#define ODCIENIE 4 #define POZIOMY_NASYCENIA 3 #define WARIANTY_BARW (POZIOMY_NASYCENIA * ODCIENIE) Piksel = Barwa * (WARIANTY_BARW);
Następnie łatwo znajdujemy poszukiwany odcień i nasycenie zakładając, że poziomy nasycenia są obok siebie w palecie:
Piksel += Odcien * (POZIOMY_NASYCENIA); Piksel += Nasycenie;
Podsumowując oto pełna formuła szukania koloru jak mamy daną barwę, nasycenie i jasność:
Piksel = (Barwa * (WARIANTY_BARW)) + (Odcien * (POZIOMY_NASYCENIA)) + Nasycenie;
Paleta kolorów wygląda tak:
Uwaga: Odcienie szarości liczymy według innej, ale podobnej formuły, jednakże można swobodnie wprowadzać modyfikacje do palety.
Podałem ogólny sposób na porządkowanie kolorów tak, by wyszukanie ich sprowadziło się do jednej formuły.
Barwa 0 Odcień 0 Nasycenie 0 Barwa 0 Odcień 0 Nasycenie 1 Barwa 0 Odcień 0 Nasycenie 2 Barwa 0 Odcień 1 Nasycenie 0 Barwa 0 Odcień 1 Nasycenie 1 Barwa 0 Odcień 1 Nasycenie 2 Barwa 0 Odcień 2 Nasycenie 0 Barwa 0 Odcień 2 Nasycenie 1 Barwa 0 Odcień 2 Nasycenie 2 Barwa 0 Odcień 3 Nasycenie 0 Barwa 0 Odcień 3 Nasycenie 1 Barwa 0 Odcień 3 Nasycenie 2 Barwa 1 Odcień 0 Nasycenie 0 ...
Ostatnia aktualizacja: 29.12.2020 16:59:02 przez Hexmage960
29.12.2020 17:16
[#26]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@Kefir_Union, post #25
Jasne, że nie dostanie się wszystkich barw z palety 24bit.
Dobierając odpowiednie parametry możemy jednak uzyskać zadowalający efekt. Zobacz sobie na paletę z mojego postu #19. Tę paletę można jeszcze poprawić.
Do renderowania grafiki (nie pixelart) 256 kolorów stanowi już całkiem niezłą liczbę.
Można też spróbować pomocniczo alokacji kolorów, tzn. alokować i ustawiać kolor dopiero gdy jest nam potrzebny podczas renderowania grafiki na ekranie. Wtedy mogą zniknąć niedogodności co do braku pełnej precyzji.
W każdym razie warto spróbować.
Ostatnia aktualizacja: 29.12.2020 17:17:14 przez Hexmage960
Dobierając odpowiednie parametry możemy jednak uzyskać zadowalający efekt. Zobacz sobie na paletę z mojego postu #19. Tę paletę można jeszcze poprawić.
Do renderowania grafiki (nie pixelart) 256 kolorów stanowi już całkiem niezłą liczbę.
Można też spróbować pomocniczo alokacji kolorów, tzn. alokować i ustawiać kolor dopiero gdy jest nam potrzebny podczas renderowania grafiki na ekranie. Wtedy mogą zniknąć niedogodności co do braku pełnej precyzji.
W każdym razie warto spróbować.
Ostatnia aktualizacja: 29.12.2020 17:17:14 przez Hexmage960
29.12.2020 17:19
[#27]
Re: Jak generuje się grafikę dla ograniczonej palety, np chunky 256
@mateusz_s, post #23
Może generować na początku coś w rodzaju trzech tablic wskaźników, prowadzących do tablic zawierających indeks kolorów najbliższych dla danej składowej, czyli dla RGB 100, 32, 64 w tablicy R w pozycji 100 dasz wskaźnik do zbioru indeksów twojej palety, które dla składowej R będą takie same jako zamiennik, to samo dla tablicy G i B, potem szukasz trzech takich samych wartości w zbiorach RGB pod pozycją 100, 32 i 64. To tylko koncepcja, więc nie wiem dokładnie jakie konsekwencje może nieść za sobą takie podejście, prócz dużego nakładu obliczeń w przypadku dużej ilości podobnych kolorów. W innym przypadku, musiałbyś chyba zrobić ze swojej własnej palety coś w rodzaju palety pośredniej, która pasowałaby do jednego z wcześniejszych algorytmów z tworzeniem indeksu z bitów składowych, z tym że, nie byłaby to paleta, a wskaźniki do listy kolorów pasujących do danego indeksu. wtedy, gdyby zależało ci na jakości obrazu, mógłbyś dobierać algorytmem dalej najbliższy kolor z listy lub wybrać jeden, który reprezentuje średnią wszystkich kolorów z listy (być może kolejna prekalkulowana tablica, ale tylko z jednym indeksem na wskaźnik). Nie wiem ,czy to co napisałem jest zrozumiałe. :) Tak przynajmniej bym kombinował jako niedoświadczony w temacie.
