Treemap Ne Zaman İşe Yarar, Ne Zaman Yanıltır

Treemap, iç içe geçmiş dikdörtgenlerle hiyerarşik bir veri setini tek ekrana sıkıştırır. Doğru veride ağırlığın nerede toplandığını bir bakışta gösterir, yanlış veride okuyucuyu sessizce yanıltır. Aradaki farkı belirleyen şey grafiğin kendisi değil, veri setinin şekli.

Treemap neyi iyi yapar

Treemap'in gerçekten iyi yaptığı tek bir iş var: bir hiyerarşide ağırlığın nerede biriktiğini göstermek. 300 alt kategori içinden cironun yarısını üreten dördünü bir bakışta görürsün. Buna karşılık 14. ile 15. sırayı ayırt etmen mümkün değil, çünkü iki dikdörtgenin alanını gözle kıyaslamak yan yana iki çubuğun boyunu kıyaslamaktan belirgin şekilde zordur.

Treemap anlatan metinlerde şu iki cümle çoğu zaman yan yana durur: "nispi büyüklükleri hızla gösterir" ve "alan karşılaştırması zordur". İkisi de doğru; çeliştikleri yer ölçek. Beş kat, on kat farklar alanla anında okunur, yüzde onluk farklar okunmaz. Treemap'i hangi soruya koyacağın tam olarak bu eşiğe bağlı.

Veri hem hiyerarşik hem dengesiz olmalı

İki ön koşul var. Veri gerçekten ağaç yapısında olacak (ülke, şehir, şube gibi), ve dallar arasında belirgin büyüklük farkı bulunacak. Birbirine yakın büyüklükte on iki kategoriyi treemap'e koyarsan ekranda on iki benzer dikdörtgen çıkar; bu bir grafik değil, renklendirilmiş bir tablodur.

Finans panolarının treemap'i sevmesi tesadüf değil. Piyasa değeri dağılımı doğası gereği çarpıktır, birkaç şirket endeksin büyük kısmını taşır. Dosya sistemleri de böyle davranır: bir disk genelde birkaç büyük dizin ve binlerce küçük dosyadan oluşur. Satış verisinde ise bu çarpıklık her zaman yok, önce dağılıma bak, sonra grafik türünü seç.

Kaç dikdörtgen gerçekten sığar

Bu soruyu göz kararıyla değil aritmetikle cevapla. 1200x800 piksellik bir alan 960.000 piksel kare eder. Toplamın binde birini oluşturan bir yaprak düğüm bu alanda 960 piksel kare yer kaplar, yani kabaca 40x24 piksel. İçine 12 piksel yüksekliğinde sekiz karakterlik bir etiket yazamazsın: o etiket tek başına 50-60 piksel genişlik ister, kareye yakın yerleşim (squarified layout) ise sana o oranı vermez. Yaprakları küçülttükçe etiket değil, etiket yeri biter.

Pratik sonuç şu: etiketlerin okunur kalmasını istiyorsan yaprak sayısını otuz kırk bandında tut, kalanını "Diğer" altında topla, detayı tıklamayla bir alt seviyede aç. Tooltip'e yüklenmek çözüm gibi görünür ama grafiği ekran görüntüsünde, sunum slaytında ve çıktıda sağır eder. Dokunmatik ekranda hover diye bir şey olmadığını da hesaba kat.

Renk, alandan sonraki ikinci kanal

Alan zaten bir sayıyı taşıyor. Renge ikinci bir sayı yüklersen grafiği iki kat yavaş okutursun, bunu ancak ikinci değer gerçekten karar değiştiriyorsa yap. Kategorileri ayırmak için rastgele ton dağıtmak yerine tek bir renk ailesinde sıralı bir yoğunluk kur. Kırmızı yeşil karşıtlığını tek değer göstergesi olarak kullanmak, renk körlüğü olan okuyucunun elinden o bilgiyi tümden alır; değeri ayrıca sayıyla yaz ya da ayrımı açık koyu eksenine taşı. Küçük dikdörtgenlerde etiket rengi zemin parlaklığından hesaplanmalı, sabit beyaz etiket açık tonlarda kaybolur.

Ne zaman çubuk grafiğe dönmeli

Soru "hangisi daha büyük" veya "sırala" ise cevap çubuk grafiktir, tartışmaya gerek yok. İki nicel değeri birlikte görmek istiyorsan dağılım grafiği işe yarar. Pasta grafik ise treemap'in alan algısı sorununu aynen taşır, hiyerarşi yeteneğini ise hiç vermez, o yüzden listeden düşer.

Bir yönetim panelinde disk kullanımını treemap'le göstermiştim; iki hafta sonra kullanıcıların aynı ekranda "hangi klasör daha büyük" diye sormaya devam ettiğini görünce yanına sıralı bir tablo koydum, treemap keşif için kaldı, karar için tabloya bakıldı.