File API → Canvas → async/await
愛猫の写真を読み込み、4枚並べてPNGを保存

猫の手ツールの画像読み込み・配置・保存を学ぶための説明用サンプルです。本番の証明写真ツールやAIの実装をそのまま抜き出したものではありません。

1. 入力を選ぶ

標準はプロジェクト内の愛猫の写真です。入力を送信する処理はありません。内蔵画像はこのHTTPサーバーから取得します。

自分の画像で試す場合（JPEG・PNG・WebP、20 MB以下）

画像を選んだだけでは実行しません。HEIC変換・カメラ・MediaPipeは、このサンプルには含みません。

準備できました。ボタンを押してください。

2. Fileから読み込んだ入力（長辺960 px以内）

3. Canvasで4枚配置したPNG（960×720 px）

まだ実行していません。

Object URLは入力のデコード後と出力の差し替え時に解放します。画像の原本やOS上のファイルは変更しません。保存したPNGに印刷時の実寸は保証しません。