Grundläggande visualiseringsteori, del 1: Visuell hierarki

Det här är den första av (förhoppningsvis) flera bloggposter som går in lite mer på djupet kring de teoretiska grunderna för informationsvisualisering. Jag inleder med en av de viktigaste forskningsinsatserna på området – Clevelands hierarki över grafiska element.

William S. Cleveland skrev 1985 tillsammans med Robert McGill uppsatsen Graphical Perception and Graphical Methods for Analyzing Scientific Data , där han för första gången fastslår en rangordning över vilka typer av grafiska metoder för att visualisera data som är effektivast.

När man konstruerar diagram, kodas numerisk information genom storlek, position, form och färg. När man tittar på diagrammet, avkodas informationen visuellt av synsystemet. Den grafiska framställningen är bara lyckad om den avkodningen är effektiv. Den visuella avkodningen handlar om det som på engelska benämns "preattentive vision", dvs det omedvetna, omedelbara mottagandet av information som görs utan någon uppenbar mental ansträngning. Den som är bekant med Daniel Kahneman känner igen det som system 1. Man genomför visserligen också medveten avkodning, genom att t.ex. läsa av skalor och etiketter (Kahnemans system 2), men diagrammens styrka jämfört med tabeller kommer från vår system 1-förmåga att utläsa mönster och jämföra storlekar.

Cleveland och McGill kategoriserade tio olika sätt att visuellt koda information; vinkel, yta, färgskala, färgintensitet, färgtäthet (andel svart), längd, lägen på samma skala, lägen på flera identiska skalor, lutning och volym. Dessa kategorier utgör grunden för i stort sett alla typer av diagram som kan konstrueras.

Kontrollerade experiment genomfördes sen för att studera hur effektiva respektive grafisk typ var för att avkoda information. Försökspersonerna fick försöka utläsa hur stora de procentuella skillnaderna var mellan olika värden kodade med samma grafiska element. Exempelvis fick de se fyra olika vinklar (A-D) och skulle sedan avgöra hur stor andel av vinkel A som vinkel B, C respektive D utgjorde. Försöken upprepades för alla tio olika typer av grafiska element. Genom att jämföra det uppskattade värdet mot det sanna, kunde absolutskillnaden summeras till bedömningsfelet för varje grafisk typ.

Ju större bedömningsfel, desto sämre blir alltså det grafiska elementet på att förmedla information på ett korrekt sätt. Genom att rangordna elementen efter hur mycket (eller lite) fel försökspersonerna gjorde vid försöken, fick man fram en hierarki över olika metoder, graderade från bästa informationsöverföring till sämsta.

Mest effektivt som informationsöverföring är diagram som utnyttjar lägen på en gemensam skala, t.ex. stapeldiagram, linjediagram och punktdiagram. Minst effektiv informationsöverföring får man vid användning av olika färger, t.ex. heatmaps eller tematiska kartor.

Vad betyder då det här för tillämpningen vid diagramkonstruktion? Jo, Clevelands och McGills resonemang är som följer - vid visuell kodning av information har man ofta flera olika valmöjligheter. Man bör då välja den grafiska metod som ligger så högt upp i hierarkin som möjligt. Det ökar exaktheten i avläsningen av mönster i informationen. Det innebär inte en exakt instruktion för hur man konstruerar diagram, men ger ett viktigt stöd i olika valsituationer.

Rent praktiskt innebär det till exempel att tårtdiagram (vinkel) i princip alltid är sämre än stapeldiagram (lägen på samma skala). Att delade stapeldiagram (längd) är sämre än grupperade stapeldiagram (lägen på samma skala). Att olika färger på en karta (färgskala) är sämre än nyanser av samma färg (färgintensitet). Att bubblor (yta) är sämre än staplar (lägen på samma skala). Och så vidare.

Namn på nyfödda, engelsk version

Jag testade även att göra en engelsk version av Tableau-visualiseringen av nyföddas namn. Dessutom utökade jag den lite grann, genom att komplettera med ett stapeldiagram. Jag är inte helt säker på resultatet. Många Tableau-visualiseringar lider av att skaparen vill för mycket och det blir rörigt. Kanske blir det samma sak här, men jag tycker ändå att det känns ganska balanserat att bara lägga till topp-10 för hela landet utan att man tappar fokus på huvudbudskapet. Döm själva.

Interaktiva visualiseringar med Tableau

Tableau är utan tvekan det bästa verktyget på marknaden för att skapa interaktiva visualiseringar. Det är oerhört flexibelt - till skillnad mot t.ex. Statistics eXplorer - och kräver inte några egentliga programmeringskunskaper. Jag håller på att lära mig Tableau för fullt och här följer en enkel tillämpning som jag slängt ihop som övning. Med data från SCB:s namnstatistik har jag gjort en interaktiv karta som visar de populäraste namnen på nyfödda per län, under åren 2009-2012. Gränssnittet är enkelt - bara att klicka för att filtrera och håll muspekaren över intressanta punkter i kartan för att få upp ytterligare information.

Mer cirkelresonemang i DN

I dagens DN rapporteras om att många svenskar betalar dyrt för dåliga elavtal, vilket illustreras av ett diagram över hur elförbrukning fördelas över olika hushåll i mellansverige.

Som vanligt har man valt att använda cirklar, vilket - som vanligt - är ett dåligt val för den här typen av data. Ögat har svårare att jämföra ytors storlekar än exempelvis höjden på staplar, vilket gör att diagrammets budskap blir svårare att tolka. För att kompensera har man lagt till värdesiffrorna i cirklarna, vilket också det är ett dåligt val. Siffervärden i diagram stör de visuella jämförelserna och tillför ingen ytterligare information. Vill man förmedla de exakta värdena är det generellt bättre att att lägga till en separat tabell.

Men cirklarna i sig är inte det enda problemet med diagrammet. Elförbrukningen är redovisade i intervall (kilowattimme/år), där klasserna dessutom inte är lika stora och den sista är ett öppet intervall (mer än 20 000). Ytorna representerar bara elförbrukningen per hushåll och är inte relaterade till den totala mängden. Intervallen tar visuell upp en stor del av diagrammet och riskerar att misstolkas som den samlade förbrukningen.

Om jag gör ett försök att göra om diagammet, skulle jag istället välja ett histogram, som lämpar sig betydligt bättre för att redovisa klassindelade data. Med den begränsade datatillgången man får från artikeln, måste jag göra några antaganden. Dels att förbrukningen är jämnt fördelad inom varje klass, dels hur fördelningen ser ut i den sista, öppna klassen, där jag antar att förbrukningen uppgår till max 30 000 kWh/år. Standardiserar vi diagrammet till att visa andelen per 1 000 kWh/år, får vi någonting i den här stilen:

 Andel av hushållen årsförbrukning av el

Relationen mellan mängden förbrukad el och andelen hushåll framgår tydligare och storleksjämförelserna underlättas. Med bättre data, helst andelen hushåll per 1000 kWh, skulle diagrammet kunna göras ännu bättre och den olyckliga ojämna klassindelningen skulle kunna undvikas. Igen - släpp cirklarna DN, de gör ingen glad!

Form före funktion i DN:s nyhetsgrafik

Kickar igång den här bloggen med att dyka ner på tidningarnas mer eller mindre bristfälliga diagramhantering.

DN redovisar idag en undersökning om härskartekniker. Sedan några år tillbaka har DN infört en mer konsekvent profil i sin nyhetsgrafik. Dessvärre har man låtit formen tagit över före funktionen. I synnerhet är man förtjust i olika former av cirkeldiagram - en kärlek som inte är besvarad när det gäller tydlighet. Dagens exempel är dessutom extra olyckligt, då man valt att använda s.k. "racetrack"-diagram.

Tanken är säkert god - man vill visa svarens andel av hela utfallsrummet och visual cue är att läsa av vinkeln, precis som ett tårtdiagram. Problemet är bara att man genom att lägga svarsalternativen som koncentriska cirklar förvrider proportionerna. Svar med samma andel, t.ex. andelarna som anger att chef resp. kollega utsatt dem (66 procent), ger olika långa banor. Ögat läser i första hand av längden på cirklarna och först därefter vinkeln. I praktiken är det här bara enkla stapeldiagram som har böjts runt i cirklar och därigenom förvridits.

Det är inte många datapunkter här. Fem stapeldiagram med tre staplar var skulle lyfta fram budskapet både tydligare och mer korrekt och dessutom ta mindre plats. Det är faktiskt så pass enkelt att jag inte ens gör ett försök att förbättra själv.

Nej, DN. Släpp cirkeldiagrammen, både här och i andra sammanhang. De har sin plats i vissa sammanhang men det här är definitivt inte ett av dem.