web-dev-qa-db-ja.com

選択範囲よりも長い固定範囲を持つX軸を持つグラフを設計するにはどうすればよいですか?

X軸がキャンペーンの日数を表し、常に31日を表示するグラフを含むWebベースの分析ダッシュボードを設計しています。ただし、キャンペーンの期間は異なります。 1日から31日までの任意の期間に事前定義できます。
キャンペーンの期間が31日より短い場合は、グラフのどの領域が関連しているかを明確にしたいと思います。
このシナリオの既存のベストプラクティスソリューションはありますか?
私が考えていることの1つは、不要な領域をグレー表示することです(下の画像を参照)。 A bar chart with a 31-days x-axis that shows a 7-days long campaign

グラフの幅は固定されており、31日間の範囲を表示するように最適化されています。 X軸の日数を変更するのではなく、画面上に1つの浮動ドットまたはバーが表示されたり、複数のデータポイントがあり、それらの間に大きなスペースがある(以下の画像を参照)シナリオを回避します。 A bar chart with a 7-days x-axis that shows a 7-days long campaignA bar chart with a 3-days x-axis that shows a 3-days long campaign

1
Daphna S

データのないゾーンを強調せずに、キャンペーン(およびその期間)を強調する機会があります。

持続的なスケールを維持したい場合は、キャンペーン期間をグラフィックでラベル付けする代わりに焦点を当て、キャンペーンの長さを明示的に示すテキストラベルを追加できます。

このようにして、ユーザーが前のキャンペーンに合わせて前後に移動できる場合、ラベルと長さを示す視覚的なインジケーターがあります。

enter image description here

そうすれば、キャンペーンの日数を頭で数える必要がなくなり、さらにいくつかのコンテキストを提供できます。

  • 「5日間のキャンペーンでxyに費やしました」

ユースケースについてはあまり知りませんが、キャンペーンの総リソースとキャンペーン期間のバランスを理解することが重要な場合は、タイトルまたはヘッダーに配置できます。

enter image description here

カテゴリ全体の合計数は、1つの文として読み取ることができます。

enter image description here

4
Mike M

ノイズの量を減らし、データを中心的なステージに置く必要があるデータ視覚化設計の一般的な原則のいくつかを適用する場合は、次の戦略を検討してください。

  • 異なるキャンペーンを並べて比較する必要がない限り、大きなチャンクを灰色で表示するのではなく、グラフをデータで埋めることが推奨されます。
  • アクティビティの「ライブ」アップデートを提供する必要があり、アクティビティの視覚的な一貫性を維持したい場合を除き、キャンペーンの長さの範囲を固定する必要はありません。
  • 正確な日付を表示することが重要でない限り、別の方法として、キャンペーンの開始日を表示し、キャンペーンの終了までキャンペーンの日付情報を1日目、2日目などに切り捨てることもできます。
  • アクティビティ値が目立たず、時間でリンクされていない場合を除き、棒グラフよりも傾向を明確に示すことができる折れ線グラフを使用することを検討できます。
1
Michael Lai