何百ものカテゴリにわたる偏ったデータをどのように視覚化しますか? 私はこれに役立つ新しいチャート形式を実験してきました。 私はそれを「詰め込んだバー」と呼んでいます。これは、順序付き棒グラフとツリーマップを合成したものです。 最近の S&P 500 時価総額データを圧縮棒グラフで表示すると次のようになります。

青色の「主要」棒と軸は、時価総額順に上位 12 社を示す規則的な棒グラフを形成します。 灰色の「二次」バーはそれぞれ他の企業を表します。 スペースが許せば、一部の二次バーにラベルを付けることができますが、その主な目的は主バーにコンテキストを提供することです。 をサポートするという考えです。フォーカス+コンテキストデータ視覚化の原理。
二次カテゴリがいくつあるか、それらの合計サイズがどれくらいか、さらにはサイズがどのように分布しているかを大まかに把握できます。 また、これらは主バーと同じスケールであるため、軸上にまたがる長さから一部の値を推定することもできます。 動的表示では、ホバー ラベルを介してカテゴリ ラベルと二次カテゴリの値にアクセスできます。
右端は必ずしも均等になるわけではありませんが、大きい補助バーを左から右に最初に配置すると、通常はかなりうまくいきます。
例
場合によっては、値が非常に偏っているため、2 次塗りつぶしが 1 次バーを超えないことがあります。 世界経済を名目GDPでグラフ化した場合も同様だ。 この詰め込まれた棒グラフは、192 の世界経済の上位 7 つをハイライトしています。 (まったく同じではありませんG7 、 ところで)。

主要カテゴリーを 4 つだけ選択すると、米国経済が世界の名目 GDP の約 4 分の 1 であるという事実が浮き彫りになります。

2 次カテゴリーの合計が 1 次バーと同じスケールに収まる場合は、このように別のバーにまとめることができます。

偏ったデータのソースは経済学だけではありません。 以下はニカルジピン薬の治験データからの副作用数です。

バーのサイズは発生数を表し、色は平均重大度を表します。 主なカテゴリに焦点を当て続けるために、二次色は依然として褪色していますが、より正確な色の表現が重要な場合は、そうする必要はありません。
私がこの道に進むきっかけとなったデータセットは、ニューヨーク市に登録されている犬の名前のコレクションでした。 これは、16,000 を超える名前の上位 25 位をハイライトした私の作品です。

他のパックされたバーの例とは異なり、二次カテゴリはアルファベット順に行ごとに配置され、特定の犬の名前の検索をサポートします (ホバー ラベルを使用)。 この配置の欠点は、右端の均一性が著しく低いことです。
(ツリーマップとは異なり) 真の X 軸を持つ利点は、母集団全体の総和を推定できることです。 この場合、25 行があり、それぞれの行はカウント軸上で 4,000 を少し超える程度になります。 犬の数は 25 x 4,000+ = 100,000+ と推定できます。
ニカルジピンの例では、バーの連続カラー スケールの使用を示しました。 カテゴリカルカラーリングを使用すると、退色によって色の解釈が複雑になる可能性が低くなります。 この犬の名前の見方では、「y」の音で終わる名前にオレンジを使用しました。

バリエーション
私はさまざまなバリエーションを試してきましたが、上記の例はその多くを示しています。 パック棒グラフを作成する場合、次のオプションから選択できます。
何行ですか? 適切な一般的なデフォルトはありますか? 10 のような概数を使用すると、乗算トリックを適用して総計を求めるのが簡単になりますが、アスペクト比の方が重要になる場合があります。
補助バーをサイズに従って左から右に配置しますか、それとも行ごとにアルファベット順に配置しますか? サイズによる左から右とは、行に関係なく、各二次バーの左端の位置がサイズによる並べ替え順序に対応することを意味します。 バーが大きいほど、左に移動します。 ある意味、これはサイズ順のプライマリ バーと一致しており、右端がきれいになるという利点があります。 また、同じようなサイズをまとめておくと、分布を理解するのに役立つ場合があります。 行ごとのアルファベット順は、対話型表示で特定のカテゴリを見つける場合に便利です。 補助バーはアルファベット順に左から右に配置されます内部上の行から始まる各行。
二次バーの色付け? ランダムなグレー、色あせた色、トゥルーカラーを試してきました。 グレーをランダム化すると、区切り線が不要になります (グレーが連続して重複するのを避けます)。
プライマリーバーのラベル付け? グラフ領域の外側の軸にラベルを配置すると、バー内に収まるという制約が回避されます。 ただし、主ラベルを棒の内側に配置すると、積み上げ棒グラフと区別しやすくなり、スペース効率が向上します。
二次バーのラベル付け? 私は当初、それらを強調するために二次的なラベルを付けないことを好みました。コンテクスト役割はありますが、いくつかのラベルがあることは、何が起こっているのかよくわからない新しい視聴者にとって大きな助けになるようです。
二次バー用に個別のスタックを用意しますか? 「その他」スタックは、データが非常に偏っていて、すべての 2 次値の合計が 1 次バーと同じスケールになる場合に実行可能です。
二次バーのすべてまたは一部を 1 つの固体の「その他」領域にマージしますか? これにより、コンテキストの側面の大部分が維持され、右端が滑らかになり、表示のノイズが少なくなります。 ただし、セカンダリ サイズのカーディナリティと分布に関する情報が一部失われます。
代替案
パックバーは、多くのカテゴリで偏ったデータを視覚化する別の方法とどう違うのでしょうか?
- と比較して、棒グラフ上位のカテゴリーの場合、パック棒グラフは残りのカテゴリーのコンテキストを取得します。 主な欠点は、二次バーによりグラフが大きくなり (または主バーが縮小し)、ラベルや注釈に使用される可能性のあるスペースが占有されることです。
- に比べツリーマップ、パックバーは一般に、より正確なデータ表現 (軸上のバーの長さと軸のない領域) を持ちますが、より大きな利点は、目立つラベルと軸に合わせたサイズを取得する主要なカテゴリーを表示できることです。 ただし、ツリーマップはネストと真のスペース充填 (ギザギザの右端なし) をサポートします。 また、1x12 ピクセルのバーよりも 3x4 ピクセルの四角形の方が見やすいという意味で、小さな値はツリーマップでより適切に表現される可能性があります。 パックバーの軸は精度をもたらしますが、スペースを占有するため、ツリーマップのスペース効率が向上します。
- に比べ詰まった泡(のように、オリジナルの犬の名前のバブルチャート)、パックされたバーは、スキャンの際により規則的に配置され、データ値を表現する際に円領域よりも長さが知覚的に有利になります。 ただし、ツリーマップと同様に、小さな値はバブルとして認識しやすい場合があります (直径 4 ピクセルの円と 1x12 ピクセルのバー)。
- と比較して、一次元散布図、パックされたバーは、主要なカテゴリと累積合計の意味に、目立つ整列したラベルを追加します。 散布図には、すべての値に対して正確な位置エンコードを使用し、別の変数に使用できるサイズ チャネルを維持できるという利点があります。ただし、オーバーストライクにはジッターやドッジングを使用して対処する必要があり、非常に偏ったデータでは問題が発生する可能性があります。
- に比べラップバー、バーを複数の列に再編成します。パックされたバーはスペース効率が高く、より多くのカテゴリ (100 単位ではなく 1,000 単位) をサポートするのに役立ちます。また、パックされたバーは全体の面積の感覚を追加します。 ラップバーより正確な読み取りをサポートします「二次」底辺が揃っているため、棒の値が表示されます。また、ラップされた棒は通常の棒グラフに似ているため、学習曲線が低くなります。
欠点
詰め込まれたバーに対する主な批判は、積み上げ棒これにより、各行のバーが互いに関連していると考えることができます。 潜在的な混乱を軽減するために、積み上げ棒グラフの一般的なスタック間のギャップよりも小さくしましたが、混乱を解消できるかどうかはわかりません。 メリットがそのハードルを上回ることを願っています。
その他の欠点は主にトレードオフであり、上記のオプションを選択することで対処できる可能性があります。 たとえば、ランダムなグレーが気を散らしすぎると思われる場合は、二次バーを別の方法で色付けするか、意図的に単純化してマージすることができます。
注釈付きガイド
この次の写真はあなたのためのものではありません。写真だけを見て投稿をざっと読んだ人向けです。

JMPで試してみる
この取り組みはまだ実験段階ですが、パック棒グラフの最も単純なバリエーションを作成するための JSL スクリプトを添付しました。 JMP 。 これは、まずパッキング ロジックをデータに適用し、合成行番号と色の変数を作成することで機能します。 次に、パック棒グラフの色と配置を使用して、グラフ ビルダーで通常の積み上げ棒グラフを作成します。
どう思いますか?
パックバーは特定の種類のデータに役立つと思いますが、客観的になるにはあまりにも関与しすぎていることに気づきました。 そこで、レイアウト、用語、ラベル付け、色など、この取り組みのあらゆる側面に関するフィードバックを求めています。また、この表示から恩恵を受ける可能性のあるデータをお持ちの場合はお知らせください。私のプロトタイプを使用して試してみることができます。 。私は行ってきましたツイートするより多くの例;興味があればチェックしてください性別別の犬の名前と製品傷害件数。 他のグラフ作成プラットフォームで圧縮棒グラフを作成してみたい場合も、それは素晴らしいことです。
ご覧いただきありがとうございます!
2017 年 8 月の更新: 付属の JMP スクリプトに加えて、パック棒グラフを作成するための Excel アドインと d3.js スクリプトも追加されました。 それらは次の場所で見つけることができます。 Packedbars github エリア。 このアドインは、Excel dataviz の専門家とのコラボレーションを通じて作成されました。ジョン・ペルティエ。 満員バーのポスターが、 IEEE VIS 10月のカンファレンス。 ポスターの提出には、 25秒のプレビュービデオ;音声の代わりにキャプションが付いたアニメーション GIF バージョンが添付されています。
ありがとう、マーク。 パレートといえば、私は最近、値の数が増加するにつれて詰め込まれたバーとパレートを比較するアニメーション GIF を作成しました。

ザン:
あなたのアイデアは Kaiser Fung によって拡張されているようです。バー密度プロット。
バーは解釈しやすいです。 パックされたポリゴンを使用すると、パックされた棒グラフでは細片となる領域を表示できます。 棒密度プロットに納得しているかどうかはまだわかりません...
ps 私は先月、上記の秘密のものを分析して提示するために、詰め込まれたバーを使用しました。 標準的なパレートよりもはるかにうまく機能しました。
聞いてよかったです、マーク -- ありがとう! 実際のデータで試していただきありがとうございます。 パレート アプリケーションと詳細オンデマンドの側面について理解していただけてうれしいです。
私が使用できる匿名化された「秘密のもの」がある場合は、それを渡してください。実用的な例があることは常に良いことです。
ところで、私はチャートのギャラリーをツイートしてきました。
残念ながら、JMP 13 ではバーの間隔を簡単に制御できません。 本当に効果を得たい場合はいくつかのトリックがありますが、それ以外の場合、スクリプトはパックされたバーの外観を近似するだけです。
ザン:
いいね! 何度か実行してみたところ、パレート図の優れた代替手段であることがわかりました。 製造改善の仕事をしています。 私たちは、正しいことに取り組むよう促すために、トップ 10 のグラフをよく使用します。 現在のパレート プラットフォームでは、上位 10 個を確認するには、最後 (n-10) 個の原因を結合する必要があります。 (n-10) 個の原因の詳細は埋もれてしまいます。 詰め込まれたバーにより、ツリーマップの要求に応じて詳細を含む素晴らしいパレートが得られます。

バーの幅や間隔を制御するにはどうすればよいでしょうか? 私のバーには垂直方向の間隔がありました。
この投稿を通じて、興味深い反応が起こりました:)
私の最初の反応は、「これは実際には新しいことではありません。私たちはこれを行ってきました...ああ、待て、いいえ、それは違います...」というようなものを数回続けて言いました。
この手法は、大規模で順序付けられたデータセットに対して多くの可能性を秘めていると思います。 私には、ツリーマップに存在する欠点はすでにツリーマップに固有のものであり、この技術はそれらの欠点を改善しているように思えます。
最初は混乱が生じる可能性が高いと思います。 これとツリーマップ、またはこれと積み上げ棒の違いを聴衆に理解させるのが難しい場合があります。
しかし、これは検討する価値があると思います。私は、標準のツリーマップよりもこの形式でデータをプロットすることを「ずっと」望んでいます。
よくやった。