web-dev-qa-db-ja.com

色相/彩度を使用して複数の次元を表す

私はこれについて少し前に読んだことを覚えていますが、どこにいるのか忘れてしまったので、1)正しく覚えていることを確認し、2)参考資料(本、研究記事)を見つけようとしています。

次のようなデータの視覚化があるとします。

enter image description here

列はグループ、行はカテゴリです。グループは色相で区切られ、各セルの頻度は彩度で表されます

主な目的は、特定のカテゴリ/グループの組み合わせが他のカテゴリよりも頻繁に発生することを示すことです(飽和を介して)

隣接するオブジェクトに応じて、オブジェクトの知覚特性を変化させる色/明度の恒常性の影響があることを知っています(ドレスの色の錯覚を思い出してください)。

これは、同じ視覚化で色知覚の異なるファセット(つまり、彩度と色相)を使用することにも拡張されますか?言い換えると、特定のセルの飽和度を確認する(その頻度を決定する)場合、その飽和度の認識は、その隣に異なる色相があるという事実によって影響を受けますか?

色相を完全になくして、列を空間的に分離する方が良いのではないかと思います。そのようにして、情報を提供するために1つのカラーディメンション(彩度)のみを使用することに依存していますが、これがすべてを正しく覚えている場合にのみ問題になります

視覚化を改善するための提案は大歓迎ですが、私は主に、色相と彩度の間のこの相互作用が存在するかどうかを理解しようとしています

4
Simon

人間の目は、色空間全体の色相または彩度の変化を均等に認識しません。黄色の色相の彩度の10%の変化は、赤の色相の彩度の10%の変化よりもはるかに見えにくくなります。例えば。彩度の変化を見るよりも、色相または明るさの変化を見る方がはるかに優れています。色相を落とし、代わりに彩度のみに依存するという考えは、基本的に最悪の選択肢です* -しかし、それらの範囲のいずれにおいても、数学的に等しい変動は、等しく異なる色として認識されません。

*(ただし、サンプル画像に基づいて、実際には彩度ではなく値を使用しているように見えます。)

[〜#〜] cielab [〜#〜] 色は、より知覚的に均一な色空間での試みです。色相、彩度、値の代わりに、色を緑から赤のスペクトルに分割します。黄色から青のスペクトル、および明度スペクトル。同じチャートで複数の色軸を使用したい場合は、HSVよりもこれが適しています。

ちょっと待って! Helmholtz-Kohlrausch effect もあります。これは、彩度の高い色が彩度の低い色よりも「明るく」知覚される方法を説明します。 色順応 、隣接する色が知覚される色に影響を与える。および 色の恒常性 ここで、期待値は、知覚される色に影響を与えます。これらすべての厄介な色覚異常の人は言うまでもありません(およそ20人に1人、非常に多くの数です)。

TL; DR目が変です。すべてが他のすべてに影響し、数学が均等に機能することはありません。シンプルにしてください。

あなたの場合:あなたは実際にはいくつかのグループで1つのディメンション(「頻度」)のみをグラフ化しています。グループは位置(それぞれが列)によって区別されるため、グループごとにカラーバリエーションを割り当てる必要はありません。周波数軸として輝度/値を使用して、これを完全にグレースケールで簡単に行うことができます。

3
Daniel Beck

ここにあるものは、実際には色相/彩度を必要としません。

それはたった3つの次元(グループ、カテゴリー、普及)であり、最初の2つはすでに2dグリッドに配置されています。したがって、有病率を表すのに必要な値は1つだけです。白はまれで黒は一般的、またはその逆の場合は、明るさだけを使用するだけで十分です。

おそらく漠然と覚えているのはこのようなチャートです

[ http://www.datagenetics.com/blog/september32012/grid.png ](PINコード普及マップ)

これは実際には1つの次元のみを使用します。黒から赤、そして黄色へのグラデーション。または、風景の高さマップのように、黒から青、緑から茶色に変わることがよくあります。情報の1次元のみですが、色の多様性により、A)より多くのレベルを実装し、B)それらのレベルをより適切に区別し、C)微妙なコンテキスト情報を提供できます。

現在の画像は、色相と明るさを一貫して関連付けていません(つまり、ライトブルーからミディアムパープル、ダークレッドへ)。これは、偏見を示すために使用できます。たとえば、民主的過半数は赤、共和党は青、50/50は白です。本質的に、単一のランプではなく放物線を作成します。

この答えは少し荒いですが、私はそれが理にかなっていると思います。

0
PixelSnader