大会ブラケットメーカー

参加者の名前を1行ずつ貼りつけると、シングルエリミネーション（勝ち抜き）のトーナメント表を自動で組むツールです。勝った側のカードをクリックすると次のラウンドへ名前が上がり、完成した表はPNG画像として保存できます。大会当日に組み合わせ表を用意する時間がない、という場面のために作りました。

こんなときに使う

• 当日集まった人数でその場でトーナメントを組みたいとき
• 参加者が8人や16人ちょうどではなく、不戦勝の割り振りに迷うとき
• 進行しながら勝ち上がりを反映し、その画面を配信に映したいとき
• 結果の表をそのまま画像で共有・アーカイブしたいとき

使い方

1. 入力欄に参加者名を1行に1名ずつ貼りつけます。「サンプルを入れる」で8チームの例を試せます。
2. 入力欄の下に「◯名 → ◯枠（不戦勝 ◯）」と出るので、枠数と不戦勝の数を確認します。
3. 「そのまま作成」か「シャッフルして作成」を選びます。後者は並び順をランダムに入れ替えてから組みます。
4. 各試合のカードのうち、勝った側をクリックします。名前が次のラウンドの枠に入ります。
5. 上部の大会名を書き換え、「PNG保存」で画像として書き出します。やり直すときは「勝敗リセット」または「作り直す」を押します。

仕様と機能

項目	内容
参加人数	2名以上。上限は設けていません
枠数	参加人数以上で最小の2のべき乗（例：11名なら16枠、不戦勝5）
並び順	標準シード順（1-8-4-5-2-7-3-6…）を再帰的に生成し、余った枠＝不戦勝を上位シード側に寄せます
不戦勝	対戦相手がいない枠は「不戦勝」と表示され、相手側は自動で次のラウンドへ進みます
同名の扱い	同じ名前が複数あると「名前 (2)」のように連番を付けて一意化します
勝敗の記録	「ラウンド-試合番号」をキーに勝者名を保持。上流の勝者が変わると、その先の選択は自動的に無効化されます
表示	カードは絶対配置、接続線はSVGのパス。1枠あたり縦60ピクセル、カードは190×44ピクセル
PNG保存	同じレイアウト計算をCanvasで描き直して書き出し。端末の画素密度は最大2倍まで反映
ファイル名	大会名の空白をアンダースコアに置き換えたもの（未入力なら bracket.png）
保存	記録の保存先はありません。ページを再読み込みすると内容は消えます

決勝の枠は優勝者の表示専用で、クリックできません。優勝が決まると画面上部にも優勝者の帯が出ます。

作るときに決めたこと

いちばん手を入れたのは、参加者が2のべき乗でないときの不戦勝の置き方です。単純に後ろから余りを詰めると、不戦勝が表の下半分に固まって片側だけが楽に勝ち上がる表になります。そこで標準シード順を生成し、余った枠を上位シード側から順に不戦勝として割り当てる形にしました。名簿の並びに意味を持たせたくない場合のために「シャッフルして作成」を用意してあります。

勝敗の持ち方も設計上の分かれ道でした。各ラウンドの状態を直接書き換える方式だと、1回戦の勝者を押し間違えて修正したときに、その先の枠に古い名前が残ります。今回は勝者の選択だけを「ラウンド-試合番号」で保持し、表全体は毎回そこから導き直す形にしました。導出の際に「選ばれた名前が今のカードに実在するか」を検査しているので、上流を直せば下流は自動的に空欄へ戻ります。進行中の修正が事故にならないことを優先しました。

PNG保存では、画面のスクリーンショットを撮るのではなく、表示と同じレイアウト計算の結果をCanvasに描き直しています。外部のライブラリに頼らずに済み、画面外にはみ出したぶんも含めて表全体が1枚に収まるからです。長い名前はCanvas側で幅を測って末尾を「…」に詰めています。

保存機能は入れませんでした。大会表は当日その場で作って画像にして配るもの、と割り切ったからです。同じ理由で、敗者復活やグループステージ、スコアの記入といった機能もありません。ここまで入れると「大会運営ツール」になり、1画面で完結する軽さが失われます。

注意点

• 対応するのはシングルエリミネーションのみです。ダブルエリミネーションやリーグ戦、3位決定戦には対応していません。
• 入力内容や勝敗は保存されません。ページを閉じたり再読み込みしたりすると最初からになります。作業が終わったらPNG保存で書き出してください。
• 参加人数が多いほど表は縦横に広がります。極端な人数では画面上での閲覧もPNGの取り回しも重くなります。