本文へ移動

Taisen Brackets対戦

対戦の一覧から、トーナメント表をSVGで描きます。

対戦(たいせん)は、二者が向かい合って勝負することです。 名前について(英語)

目次

リファレンス · トーナメント表・表・決勝までの道を描く

TableOptions型

リファレンスの説明と例は英語です。見出しと目次は日本語です。

What bracketTable can be told: the language and words, the round names, a caption and a class.

インポート

import type { TableOptions } from "@johnmorrisdotca/taisen-brackets";

定義

interface TableOptions extends Pick<DrawOptions, "locale" | "words" | "teamName" | "roundNames"> {
    caption?: string;
    className?: string;
}

メンバー

名前型説明
caption (省略可)string | undefined

The table's caption. Default: the summary ("16 teams, 4 rounds").

className (省略可)string | undefined

A class for the <table>. Default tb-table.

roundNames (省略可)readonly string[] | { rounds: readonly { name: string; }[]; } | undefined

Names of the rounds, first round first (or just the last ones). Default: Final, Semi-finals, Quarter-finals, Round of 16…

locale (省略可)string | Locale | undefined

The language: en (the default), fr, ja, es, de, or a Locale you made with defineLocale. Sets the words, the round names, the number and date formats and the lang of the drawing.

words (省略可)Partial<Words> | undefined

Replace any of the language's words.

teamName (省略可)((team: Team, locale: Locale) => string | undefined) | undefined

The name to draw for a team in this language: undefined keeps Team.names[locale] or Team.name. countryName(team.region, locale) makes a country's name from Intl, with no list of your own.

例

import { bracketTable, type TableOptions } from "@johnmorrisdotca/taisen-brackets";

const options: TableOptions = { caption: "Aurora Cup", className: "results" };
console.log(bracketTable([{ sides: ["Aurora", "Harbour"], score: [2, 1] }, { sides: ["Cascade", "Delta"], score: [0, 1] }, { sides: ["Aurora", "Delta"], score: [3, 1] }], options).includes("Aurora Cup"));
true

出力(このページを作ったときに実行した結果)

ソースを見るGitHub で編集@johnmorrisdotca/taisen-brackets 0.20.0 のソースから作成しました。

この日本語は、まだ日本語を母語とする方の確認を受けていません。訂正を歓迎します。