รูปปกกระดานดำชอล์กสีเรื่องทำความรู้จัก Matrix

1. 🎯 ตอนที่ 11: ทำความรู้จัก Matrix: ตารางเก็บข้อมูลมหาศาล

2. 📖 เปิดฉาก (The Hook)

สวัสดีครับนักสร้างโลกจินตนาการทุกคน! ยินดีต้อนรับกลับสู่โรงงานผลิตภาพในซีรีส์ ปูพื้นฐานคณิตศาสตร์สู่โลกคอมพิวเตอร์กราฟิก ครับ

ใน 10 ตอนที่ผ่านมา เราได้เล่นสนุกกับ Vector ที่เป็นเสมือน “ลูกศรนำทาง” ในโลก 3 มิติกันมาอย่างจุใจแล้ว แต่ถ้าคุณต้องสร้างเกมที่มีตัวละคร โพลิกอนนับล้านชิ้น และแต่ละชิ้นต้องมีการหมุน ย่อขยาย หรือย้ายตำแหน่งในทุกๆ เฟรมเรต การมานั่งเขียนสมการคณิตศาสตร์ทีละบรรทัดเพื่ออัปเดตตำแหน่งของจุด (Vertex) ทุกจุด คงเป็นฝันร้ายของโปรแกรมเมอร์แน่นอนครับ

วันนี้พี่จะพาไปทำความรู้จักกับสุดยอดอาวุธของชาวกราฟิก สิ่งที่เปลี่ยนสมการอันยืดยาวชวนปวดหัว ให้กลายเป็นตารางตัวเลขแสนกะทัดรัด สิ่งนั้นเปรียบเสมือน “คัมภีร์เวทมนตร์” ที่รวบรวมคาถาแปลงร่างทั้งหมดไว้ในที่เดียว… ขอต้อนรับเข้าสู่โลกของ “เมทริกซ์ (Matrix)” ครับ!

3. 🧮 จากตัวเลขสู่กราฟิก (Math to Graphics Foundation)

ในทางคณิตศาสตร์สาขาพีชคณิตเชิงเส้น (Linear Algebra) Matrix คือตารางหรือโครงสร้างอาร์เรย์แบบ 2 มิติ (Rectangular array) ที่เอาตัวเลขมาเรียงกันเป็นแถว (Rows) และคอลัมน์ (Columns) โดยเราจะระบุขนาดของมันด้วยจำนวนแถวคูณจำนวนคอลัมน์ หรือ $m \times n$

จุดกำเนิดของมันน่าสนใจมากครับ ในยุคก่อน ถ้าเรามีระบบสมการเชิงเส้น (System of Linear Equations) สัก 3 สมการและ 3 ตัวแปร หน้าตามันจะรุงรังแบบนี้: $$ 2x_1 + 3x_2 + 4x_3 = 19 $$ $$ 4x_1 + 11x_2 + 14x_3 = 55 $$ $$ 2x_1 + 8x_2 + 17x_3 = 50 $$ นักคณิตศาสตร์จึงคิดค้นสัญลักษณ์แบบ Matrix ขึ้นมาเพื่อลดความน่าเบื่อในการต้องมานั่งเขียนตัวแปร $x$, $y$, $z$ และเครื่องหมาย $=$ ซ้ำแล้วซ้ำเล่า โดยการยุบสมการทั้งหมดให้เหลือเพียงแค่รูปฟอร์มสั้นๆ คือ $A\mathbf{x} = \mathbf{b}$: $$ \begin{bmatrix} 2 & 3 & 4 \ 4 & 11 & 14 \ 2 & 8 & 17 \end{bmatrix} \begin{bmatrix} x_1 \ x_2 \ x_3 \end{bmatrix} = \begin{bmatrix} 19 \ 55 \ 50 \end{bmatrix} $$ นี่แหละครับคือพลังของ Matrix! มันคือตัวแทนของชุดสมการที่จับมามัดรวมกันอยู่ในตารางเดียว ทำให้เราสามารถจัดการข้อมูลมหาศาลได้อย่างเป็นระเบียบและเป็นระบบ

รูปประกอบการยุบสมการเชิงเส้นให้กลายเป็น Matrix

4. 📐 เจาะลึกเรขาคณิตและการประมวลผลภาพ (Geometry & Image Processing)

แม้ว่าในวิชาเลขเราจะมอง Matrix เป็นแค่ “กล่องใส่ตัวเลข” แต่สำหรับพวกเราสาย Computer Graphics เราจะมอง Matrix ในมุมมองทางเรขาคณิตครับ เรามองว่า Matrix คือ “ตัวแทนของการแปลงพิกัด (Coordinate Space Transformation)”

ลองจินตนาการว่าคอลัมน์ (หรือแถว) แต่ละเส้นใน Matrix ขนาด $3 \times 3$ ก็คือเวกเตอร์ 3D หนึ่งเส้น หากเราเอาเวกเตอร์ฐานมาตรฐาน (Standard Basis Vectors) อย่างแกน $X$, $Y$, และ $Z$ ไปคูณกับ Matrix ผลลัพธ์ที่หลุดออกมาก็คือ “คอลัมน์ของ Matrix” นั้นๆ เลย! นั่นหมายความว่า ตัวเลขในตาราง Matrix ก็คือ “ทิศทางใหม่ของแกน X, Y, Z หลังจากถูกใช้เวทมนตร์แปลงร่างแล้ว” การคูณเวกเตอร์ตำแหน่งเข้ากับ Matrix จึงเป็นการบังคับให้จุดเหล่านั้นย้ายไปอยู่ในมิติใหม่ที่แกนบิดเบี้ยวหรือขยายออกไปตามที่เรากำหนด (Linear Transformation) นั่นเองครับ!

5. 🎮 เวทมนตร์นี้ในโลกความจริง (Real-World Game Applications)

ใน Game Engine ระดับโลกอย่าง Unity หรือ Unreal คุณจะแทบไม่เห็นการเขียนสมการเส้นตรงตรงๆ เลย แต่เราจะจับทุกอย่างยัดใส่ตาราง $3 \times 3$ หรือ $4 \times 4$ Matrix เสมอ เพราะอะไรน่ะหรือครับ?

  1. เวทมนตร์ $4 \times 4$ (Homogeneous Matrix): แม้โลกเราจะเป็น 3 มิติ และใช้ Matrix $3 \times 3$ เพื่อทำการหมุน (Rotation) หรือย่อขยาย (Scale) ได้อย่างสมบูรณ์แบบ แต่ตาราง $3 \times 3$ มีข้อเสียร้ายแรงคือ มันไม่สามารถทำเรื่องพื้นฐานอย่างการ “เลื่อนตำแหน่ง (Translation)” ได้ (เพราะเวกเตอร์ศูนย์คูณอะไรก็ได้ศูนย์เสมอ) นักพัฒนาเกมจึงใช้ตาราง $4 \times 4$ เข้ามาแก้ปัญหา โดยเพิ่มมิติที่ 4 ($w$) เข้ามาเป็นตัวหลอก ทำให้เราสามารถคำนวณการเลื่อน ย่อ ขยาย และหมุน ได้ครบจบในตารางเดียว (Affine Transformation)
  2. การยุบรวมเวทมนตร์ (Matrix Concatenation): สมมติว่าในเกมมีการขยับนิ้วมือ ซึ่งนิ้วติดอยู่กับมือ มือติดกับแขน อาร์มติดกับลำตัว ลำตัวติดกับโลก แทนที่เราจะต้องเอาพิกัดนิ้วมาแปลงตำแหน่งทีละขั้นตอน เราสามารถจับ Matrix ของทุกชิ้นส่วนมา “คูณรวบยอด” กลายเป็น Matrix ก้อนเดียวเบ็ดเสร็จ (Composite Matrix) เพื่อลดภาระการคำนวณของ CPU ได้อย่างมหาศาลครับ!

6. 🏭 เปิดโรงงานผลิตภาพ (The Graphics Pipeline)

หากเรามุดเข้าไปดูในสถาปัตยกรรมของ GPU (Graphics Processing Unit) สมัยใหม่ คุณจะพบว่ามันมีหน่วยประมวลผลขนาดเล็กนับพันตัวที่ถูกออกแบบมาโดยเฉพาะเพื่อทำ “การคูณ Matrix กับ Vector” ทีละหลายๆ ล้านครั้งต่อวินาที!

กระบวนการวาดภาพ 3 มิติ (Graphics Pipeline) อาศัยลำดับการคูณ Matrix อย่างเป็นระบบ:

  1. Model Matrix: แปลงพิกัดของโมเดลจากจุดศูนย์กลางตัวเอง ให้ออกไปวางอยู่บนโลก 3 มิติ
  2. View Matrix: แปลงพิกัดโลกทั้งหมด ให้มาอยู่ตรงหน้ามุมกล้อง (Camera Space)
  3. Projection Matrix: บีบอัดภาพ 3 มิตินั้น ให้มีเอฟเฟกต์ความลึกตื้น (Perspective) ก่อนจะแบนราบลงบนจอภาพ ทั้งหมดนี้ GPU ทำงานโดยเอาพิกัด Vertex ของเรามาคูณทะลวงผ่าน $M_{projection} \times M_{view} \times M_{model} \times \mathbf{v}_{local}$ กลายเป็นพิกัดบนหน้าจอในพริบตาเดียว!

7. 🏁 บทสรุป (Level Cleared!)

เห็นไหมครับว่า Matrix ไม่ใช่แค่ตารางตัวเลขน่าเบื่อในวิชาเลข แต่มันคือ “คัมภีร์เวทมนตร์” ที่ช่วยเราย่อโลกของสมการเชิงเส้นอันยืดยาวให้กลายเป็นโครงสร้างข้อมูลสุดกะทัดรัด แถมยังเป็นภาษาที่ฮาร์ดแวร์กราฟิก (GPU) โปรดปรานที่สุดอีกด้วย!

ในตอนต่อไป เราจะมาเจาะลึกถึง “การคูณเมทริกซ์ (Matrix Multiplication)” ว่ามันทำงานอย่างไร ทำไมมันถึงสลับที่ไม่ได้ และเราจะเอาตารางเวทมนตร์เหล่านี้มาผสมรวมกันได้อย่างไร เตรียมกระดาษทดไว้ให้พร้อม แล้วพบกันใหม่ Level Cleared!

สนใจพูดคุยแลกเปลี่ยนเทคนิคการพัฒนาเกม คอมพิวเตอร์กราฟิก หรือออกแบบระบบซอฟต์แวร์? ทีมงาน WP Solution พร้อมให้บริการออกแบบและพัฒนาซอฟต์แวร์แบบครบวงจร ดูรายละเอียดบริการของเราได้ที่: www.wpsolution2017.com หรือพูดคุยปรึกษาเบื้องต้นได้ที่ Line: wisit.p