身長比較画像メーカー — 使い方

できること

複数の人物の身長を並べて比較する画像を、ブラウザ上で作成できます。名前・身長・色を
自由に指定でき、作成した画像は保存・共有できます。すべての処理はブラウザ内で完結し、
入力内容や画像がサーバーに送信・保存されることはありません。

使い方

画面は「画像」「設定」「データ」「簡易記法」の4タブです。「設定」で単位とサイト名表示を選び、
「データ」で人物を編集し、「画像」で結果を確認・保存します。

  1. 身長比較画像メーカー を開きます。
  2. フォームに名前と身長を入力し、「追加」で人物を増やします。色も指定できます。
  3. 入力に応じてプレビュー画像がリアルタイムで更新されます。上段が「指定した順」、
    下段が「背の順」に並んだ2パネル構成です。
  4. 各行の「↑」「↓」で並べ替え、「削除」で除去できます。
  5. 「単位切替」で cm と ft/in(フィート・インチ)入力を切り替えられます。
    切り替えると入力済みの人物データは新単位へ変換されず破棄されます。
  6. 画像のサイト名表示を選び、「画像を新規タブで開く」で画像を表示・保存できます。「データ共有URLをコピー」で、いまの構成を
    復元できる URL をクリップボードにコピーします。「共有」は端末の
    共有シートに画像と URL を渡します(Web Share API 対応時のみ表示。ファイル添付が
    使えない環境では URL とテキストだけを共有します)。

仕様

共有URL

現在の構成は URL に反映され、その URL を開くと同じ構成が復元されます。
共有URLには #v1:… が含まれ、共有・ブックマークに使えます。
#v1: の中身は「簡易記法」タブの全文を圧縮したものです。

簡易記法

設定と人物データをまとめて編集できます。身長は表示単位にかかわらず cm で指定します。

unit: cm
watermark: show

たろう | 170 | #7c9eff
はなこ | 160 | #ffb86b

入力範囲

項目 範囲
身長(cm モード) 1〜1000、1 刻み
フィート(ft/in モード) 0〜9、整数
インチ(ft/in モード) 0〜11、整数

数値でない入力や 0 以下の入力は追加時に無視されます。

単位(cm / ft/in)

  • 単位は開いたときに決まり、その後は「単位切替」でのみ変わります。 使用中に
    入力済みの身長を単位間で自動変換して持ち替えることはありません。
  • 内部の保持値は常に cm です。 ft/in は入力の取り込みと表示のときだけ
    換算し、ft/in 表示は 最も近い整数インチに丸めます(丸めた結果インチが12に
    なった場合はフィートを1繰り上げます)。
  • 「単位切替」は入力済みの人物データを新しい単位へ変換せず、すべて破棄して
    作り直します
    (確認ダイアログを挟みます)。cm で入れた端数を ft/in の整数入力へ
    無理に当てはめないための挙動です。
  • 目盛りは cm モードでは 5cm / 10cm 刻み、ft/in モードでは 3インチ / 1フィート刻みで表示します。

出力画像

  • 人数や身長にかかわらず、外枠は固定サイズ(880×820、書き出し時は2倍の 1760×1640 PNG)。
    内容はこの固定フレームに収まるよう拡縮・詰め込みされます。
  • 名前は各人物の胴体内に描画されます。日本語などCJK文字を含む名前は1文字ずつ縦書き、
    ラテン文字(英語など)の名前は90度回転して1行で描かれ、横書きのまま読めます。
  • 身長は頭上ではなく、胴体内の名前の下に括弧付きで表示されます。表示単位に応じて
    (166cm) または (5'5") のような表記を時計回りに90度回転して描きます。
  • 右下に Made with abstiro.com のウォーターマークが入ります。画像上の選択肢で表示・非表示を切り替えられます(既定は表示)。
  • 新規タブでは生成画像を表示します。画像を保存する場合はブラウザーの画像保存機能を使います。

共有

  • 「データ共有URLをコピー」: 現在の構成を復元できる URL を
    クリップボードにコピーします。すべての環境で使えます。
  • 「共有」: navigator.share に画像 PNG と現在の URL・テキストを渡します。Web Share API
    非対応のブラウザではボタンを表示しません。ファイル添付に対応しない環境(デスクトップ等)
    では URL とテキストだけを共有します。共有をキャンセルしても何も起きません。
  • どちらもツール側からサーバーへは何も送信しません(共有先アプリに渡すだけ)。