Adatvizualizációs Alapismeretek
Szabó Krisztián
2025.03.29
Szabó Krisztián
Átlátszó
ATLO
Eötvös Loránd Tudományegyetem (ELTE)
Leggyakrabban használt alkalmazások:
E. R. Tufte: The visual display of quantitative information, 1983
Grafikai tökéletesség (graphical excellence)
- Mutasd meg az adatot
- A tartalomra irányítsd a figyelmet a módszertan, dizájn technológia helyett
- legyen igaz az ábra, ne torzítsd az adatot
- minél több szám minél kisebb helyen
- legyenek a nagy adatbázisok érthetőek, átláthatóak
- ösztönözd a befogadót az összehasonlításra
- mutasd be az adatot különböző részleteiben (mikro/makro)
- a szöveg és a vizuális elem legyen összhangban egymással
- Megalapozottság
- Hasznosság
- Esztétikai érték
Megalapozottság- Hasznosság
- Esztétikai érték
—> hibás
- Megalapozottság
Hasznosság- Esztétikai érték
—> Nehezen érthető,
félrevezető
- Megalapozottság
- Hasznosság
Esztétikai érték
—> Csúnya
1. Megalapozottság
Olyan adatot használ, ami:
- megbízható
- őszinte
- pontos
- igaz
- megfelelő mennyiségű
- Legyen az adat útja visszakövethető (forrásmegjelölés)
2. Hasznosság
1. Megfelelő vizuális változók használata (Jacques Bertin, 1967: Semiology of Graphics;
Cleveland and McGill, 1984)
- elhelyezkedés azonos tengelyen
- elhelyezkedés nem azonos tengelyen
- hossz, irány, szög
- terület
- térfogat
- telítettség
- eltérő színezés
2. Hasznosság
2. Megfelelő dimenziók használata
Adat mennyiségétől és az interakció lehetőségétől függ
a, kevés adat —> táblázat
2. Hasznosság
2. Megfelelő dimenziók használata
Adat mennyiségétől és az interakció lehetőségétől függ
a, kevés adat —> táblázat
b, elegendő adat —> 2D diagram
2. Hasznosság
2. Megfelelő dimenziók használata
Adat mennyiségétől és az interakció lehetőségétől függ
a, kevés adat —> táblázat
b, elegendő adat —> 2D diagram
c, elegendő adat egy harmadik tengelyre is —> 3D diagram
2. Hasznosság
2. Megfelelő dimenziók használata
Adat mennyiségétől és az interakció lehetőségétől függ
a, kevés adat —> táblázat
b, elegendő adat —> 2D diagram
c, elegendő adat egy harmadik tengelyre is —> 3D diagram
2. Hasznosság
2. Megfelelő dimenziók használata
Adat mennyiségétől és az interakció lehetőségétől függ
a, kevés adat —> táblázat
b, elegendő adat —> 2D diagram
c, elegendő adat egy harmadik tengelyre is —> 3D diagram
DE! Pszeudo-3D-t kerüljük
2. Hasznosság
2. Megfelelő dimenziók használata
Adat mennyiségétől és az interakció lehetőségétől függ
a, kevés adat —> táblázat
b, elegendő adat —> 2D diagram
c, elegendő adat egy harmadik tengelyre is —> 3D diagram
DE! Pszeudo-3D-t kerüljük
d, időbeli változás —> animáció
2. Hasznosság
2. Megfelelő dimenziók használata
Adat mennyiségétől és az interakció lehetőségétől függ
a, kevés adat —> táblázat
b, elegendő adat —> 2D diagram
c, elegendő adat egy harmadik tengelyre is —> 3D diagram
DE! Pszeudo-3D-t kerüljük
d, időbeli változás —> animáció
d+1, alternatív időábrázolás —> izokrón
2. Hasznosság
3. megfelelő szándék
Olyan funkciókkal kell felruházni az ábrázolást, amilyen szándékkal készül
- felderítő (exploratory)
- magyarázó (explanatory)
- konceptuális
- adatalapú
- statikus
- interaktív
2. Hasznosság
4. igazodik az olvasóközönség elvárásaihoz
ismeri a közönségét: a vélt befogadói szintet nem méri se felül, se alul
3. Esztétikai érték ("dizájn")
1. vizuális jelek befogadása
Az adatot oly módon mutatja be, hogy kihasználja vizuális érzékelési képességeinket a megértés megkönnyítése érdekében (Andy Kirk, 2012)
Colin Ware, 2004
a, pre-attentív feldolgozás
—> alakfelismerés (méret, mintázat, elhelyezkedés)
—> színfelismerés
—> mozgásérzékelés
Cél: a vizualizáció lényeges elemeinek kiemelése
3. Esztétikai érték ("dizájn")
3. Esztétikai érték ("dizájn")
3. Esztétikai érték ("dizájn")
1. vizuális jelek befogadása
Az adatot oly módon mutatja be, hogy kihasználja vizuális érzékelési képességeinket a megértés megkönnyítése érdekében (Andy Kirk, 2012)
Colin Ware, 2004
a, pre-attentív feldolgozás
b, mintázatfelismerési szakasz
—> Gestalt alapelvek
Közelség elve
Hasonlóság elve
Bezártság elve
Zártság elve
Folytonosság elve
Összekötöttség elve
3. Esztétikai érték ("dizájn")
1. vizuális jelek befogadása
Az adatot oly módon mutatja be, hogy kihasználja vizuális érzékelési képességeinket a megértés megkönnyítése érdekében (Andy Kirk, 2012)
Colin Ware, 2004
a, pre-attentív feldolgozás
b, mintázatfelismerési szakasz
c, tudatos figyelem
—> vizuális változók
3. Esztétikai érték ("dizájn")
2. színhasználat
A szín számértéket vagy kategóriát reprezentálhat
- bináris
- lineáris
- divergens
- kategorikus
- kiemelő
Bináris
Lineáris
Divergens
Kategorikus
Kiemelő
3. Esztétikai érték ("dizájn")
2. színhasználat
Színvakok és színtévesztők figyelembe vétele (férfiak kb 8 százaléka, nők kb 0,5 százaléka)
Deuteranomália (zöldszín-tévesztés)
Deuteranópia (zöldszín-vakság)
3. Esztétikai érték ("dizájn")
3. "Adat-tinta arány" vs chartjunk
(E.R.Tufte, 1983)
- "A kitörölhetetlen magja a vizualizációnak, a szükséges tinta ami a képviselt adatok arányában van elrendezve az ábrázoláson"
- cél: adat-tinta maximalizáció
—> nem adat célból használt elemek redukálása
—> ismétlődő adatelemek törlése
Chartjunk
- felesleges adatelemek
- felesleges nem adat jellegű dekorációk
- elemek, amik elvonják a figyelmet a lényegről
- magas "hazugságfaktorral" rendelkező ábrázolások (a megjelenített vizuális elem aránytalan a reprezentált adathoz képest)
Adatvizualizációs checklist
- Mutasd meg az adatot
- Legyen sallangmentes
- Integráld a szöveget és a feliratot
- Ne zsúfold túl
- Kezdd szürkével
1. Mutasd meg az adatot
"Nem kell minden konkrétumot megmutatni, de az üzeneted átadásához szükséges elemek jelenjenek meg és legyenek kiemelve."
2. Legyen sallangmentes
"A szükségtelen elemek elterelik a befogadó figyelmét és eltelítik a képet."
3. Integráld a szöveget és a feliratot
"Gyakran az olvasók utólag olvassák el a szövegeket, de ezek magyarázzák meg a kontextust vagy azt, hogy hogyan olvassuk magát a diagramot"
a. Jelmagyarázat eltávolítása,
direkt cimkézés
a. Jelmagyarázat eltávolítása,
direkt cimkézés
b. Magyarázó cím
b. Magyarázó cím
c. Magyarázó szövegek (annotációk)
c. Magyarázó szövegek (annotációk)
4. Ne zsúfold túl
"A túlzsúfolás helyett csinálj kis variációkat ugyanarra az adatra – csinálj gridet, small multiples diagramot. A kis egységeknek a tartománya, tengelye ugyanaz, de az adatnak más részét mutatják meg."
4. Ne zsúfold túl
"A túlzsúfolás helyett csinálj kis variációkat ugyanarra az adatra – csinálj gridet, small multiples diagramot. A kis egységeknek a tartománya, tengelye ugyanaz, de az adatnak más részét mutatják meg."
4. Ne zsúfold túl
"A túlzsúfolás helyett csinálj kis variációkat ugyanarra az adatra – csinálj gridet, small multiples diagramot. A kis egységeknek a tartománya, tengelye ugyanaz, de az adatnak más részét mutatják meg."
5. Kezdd szürkével
"Amikor nekikezdesz az ábra elkészítésének, kezdd szürkével. Ezáltal rákényszeríted magad, hogy a színeket, címkéket és egyéb elemeket céltudatosan használd."
Kérdések?
Formátumok
Tabuláris:
xls
xlsx
csv
json
xml
Térinformatikai:
kml
geojson
shp
geotiff
Egyéb:
pdf
jpeg
keresés
letöltés
konvertálás
előkészítés
elemzés
ábrázolás