รูปปกกระดานดำชอล์กสีเรื่องการคูณเมทริกซ์

1. 🎯 ตอนที่ 12: การคูณ Matrix: เมื่อมิติถูกบิดเบือน

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

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

ในตอนที่แล้ว เราได้ทำความรู้จักกับ Matrix ในฐานะ “ตารางเก็บข้อมูล” ไปแล้ว หลายคนคงยังจำฝันร้ายสมัยเรียนมัธยมได้เวลาที่คุณครูสั่งให้ “คูณเมทริกซ์” ที่ต้องเอานิ้วลาก “แถวคูณหลัก (Row times Column)” จับตัวเลขมาคูณแล้วบวกกันจนตาลายใช่ไหมครับ?

แต่รู้หรือไม่ครับว่า… เบื้องหลังการคูณตัวเลขที่ดูน่าเบื่อหน่ายเหล่านั้น มันคือแก่นแท้ของเวทมนตร์ที่เรียกว่า “การแปลงรูปร่าง (Transformation)”! ในโลกของ Computer Graphics การที่เราเอา Matrix มาคูณกัน มันไม่ใช่แค่การคำนวณทางคณิตศาสตร์ แต่มันคือการบิดเบือนมิติ ยืด หด หมุน และเหวี่ยงวัตถุ 3 มิติให้ไปปรากฏอยู่บนหน้าจอของเราครับ วันนี้พี่จะพาไปดูว่า กฎการคูณที่ชวนปวดหัวนี้ กลายมาเป็นคาถาเสกโลกใน Game Engine ได้อย่างไร!

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

ก่อนจะไปร่ายเวทมนตร์ เราต้องมาทบทวน “กฎการคูณเมทริกซ์ (Matrix Multiplication)” กันก่อนครับ สมมติว่าเราต้องการคูณเมทริกซ์ $A$ และ $B$ เพื่อให้ได้เมทริกซ์ผลลัพธ์ $C$ ($C = AB$) กฎเหล็กที่สำคัญที่สุดคือ: จำนวนคอลัมน์ (Columns) ของเมทริกซ์ $A$ ต้องเท่ากับจำนวนแถว (Rows) ของเมทริกซ์ $B$ เสมอ!

วิธีการคำนวณค่าในแต่ละช่องของ $C$ เกิดจากการทำ Dot Product ระหว่าง “แถวของ $A$” และ “คอลัมน์ของ $B$”, ยกตัวอย่างเช่น ค่า $c_{ij}$ (แถวที่ $i$ คอลัมน์ที่ $j$) จะคำนวณได้จาก: $$ c_{ij} = \sum_{k=1}^{n} a_{ik}b_{kj} $$ เปรียบเสมือนการเอาลูกศรแนวนอนของ $A$ มาประกบกับลูกศรแนวตั้งของ $B$ แล้วจับคู่คูณบวกกันไปเรื่อยๆ ครับ

ข้อควรระวังปราบเซียน: ในโลกของ Matrix การสลับที่การคูณจะให้ผลลัพธ์ที่ไม่เท่ากัน! (Not Commutative) นั่นคือ $AB \neq BA$, เสมือนว่าคุณใส่เสื้อก่อนใส่เสื้อหนาว ย่อมให้ผลลัพธ์ไม่เหมือนกับใส่เสื้อหนาวก่อนใส่เสื้อข้างในครับ

รูปในบทความกระดานดำชอล์กสีเรื่องการคูณเมทริกซ์

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

แล้วการคูณ “แถวคูณหลัก” นี้มันไปเกี่ยวอะไรกับการบิดเบือนมิติล่ะ? คำตอบจะปรากฏเมื่อเรานำเมทริกซ์มาคูณกับ เวกเตอร์ (Vector) ครับ!

ลองมองว่าเวกเตอร์พิกัด $\mathbf{x}$ เป็นเสมือน “ข้อมูลขาเข้า (Input)” และเมทริกซ์ $A$ เป็นเสมือน “ฟังก์ชัน (Function)” เมื่อคุณจับมันมาคูณกัน ($A\mathbf{x}$) มันจะกลายเป็นการทำ Linear Transformation (การแปลงเชิงเส้น), “ใส่ $\mathbf{v}$ เข้าไป สิ่งที่ออกมาคือ $T(\mathbf{v}) = A\mathbf{v}$”

ในทางเรขาคณิต เมทริกซ์จะทำหน้าที่แปลงพิกัดของจุดทุกจุดในวัตถุ จากอวกาศ (Coordinate Space) หนึ่ง ไปสู่อีกอวกาศหนึ่ง ค่าตัวเลขในคอลัมน์ของเมทริกซ์ $A$ ก็คือ “พิกัดใหม่” ของแกน X, Y, Z หลังจากถูกบิดเบือนแล้ว ดังนั้นการคูณ $A\mathbf{x}$ จึงเป็นการสั่งว่า “จงย้ายจุด $\mathbf{x}$ ทั้งหมด ไปตามแกนอ้างอิงใหม่ที่ฉันกำหนดไว้ในเมทริกซ์ $A$ ซะ!”

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

ความสนุกและทรงพลังที่สุดของการคูณเมทริกซ์ใน Game Engine อยู่ที่การ “รวมเวทมนตร์ (Composition of Transformations)” ครับ!

ลองนึกภาพว่าคุณต้องการให้โมเดลรถยนต์ “ขยายขนาด (Scale - $S$)” และ “หมุน (Rotate - $R$)” ถ้านำไปเขียนโค้ดกับจุด Vertex ทีละจุด คุณต้องคำนวณ $\mathbf{v}{temp} = S\mathbf{v}$ แล้วค่อยคำนวณ $\mathbf{v}{final} = R\mathbf{v}{temp}$ รวมเป็น $\mathbf{v}{final} = R(S\mathbf{v})$,

แต่โชคดีมากที่การคูณเมทริกซ์มีคุณสมบัติ การจัดหมู่ (Associative Property) คือ $(AB)C = A(BC)$,, ซึ่งหมายความว่า เราสามารถเอาเมทริกซ์ $R$ กับ $S$ มาคูณรวมร่างกันก่อนได้เลย! $$ M = RS $$ เราจะได้เมทริกซ์ $M$ เป็นคาถาบทใหม่ที่รวบยอดทั้งการหมุนและการย่อขยายไว้ในตารางเดียว จากนั้นก็นำ $M$ ไปคูณกับทุกๆ จุดของโมเดลรถยนต์ได้เลย ซึ่งช่วยประหยัดเวลาประมวลผลของคอมพิวเตอร์ไปได้มหาศาลครับ!

และอย่าลืมกฎ Not Commutative นะครับ! ใน 3D Engine หากคุณสั่ง Scale ก่อน Rotate ($RS$) รถของคุณจะดูปกติ แต่ถ้าคุณเผลอสลับเป็น Rotate ก่อน Scale ($SR$) รถของคุณอาจจะถูกบิดจนบี้แบนกลายเป็นสี่เหลี่ยมขนมเปียกปูนไปเลยก็ได้ครับ! (เพราะแกนมันถูกหมุนไปก่อนที่จะโดนบีบนั่นเอง),

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

ในโลกของ Graphics Pipeline ตั้งแต่โมเดลถูกโหลดเข้ามาใน RAM จนกลายไปเป็นพิกเซลบนจอ ทุกอย่างคือลำดับของการคูณ Matrix ที่เรียงร้อยต่อกันครับ!

ระบบ Hierarchy ของตัวละคร (เช่น แขนติดกับไหล่ ไหล่ติดกับตัว ตัวติดกับโลก) ล้วนคำนวณผ่านการคูณเมทริกซ์อย่างต่อเนื่อง GPU ของเราเกิดมาเพื่อทำสิ่งนี้โดยเฉพาะ มันถูกออกแบบฮาร์ดแวร์มาเพื่อทำ Dot Product ของ “แถวคูณหลัก” ให้ได้เร็วที่สุดนับล้านๆ ครั้งต่อวินาที

สมการคลาสสิกที่สุดใน Vertex Shader ก็คือการคูณรวบยอด (Concatenation): $$ M_{vp} = M_{per} \times M_{cam} \times M_{obj\to wld} $$, เมทริกซ์ก้อนเดียวที่เกิดจากการคูณกันนี้ สามารถเสกพิกัดโมเดลในโลกส่วนตัว (Local Space) ให้ย้ายไปตั้งในโลกของเกม (World Space) เลื่อนมาอยู่หน้ากล้อง (Camera Space) และบีบอัดลงบนจอ 2 มิติ (Perspective) ได้ในสมการเดียว!

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

เห็นไหมครับว่า การคูณเมทริกซ์ที่เราเคยนั่งท่องสูตร “แถวคูณหลัก” สมัยก่อน แท้จริงแล้วคือหัวใจหลักของเรขาคณิต 3 มิติ มันคือไวยากรณ์ (Syntax) ที่ช่วยให้เราร้อยเรียงคำสั่ง ยืด หมุน เลื่อน (Transformation) เข้าด้วยกันอย่างสวยงามและเป็นระบบ หากไม่มีเวทมนตร์บทนี้ การทำเกม 3 มิติแบบ Real-time คงไม่มีวันเกิดขึ้นได้ครับ!

ในตอนต่อไป เราจะมาเจาะลึกถึงเมทริกซ์กลุ่มย่อยๆ ที่ทำหน้าที่แปลงร่างโดยเฉพาะ ไม่ว่าจะเป็น Translation, Rotation หรือ Scale ว่าหน้าตาของตัวเลขข้างในตารางพวกนี้มันมีเวทมนตร์ซ่อนอยู่อย่างไร เตรียมตัวไว้ให้ดี แล้วพบกันใหม่ Level Cleared!

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