座標変換と行列 — 移動・回転・拡大はぜんぶ行列

キャラクターを歩かせる、カメラを振る、木を10本並べる — CGの中の「動かす・置く」は、すべて座標変換という1種類の計算です。その正体はたった4つの数（＋移動ぶんの2つ）でできた行列。数式を眺める前に、まず手で動かして体感しましょう。

1. 図形を動かす3つの基本操作

図形とは点の集まりです。だから「図形を動かす」＝「すべての点 (x, y) を新しい場所 (x′, y′) へ送る」こと。基本の操作は平行移動・回転・拡大縮小の3つで、どれも同じ形の式に収まります。

x′ = a·x + b·y + tx　　y′ = c·x + d·y + ty 4つの数 a, b, c, d（＝2×2行列）が回転・拡大・せん断を、(tx, ty) が平行移動を受け持つ

下のプレイグラウンドでスライダーを動かすと、左上の行列の中身がリアルタイムに変わるのが見えます。「図形いじり」と「数いじり」が同じものだと実感してください。

2D変換プレイグラウンド — 家を動かすと行列が変わる
灰色の点線＝元の家、青＝変換後。回転や拡大では行列の4つの数が動き、移動ではベクトル (tx, ty) だけが動きます。ここでは「拡大 → 回転 → 移動」の順に適用しています。
POINT — 変換は「合成」できる 変換を続けて行うことは、行列を掛け算して1個にまとめることと同じ。100個の変換を重ねても、まとめてしまえば点1個あたりの計算は1回分。ゲームのキャラが何段も関節を曲げてもすぐ描けるのは、この性質のおかげ。

2. 順序が命 — 「回して動かす」と「動かして回す」は別物

合成には大事な落とし穴があります。行列の掛け算は、順番を入れ替えると結果が変わるのです。同じ「45°回転」と「右へ2進む」でも、どちらを先にやるかで家の着地点はまったく違います。再生して見比べてください。

合成順序の比較 — 同じ2つの操作、ちがう結果
回転はいつも原点のまわりで起こることに注目。左（A）は原点にいるうちに回るのでその場で向きだけ変わりますが、右（B）は先に原点から離れたため、回転で原点のまわりを大きく振り回されます。
注意 — 行列の積は交換できない（A·B ≠ B·A） ふつうの数なら 2×3 = 3×2 だが、行列は掛ける順番そのものが「操作の順番」なので入れ替え禁止。3DCGで「モデルを自転させてから公転させる」つもりが逆になっていた — は定番のバグ。

3. 行列の正体 — 「基底ベクトルの行き先」を書いたメモ

ではなぜ、たった4つの数で回転もせん断も表せるのでしょう。実は行列とは、2本の矢印 e₁=(1,0) と e₂=(0,1) がどこへ行くかを書いたメモです。e₁ の行き先が1列目 (a, c)、e₂ の行き先が2列目 (b, d)。残りのすべての点は、この2本に「引きずられて」格子ごと変形します。

基底ベクトルと格子の変形 — 行列を「見る」
オレンジ＝e₁ の行き先 (a, c)、緑＝e₂ の行き先 (b, d)。青い平行四辺形は「元の1×1マス」の変形後で、その面積が det（行列式）。det が負になると図形が裏返ります。プリセットボタンはアニメ付きです。
回転行列：x′ = x·cosθ − y·sinθ　　y′ = x·sinθ + y·cosθ 基底の行き先で読むと、e₁ → (cosθ, sinθ)、e₂ → (−sinθ, cosθ)。2本の矢印が確かに θ だけ回っている

4. 3Dでも話は同じ — 回転行列の積で立方体を回す

3Dになっても増えるのは数だけで、考え方は同じです（2×2 → 3×3）。回転はX・Y・Z軸まわりの3つの回転行列の積で表せます。この3つの角度をオイラー角と呼びます。もちろんここでも掛ける順序が結果を変えます。

3D回転 — オイラー角 α, β, γ で立方体を回す
面の色は向きの目印（青＝前後、緑＝左右、オレンジ＝上下）。左上の3×3が、3つの回転行列を掛け合わせた「いまの回転」R。頂点8個すべてに、この同じ R が掛けられています。
一歩先へ — 同次座標という発明 ここまで平行移動だけ行列の外に置いてきたが、座標を (x, y, 1) と1つ水増しすると、平行移動まで行列の中に入る（2Dなら3×3、3Dなら4×4）。GPUが頂点ごとに掛けているのはこの4×4行列で、モデルの配置・カメラ・投影（レッスン03）まで全部が1個の行列に合成されている。

5. まとめ — 「動かす」はぜんぶ行列

次のレッスンでは、この行列の総仕上げ — 3Dの世界を2Dの画面に映す透視投影を扱います。