本文へ移動

Hata旗

国や地域の旗を読み込み、対応する表示の形を選び、絵ごとの資料・作者・ライセンスを保てます。

「旗(はた)」は、旗を表す日本語です。 名前について(英語)

目次

リファレンス · 旗の資料と表示の情報

Framing型

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

How one frame shows a flag, measured so that no frame misrepresents it (pnpm data:framing): a frame keeps a flag's colours when every colour covering at least 5% of the flag still covers at least half that share.

  • own: the flag is that shape already.
  • adapted: a drawing made for that shape by hand, by flag-icons (MIT): Canada's square, with narrower bars. It is its own module, /flags/<code>.1x1 or /flags/<code>.4x3; round uses the square one in a circle.
  • cover: the flag cropped from the centre, which keeps its colours.
  • crop: the flag cropped at the side a person chose for it (crop.at), keeping its colours: the United States' canton and a slice of its stripes, kept at the left. See crop for why.
  • contain: the whole flag, with clear bands (on a neutral disc when round), because a crop would lose a colour or misrepresent the flag.

インポート

import type { Framing } from "@johnmorrisdotca/hata/manifest";

定義

interface Framing {
    method: "own" | "adapted" | "cover" | "crop" | "contain";
    fit: "cover" | "crop" | "contain";
    crop: FramingCrop;
    source: "flag-icons" | null;
    file: string | null;
    page: string | null;
    bytes: number | null;
    coverLoses: string[];
}

メンバー

名前型説明
method"crop" | "cover" | "contain" | "own" | "adapted"

How flag(code, { shape }) frames it: own, adapted, cover, hoist or contain.

fit"crop" | "cover" | "contain"

What frame() does with the flag's own SVG at this shape when its fit is auto: cover (a centre crop), crop (a crop kept at crop.at) or contain (the whole flag).

cropFramingCrop

The crop of this flag at this shape, and how it was chosen; see FramingCrop.

source"flag-icons" | null

Where an adapted drawing comes from (flag-icons); null otherwise.

filestring | null

The adapted drawing's path in the set ("flags/1x1/ca.svg"); null otherwise.

pagestring | null

The adapted drawing on jsDelivr at the set's version; null otherwise.

bytesnumber | null

The adapted drawing's size optimised, in bytes; null otherwise.

coverLosesstring[]

The colours a crop from the centre would lose, as measured ("red 55% to 15%"); empty where it loses none.

例

import { manifest, type Framing } from "@johnmorrisdotca/hata/manifest";

const square: Framing | undefined = manifest("CA")?.framings["1:1"];
console.log(square?.method); // "adapted"
console.log(square?.fit);    // "contain": what frame() does with the flag's own SVG, which cannot use the adapted drawing

const us = manifest("US")?.framings["1:1"];
console.log(us?.fit);         // "crop"
console.log(us?.crop);        // { rule: "curated", at: "left", why: "An emblem sits in a canton at the hoist …", loses: [] }
adapted
contain
crop
{
  rule: 'curated',
  at: 'left',
  why: "An emblem sits in a canton at the hoist and the flag's body runs on from it, so a crop from the left keeps the emblem and a slice of the body, as a hand-drawn square of the flag does; the centre crop shows only the body.",
  loses: []
}

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

ソースを見るGitHub で編集@johnmorrisdotca/hata 1.6.0 のソースから作成しました。

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