比較・差分Bar / Column Chart難易度: 簡単
棒グラフ(比較)
一言でわかる可視化ポイント
「どこが抜きんでているか」「どれが一番小さいか」の大小をズバッと比較する
項目ごとの数値を長さ・高さで表現します。人間は「線の長さの差」を最も直感的に把握できるため、売上No.1店舗や人気商品順位の比較に最適です。
インタラクティブプレビュー
東京
大阪
No.1 名古屋
福岡
※マウスホバーやクリックでアニメーションや数値の変化を確認できます。
おすすめHTML/CSSカラーパレットサンプル
ダッシュボードの視認性を高めるためのカラーコード例です。グラフで最も伝えたい要素にイエローなどのアクセントカラーを割り当て、比較対象にはダークカラーを使用します。
通常バー
基本項目
#3F3F46HEX
1位・ハイライト
注目させる1番手
#FACC15HEX
ワースト・注意
目標未達の項目
#EF4444HEX
こんな可視化に向いている(GOOD)
- 全10店舗の当月売上ランキング比較
- 商品カテゴリ別の販売数量比較
- 部署ごとの残業時間比較
やってはいけないNGパターン(BAD)
- 縦軸(Y軸)のスタート位置を0以外にして差を過剰に誇張すること
- 項目が50個以上あり横幅に収まりきらない状態
標準機能で対応しているおすすめBIツール
Looker StudioPower BIMetabaseRedash
Looker StudioからRetoolまで!BIツール比較ガイドを読む