Vygenerovanie farebnej palety

Vygenerovanie farebnej palety
« kdy: 28. 05. 2023, 16:11:30 »
Ahojte na line chart grafe zobrazujem rôzne hodnoty ako čiary / lines: napr. min, max, average, median a dalšie môžu ich byť kludne aj 20.  Tieto hodnoty, ale chcem nejako zvýrazniť aby sa neplietli.

Základ je asi vygenerovať takú farebnú paletu, aby každá line mala čo najodlišnejšiu farbu od tých ostatných. Inými slovami nechceme tam svetlozelenú a hneď ďalšiu tmavozelenú alebo žltú. Ale k zelenej napríklad červenú k červenej tmavo modrú alebo čiernu... Akým spôsobom vygenerovať farebnú paletu pozostávajúcu z farieb ktoré sú opticky od seba čo najodlišnejšie? Podklad grafu je biely takže farby by mali mať nízky jas a vysokú saturáciu.


alex6bbc

  • *****
  • 1 431
    • Zobrazit profil
    • E-mail
Re:Vygenerovanie farebnej palety
« Odpověď #1 kdy: 28. 05. 2023, 16:25:13 »
zacal bych tady s barvami, ktere jsou komplementarni:

https://www.101computing.net/complementary-colours-algorithm/

jak vybrat barvy pro vizualizaci grafu:

https://chartio.com/learn/charts/how-to-choose-colors-data-visualization/

Re:Vygenerovanie farebnej palety
« Odpověď #2 kdy: 28. 05. 2023, 17:28:47 »
Pokud si do podmínek dáváš nízký jas (lightness) a vysokou sytost (saturation) zbývá ti jako volně definovatelný parametr odstín (hue).
Takže si dostupný rozsah odstínů (0-360°) vyděl počtem požadovaných barev a máš požadovaný odstup jednotlivých barev.
Případně si můžeš pro zvýraznění odstupu sousedních barev definovat 2 vhodné úrovně jasu nebo sytosti a střídat je u lichých a sudých barev (seřazených podle odstínu).
No a nakonec barvu převést z HSL do RGB (postup třeba tady https://www.rapidtables.com/convert/color/hsl-to-rgb.html ).

vcunat

  • ***
  • 121
    • Zobrazit profil
    • E-mail
Re:Vygenerovanie farebnej palety
« Odpověď #3 kdy: 28. 05. 2023, 21:09:12 »
20 mi už přijde dost na to, aby se vizuálně dostatečně rozlišily jen pouze podle hue.

alex6bbc

  • *****
  • 1 431
    • Zobrazit profil
    • E-mail
Re:Vygenerovanie farebnej palety
« Odpověď #4 kdy: 29. 05. 2023, 03:17:51 »
20 mi už přijde dost na to, aby se vizuálně dostatečně rozlišily jen pouze podle hue.

cerna, cervena, modra, zelena, fialova, zluta, oranzova, ruzova, hneda, tyrkysova, to je 10 barev a dalsich 10 treba s polovicni sytosti.


Re:Vygenerovanie farebnej palety
« Odpověď #5 kdy: 29. 05. 2023, 08:44:03 »
Pokud se ptáte protože nějakou paletu potřebujete, tak na netu takových palet jsou mraky - hledejte "bar chart color palette" Stačí si přepsat rgb kódy anebo natípat... 
Pokud si chcete vygenerovat vlastní, zase na to už existují generátory hledejte "bar chart color palette generators"
No a pokud si chcete sám něco vygenerovat, začněte teorií - např. tady https://blog.datawrapper.de/beautifulcolors/
Gréta je nejlepší.

_Jenda

  • *****
  • 1 550
    • Zobrazit profil
    • https://jenda.hrach.eu/
    • E-mail
Re:Vygenerovanie farebnej palety
« Odpověď #6 kdy: 29. 05. 2023, 09:06:19 »
Pokud to má být do praktického normálního programu a ne cvičení/demo, tak použiješ nějakou existující (ukradni si třeba z matplotlibu), kterou udělali lidi, kteří vzali v potaz, jak se to zobrazuje na různých monitorech, ale především třeba to, jak to vnímají i ostatní.

Re:Vygenerovanie farebnej palety
« Odpověď #7 kdy: 29. 05. 2023, 10:39:13 »
Pro odlišení čar lze krom barvy použít i tloušťku a typ (plná, čárkovaná, tečkovaná, ...)

alex6bbc

  • *****
  • 1 431
    • Zobrazit profil
    • E-mail
Re:Vygenerovanie farebnej palety
« Odpověď #8 kdy: 29. 05. 2023, 11:50:37 »
mi se uz 2 desitky let libi jake barvy vybira gnuplot pro kresleni grafu.

Re:Vygenerovanie farebnej palety
« Odpověď #9 kdy: 29. 05. 2023, 14:28:00 »
Takže si dostupný rozsah odstínů (0-360°) vyděl počtem požadovaných barev a máš požadovaný odstup jednotlivých barev.

To nestačí, obzvlášť u takhle náročné úlohy (20 odlišitelných odstínů). Významná část populace (>8 % mužů a <1 % žen) má jednu z forem barvosleposti a většina o tom neví, takže budou nadávat na autora grafu. Významná část (nebo dnes asi i většina) na to bude koukat na mobilu v neideálních světelných podmínkách, třeba i venku na slunci, což taky musíte zohlednit (z 8 bpp máte najednou třeba jen 3). Podání barev monitorů je všelijaké, navíc dneska si dost lidí zapíná Night Light nebo podobnou funkci, která k večeru posouvá barvy do teplých, což vám taky naprosto rozbije jakoukoliv snahu o odlišení.

Tl/dr použijte nějakou odborně vyvinutou a dobře otestovanou kvalitativní paletu :) nejlépe integrovanou s nástrojem, co používáte. Např. matplotlib má paletu tab20.


mark42

  • ***
  • 101
    • Zobrazit profil
    • E-mail
Re:Vygenerovanie farebnej palety
« Odpověď #10 kdy: 30. 05. 2023, 14:48:18 »
Ahoj, nechcem aby to znelo, ze rypem do zadania :) Mam vsak par otazok:
Tych 20 je maximalny pocet, ci len pocitovy? Ak pocitovy, moze byt realny pocet vyssi/neobmedzeny? Ak je to maximum, aky je typicky pocet hodnot? Odpovede pomozu pri optimalizacii palety na typicky pocet hodnot + doplnenie "problematickejsich" odtienov na koniec palety, kotora sa nevyuzije casto.
Je nutne mat v jednom grafe vsetko, co pises? Bude ten graf citatelny? Co chces tymto grafom ukazat/vysvetlit?
Ak ma clovek porovnavat okom cez 10 hodnot v grafe, musia byt jedneho logickeho typu/hodnoty - funguje to napr. s jednotkovou cenou. Tvoj priklad s min/max/median/average k tomuto nesedi.
Vid vyssie - graf bude prezentovany na webe, na projektore?
Vsetko toto pomoze pri najdeni optimalnej palety.

alex6bbc

  • *****
  • 1 431
    • Zobrazit profil
    • E-mail
Re:Vygenerovanie farebnej palety
« Odpověď #11 kdy: 30. 05. 2023, 15:10:03 »
napadla me rotace RGB bajtu, treba #ff 00 00 (cervena), rotace doprava #7f8000 (hneda), #3fc000 (svetle zelena), #00ff00 (zelena), pokombinovat jenom ruzne rotace.

Re:Vygenerovanie farebnej palety
« Odpověď #12 kdy: 01. 06. 2023, 10:16:43 »
Pokud má být ten graf jen pro zobrazení (prezentace, tisk, ...), tak bych doporučoval použít raději různé typy čar: plná, čárkovaná, tečkovaná. Na rozdíl od pouhých barev je tohle pro většinu lidí jednoznaně rozlišitelné, zatímco např. modrozelená vs zelená mohou být problém.

Naopak pokud ten graf má být interaktivní (v prohlížeči, atd.), tak je hlavní aby se po najetí myší či kliknutí na nějakou hodnotu zvýraznilo vše co k téhle hodnotě patří. A pak nejsou jednotlivé barvy až tak podstatné.

Další variantou (kombinovatelnou s předchozími) je použít výrazné barvy pro ty průběhy které jsou nejdůležitější, a u zbytku už neřešit jejich odlišitelnost.