D3 ile veri görselleştirme

Geçen hafta size stajda yaptığımız bir kaç Python programından bahsettim. Bu hafta Python’a biraz ara verip veri görselleştirmeye odaklandık. Derlediğiniz verinin dışardan bakan biri için anlaşılabilir kılınması en az veriyi derlemek kadar önemlidir. Veri görselleştirmeyi Javascript dilinin Data Driven Documents kütüphanesini kullanarak yapacağımız için Codecadamy ‘den Javascript derslerini bitirmek  iyi bir başlangıç olabilir. Javascript Python gibi object-oriented bir programlama dilidir fakat Javascript daha çok web programlama için kullanılmaktadır. Görselleştirme aşamasına geçmeden önce elimizdeki verileri  organize etmek çok önemlidir. Neleri nasıl bir ilişki ile göstermek istediğimizi iyice planlamamız ve sonucu veri kaybına uğramadan görselleştirmemiz gerekir. Bizim görselleştirmemiz istenilen veri 6 kişinin 2li kombinasyonlarla oynadığı tavla oyunu sonuçlarıydı. Bu sonuçları değerlendirirken göstermemiz gerekenler kimin en fazla puan aldığı, kimin kime yenildiği, kimin kimi yendiği ve kimin kimi mars ettiğidir. Burada ikili ilişkilerden bahsediyor olmamız bizim matriksten yararlanmamız gerektiği ipucunu veriyor. Sıfırdan görselleştirme kodu yazabilecek kadar zamanımız olmadığı için D3’un resmi sitesinde sergilenmiş olan grafik örneklerinden verimize uygun olanı seçip verimizi ona uyarlamamız gerekiyor. Fakat bu bile kulağa geldiği kadar kolay bir iş değildir. Çünkü verinizi hazır koda uyarlayabilmek için o kodu çözmeniz , nerede ne yapıldığını çok iyi anlamanız gerekir. Bunun için yine D3’ün sitesinde listelenmiş olan anlatımlara bakabilirsiniz. Aynı zamanda epey kullanışlı olduğunu düşündüğüm bir site de paylaşmak istiyorum sizinle. Runnable! Bu sitede Python, C++, Java gibi bir çok dilde kodunuzu yazıp çalıştırabilir ve daha sonar isterseniz paylaşabilirsiniz. Başkalarının yazdığı projelerin kodlarına ulaşıp inceleyebilir hatta bu kodlar üzerinde oynayıp nerede ne yapıldığını anlayabilirsiniz. Bizim tavla sonuçlarına geri dönersek bunları görselleştirmek için en iyi grafiğin “Chord Diagram” olduğuna karar verdik. Bunun kodunu bulup baştan sona satır satır  inceledikten sonara veriyi matriks olarak hazırlayıp koda uyarladım.  Daha sonra ayrıntılarına inip aşağıdaki grafiği elde ettim.

Grafikte şeritlerin uzunlukları oyuncuların toplam puanlarıyla paralellik göstermekte. Şeritleri birbirlerine bağlayan kordonların kalın uçları kazanan, ince uçları ise kaybedeni temsil etmektedir. Aynı zamanda kordonun kalınlığından oyuncunun 1 mi yoksa 2 puan mı kazandığı da anlaşılıyor.

Bugünlük veri görselleştirme hakkında yazacaklarım bu kadar. Bir sonraki yazımda size Django'dan bahsedeceğim. Görüşmek üzere:)