画像回転・反転の幾何学:座標変換行列とEXIFメタデータの物理的正規化
画像の回転や反転は、2次元ユークリッド空間における線形アフィン変換です。スマートフォンで縦向きに撮影した写真がPCで横向きに表示されてしまう現象の修正や、自撮り写真の左右反転、スキャンした書類の傾き補正など、画像の空間座標系を再構築する操作は日常のデジタルワークフローで頻繁に発生します。
ラスター画像(ビットマップ)は、メモリ上に連続して配置されたピクセル配列です。画像を回転させる際、元画像の座標 $(x, y)$ を新しい出力座標 $(x', y')$ へ写像します。その数学的基盤となるのが2次元回転行列です:
[y'] = [sin θ cos θ] [y]
画像中心 $(c_x, c_y)$ を基準に回転させる場合、一度座標を中心へ平行移動(Translate)させた後に回転行列を乗算し、再び新しいキャンバスの中央へ戻す処理を行います。
直交回転(90度・180度・270度):画質劣化ゼロの離散座標置換
90度、180度、270度(反時計回り90度)の回転は、数学的に極めて特別な性質を持ちます。回転角度 $ heta$ が90度の倍数の場合、三角関数値は厳密に $\sin heta \in \{0, 1, -1\}$、$\cos heta \in \{0, 1, -1\}$ の整数値のみをとります。したがって、小数の端数が発生せず、すべてのピクセルが新しい出力格子の整数座標へ1対1で完全に写像されます:
- 時計回り90度回転(90° CW): 寸法は $W' = H$、$H' = W$ へ入れ替わります。座標変換式は $x' = H - 1 - y$、$y' = x$ となります。
- 180度回転(180°): 寸法は変わらず $W' = W$、$H' = H$ です。座標変換式は $x' = W - 1 - x$、$y' = H - 1 - y$ となります。
- 反時計回り90度回転(270° CW): 寸法は $W' = H$、$H' = W$ へ入れ替わります。座標変換式は $x' = y$、$y' = W - 1 - x$ となります。
この直交回転では補間演算(ピクセルの平均化や色混ぜ)が一切発生しないため、元の解像感、エッジの鋭さ、色彩情報が100%劣化なし(完全ロスレス)で保たれます。
任意角度の回転:バウンディングボックスの拡張とバイキュービック補間
スキャンした書類のわずかな傾き(例: 2.5度の傾斜)を補正する場合、長方形の四隅が外側へ飛び出します。画像の角が切り落とされるのを防ぐため、出力キャンバスの幅と高さを新しい外接長方形の大きさに自動拡張します:
新キャンバス高さ H' = |W × sin θ| + |H × cos θ|
任意角度の回転では座標がピクセルとピクセルの間に位置するため、高品質なバイキュービック補間を用いて滑らかな輪郭を生成し、斜め線のジャギーを徹底的に防ぎます。傾いた画像の周囲に生じる三角形の余白領域は、PNGやWebP保存時にアルファ透明度($A = 0$)として出力され、背景を汚しません。
なぜスマホ写真が横向きになるのか?EXIF Orientationタグの落とし穴
iPhoneやAndroidスマートフォンで縦向きに撮影した写真が、Webサイトにアップロードした途端に横向きや逆さまになってしまう最大の原因は、EXIF(Exchangeable Image File Format)のOrientationメタデータ(タグID 0x0112)にあります。
スマホのカメラセンサーは物理的には横長の構造をしています。縦向きに構えて撮影した際、スマホのCPUは数千万画素のピクセルデータを物理的に回転させるとバッテリーを消費し保存が遅くなるため、ピクセルデータは横向きのまま記録し、ヘッダーに「この写真は90度右に回転して表示せよ(値: 6)」というタグ情報だけを書き込みます。
しかし、このEXIFタグを解釈できないWeb掲示板、公的申請ポータル、古いブラウザ、一部の印刷機などでは、タグが無視されて横向きの生データがそのまま表示されてしまいます。当ツールで回転を実行すると、ブラウザのCanvasメモリ上でピクセルデータそのものを物理的に回転させ、EXIFの向きフラグを標準の「1(通常)」に書き換えます。これにより、どんな端末やシステムで開いても永久に正しい向きで表示されるようになります。
水平・垂直のミラー反転(フリップ)
回転と反転は幾何学的に明確に区別されます。回転は図形の左右関係を保ちますが、反転は鏡像反転を行います:
- 水平反転(左右ミラー): 垂直中心線を軸に左右を入れ替えます($x' = W - 1 - x$)。インカメラ(フロントカメラ)で撮影した自撮り写真を、日常の鏡で見る自然な見た目に合わせる際に使われます。
- 垂直反転(上下ミラー): 水平中心線を軸に上下を反転させます($y' = H - 1 - y$)。水面の反射エフェクトやクリエイティブなグラフィックデザインに最適です。
安心の完全クライアントサイド実行:プライバシー保護
個人の肖像写真、身分証スキャン、書類の撮影データなどを回転させる際、クラウドサーバーへファイルをアップロードすることはプライバシー侵害のリスクを伴います。当サイトの画像回転ツールは、HTML5 CanvasとJavaScriptを活用し、すべての画像処理をお使いの端末ローカル環境(ブラウザ内メモリ)で完結させています。ファイルデータが外部サーバーへ送信されることは一切ありませんので、機密性の高い画像でも安心して安全にご利用いただけます。