© 2026 NekoMaki
製造業向け
工程・在庫データ可視化デモ
Supabase(PostgreSQL)上に蓄積された工程管理・在庫管理データを、Rechartsを用いてBIダッシュボード形式で可視化するデモページです。EDI連携・cronバッチで日々更新されるデータを想定し、「工程別進捗件数の推移」「品目別在庫数量の推移」「実績/目標比較」「不良要因の内訳」「工程別稼働率」「生産数量と不良率の複合グラフ」など、折れ線・積み上げ面・棒・ドーナツ・レーダー・複合の6種のグラフをサンプル実装しています（表示データはすべてダミーです）。
専用実装 vs 汎用化設計
(a) 専用実装
1つのグラフに特化したクエリ・コンポーネントをそのまま実装。初回は最速・最安。ただしグラフを追加するたびに同程度の実装コストが都度発生します。
(b) 汎用化設計
集計APIをグルーピング軸・期間をパラメータ化し、描画コンポーネントを共通化。初回コストはやや増えますが、2つ目以降のグラフ追加が軽微な工数で済みます。
本デモは(b)を見据え、ChartCardという共通の描画ラッパーを使ってグラフを追加しています。実案件では、集計クエリ側（Supabase View / RPC関数）も同様にパラメータ化することで、フロントエンド・バックエンド双方の汎用化を進める想定です。
工程別 進捗件数の推移（30日間）
EDI連携・cronバッチで集計した各工程の日次完了件数を折れ線で可視化。週末の稼働低下やボトルネック工程の早期発見に活用します。（デモデータ）
品目別 在庫数量の推移（30日間）
主要3品目の実績在庫を積み上げ、合計安全在庫ラインと重ねて表示。品目単位での欠品・過剰在庫リスクを把握できます。（デモデータ）
工程別 実績 / 目標件数（直近7日合計）
各工程の実績件数と目標件数を比較。目標未達の工程を即座に特定できます。（デモデータ）
不良要因の内訳
当月の不良件数を要因別に分解。件数の多い要因から優先的に対策を検討します。（デモデータ）
工程別 稼働率
各工程の稼働率を目標値と重ねてレーダー表示。バランスの偏りを俯瞰できます。（デモデータ）
月次 生産数量と不良率
生産数量（棒）と不良率（線）を1枚に重ねた複合グラフ。生産増加時の品質トレードオフを確認できます。（デモデータ）