ツリーマップ、代議員の収入、および言語処理

habraのトピック「州下院が議員の収入を新しい形で提示した」を読んで、 議員の収入に関するデータは視覚化する価値があると判断しました。 処理言語のトピック「データの可視化」に慣れると、ツールとして行動したのは彼でした。 以下は最初の写真の一部です。Treemappingとは何か、Processingでどのように調理するかを知ることができます。







私にとってデータの視覚化に関する最高の本の1つは、Ben Fry のVisualizing Dataです。これは、Processingのクリエイターの1人による小さな本です。 この本は、1石で2羽の鳥を殺します。情報の視覚化の原理を詳しく説明し、それに処理言語を使用する方法を説明しています。 Habrでの処理については、 こちらとこちらですでに書いています 。 バージョン2.0a4が利用可能になりました（現時点ではアルファ版ですが）。 データの視覚化の最初の章で、Ben Fryはデータの視覚化の7つの段階について説明します：データの取得、データの解析、過剰なデータのフィルタリング、データの処理（たとえば、最小値と最大値の検索）、データ表現の選択、この表現の改善、最後の項目はインタラクティブな追加です。 彼はまた、このプロセスは必ずしも連続的ではなく、しばしば前の段階に戻らなければならないことを指摘しています。







もちろん、最初の項目はデータ自体を取得することです。 Dumaのウェブサイトで複数の代理人のページを表示した後、URLの数字のみが変更されていることが明らかになりました。目的の範囲が[23494-23964]、 http： //www.duma.gov.ru/structure/deputies / 23494 / http://www.duma.gov.ru/structure/deputies/23964/まで。 ページ自体には、特定の割合のメンバーシップに関するデータと収入に関する情報が必要でした。 C＃のプログラムを使用してデータをダウンロードしました（既に持っていたため）が、自分のスクリプトを使用してこれを行うことは難しくありません。 確かに、翌日下院のウェブサイトにアクセスしたとき、何らかの理由で、代理人の収入に関する情報が表示されませんでした-それが何であったかはわかりません-仕事から、そして他の日にはすべてが整っていました。 しかし、気が散りました。 最初の項目が完了しました-データが受信されました。 それらを視覚化するときがきたので、棒グラフから始めることにしました。これは非常に簡単だからです。







写真は、議員の大部分がほぼ同じお金を受け取り、さらに桁違いに多くを受け取っている議員の一部があることをよく示しています。 このようなチャートの短所：約450のインジケーターを比較するにはあまり適していません。 さらに、収入値の大きな変動により、小さな値を区別できなくなります。 もちろん、スケールを対数にすることはできますが、その場合、ほぼ20億から200万を比較するという視覚的な陰謀は失われます。 良い-列の対応する長さのインジケーターを比較してもうまく機能しないため、面積を比較する必要があります！ 列の代わりに円を描きます：







マグカップは印象的ではありません-正方形に置き換えます：







より良いようです。 何らかの理由で、私はすぐにxkcdの写真を思い出しました。 そして、別のオプションが思い浮かびます- ツリーマップ 。



Treemapは、 Ben Shneidermanによる情報視覚化の第一人者の発明です。 1990年、Ben Schneidermanは、どのファイルがハードディスクのほとんどのスペースを占めるのか疑問に思いました（彼が働いていた研究室では、14人のユーザーが80Mバイトのディスクを使用していました）。 ベンは、フォルダーとファイルのツリー構造のコンパクトな視覚化について考え始めました。そこで、彼は後でTreemapと呼ばれるチャートを思いつきました。 Treemappingの歴史について詳しくは、 こちらをご覧ください 。記事の最後に、このタイプの視覚化の使用例が数多くあります。 そして、データの視覚化の本では、章全体がツリーマップに当てられています。 Processingディストリビューションにはこの本の例が含まれており、Treemap専用の例が2つあります。 どちらの例もTreemapライブラリを使用しています-これは 、Processingで動作するように修正されたJavaライブラリのバージョンです。 このライブラリには、スペースを長方形に分割するためのいくつかのアルゴリズムがあります：スライスとダイス、中間ごとのピボット、サイズごとのピボット、サイズごとのピボット、分割レイアウト。 ここで異なるアルゴリズムの動作を比較できます （Javaプラグインが必要です）。 「正方形のレイアウト」が提供する画像は、私の意見では、最も楽しいものです。 このアルゴリズムは、長方形ができるだけ正方形に近くなるように長方形を作成しようとします。 Squarifiedレイアウトアルゴリズムについては、Jack van Wijkの記事で説明されています。 ライブラリを使い始めるには、ライブラリの3つのクラスSimpleMapItem、MapModel、およびTreemapを理解する必要があります。 SimpleMapItemクラスは単一のセルを表し、MapModelは配列内のセルのリストを格納し、Treemapクラスは視覚化自体を構築し、コンストラクターでMapModel型のオブジェクトとチャートの境界の座標を取得します。 MapLayoutオブジェクトは、杭打ちアルゴリズムの実装を定義するTreemapオブジェクトにも保存されます。 デフォルトでは、Treemapはピボットサイズごとのピボットアルゴリズムを使用しますが、関数setLayout（MapLayoutアルゴリズム）を使用して別のアルゴリズムを指定することを妨げるものはありません。 したがって、一般に、ProcessingでTreemap視覚化を取得するには、SimpleMapItemおよびMapModeインターフェイスをそれぞれ実装するDeputatItemおよびDeputatMapクラスを作成します。 SimpleMapItemには、ツリーマップ内の四角形のサイズを決定するsizeパラメーターがあり、代理人が獲得した金額を割り当てます。



データを読み取り、SimpleMapItemインターフェイスを実装するDeputatItemオブジェクトに保存します。 代理人に関する情報を含む作成されたオブジェクトがDeputatMapオブジェクトに追加されます（MapModelインターフェースの実装）。

DeputatMap dMap = new DeputatMap(); String[] lines = loadStrings("parliamentV2010.csv"); for (int i = 0; i < lines.length; i++) { //...  id, party, name, money  lines[i] DeputatItem d = new DeputatItem(id, party, name, money); dMap.addDeputat(d); } dMap.finishAdd();
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

Treemapオブジェクトを作成し、DeputatMapパラメーターと、ダイアグラムを構築する長方形の寸法を与えます。

 Treemap treemap = new Treemap(dMap , 0, 0, width - 1, height - 1); //   SquarifiedLayout    treemap MapLayout algorithm = new SquarifiedLayout(); treemap.setLayout(algorithm); treemap.updateLayout();
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

前のコードは、setup（）の処理関数で実行され、draw（）の処理関数では、treemapオブジェクトのdraw（）関数を呼び出します。

 void draw() { treemap.draw(); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

各代理人が所属するパーティに応じて色が割り当てられ、代理人に関する情報がこれを許可するサイズのセルに表示される場合、次の図が表示されます。







同じパーティーに属する代理人をグループ化することにしました。このために、別のレベルの階層であるパー​​ティーを追加する必要があります。 概略的には、前の段階で得られたツリー構造は次のように表すことができます：Duma-> deputies、追加されたパーティー：Duma-> partys-> deputies。 このようなスキームでは、さらに2つのクラスPartyItem（SimpleMapItemインターフェースの実装）とPartyMap（MapModelインターフェースの実装）が必要になります。 同様の手順でツリーマップを作成すると、次の図が表示されます。









写真は、所得分配の一般的な構造を明確にしますが、残念ながら、写真から特定の代理人を見つけることはできません。 これを行うには、 対話型バージョンを使用するか、 windows 、 linux 、 mac osのアプリケーションをダウンロードするか、 ソースコードをダウンロードして処理を実行します 。



PS Treemapは、Processingだけでなく構築できます。 ブログFlowing dataの著者であるNatan Yuは、情報の視覚化に対するこのアプローチを促進しています。統計分析プログラムRでデータを処理し、Illustratorで結果のイメージを思い浮かべます。 ネイサンは最近、このアプローチを詳述した本をリリースしました。 Rには、Nathanのブログのトピックへのリンクに興味がある人のために、ツリーマップを作成するための特別な機能があります。



JavaScriptの実装もあります。

Google Chart Tools Treemap ;

d3.jsツリーマップ ;

JavaScript InfoVis Toolkitツリーマップ 。