How does the 2D Computer Graphics Representation work?

Written by — Aye Chan Aung Thwin

• 2D renderingနဲ့ ပတ်သက်ပြီး CGRမှာ ဘယ်လိုအလုပ်လုပ်တယ်။ တကယ်တမ်းပေါ် renderingလုပ်ရင် ပြောင်းပြန်ပေါ်နေတာတွေနဲ့ ဒါတွေကို ဘယ်လို fixလုပ်ရမယ်ဆိုတာကို semanticallyရှင်းပြပေးသွားမှာပါ။

2D-Cartesian Coordinate System

• 2D Cartesian Coordinate Systemက Geometryကနေ ဆင်းသက်လာတာပါ။ Two-dimensional(2D)ဆိုတဲ့အတိုင်း xနဲ့ yဆိုပြီး Real Number (ကိန်းစစ်: သုည၊ ဒဿမကိန်းနှင့် အပေါင်းအနှုတ်များပါသောကိန်းများ)နှစ်ခု စုံတွဲပါမယ် (သို့မဟုတ်) Complex Number ကိန်းစစ်နဲ့ (ကိန်းထွေး: ကိန်းစစ်မဖြစ်နိုင်သော ကိန်းရင်း) စုံတွဲပါမယ်‌‌။ ဒီxနဲ့ yဆုံတဲ့Point(ဆုံမှတ်)ကို Coordinateလို့ ခေါ်တယ်။

ကိန်းစစ်လို့ပြောခဲ့ပေမယ့် ရှုပ်နေမှာစိုးလို့ ပုံထဲကအတိုင်း ကိန်းပြည့်(ဒဿမပါသော ကိန်းစစ်များ)တွေ အနေနဲ့ပဲ အရင်ရှင်းပြပါမယ်။

• ဒီcoordinatesတွေက ပုံသေရှိနေတဲ့ ထောင့်မှန်ကျတဲ့ မျဥ်းဖြောင့်၂ကြောင်းပေါ်မှာ ကိန်းပြည့်တွေအနေနဲ့ တည်ရှိနေပြီးတော့ သူတို့ကို coordinate lineတွေလို့လည်း ခေါ်ပါတယ်။
• အဲ့မျဥ်း၂ကြောင်းဖြတ်တဲ့ ဆုံမှတ်ကို originလို့ခေါ်ပြီး ဖြတ်တဲ့ဆုံမှတ်က P(0, 0)မှာပဲ အမြဲပုံသေ ဆုံမှတ်အနေနဲ့ ဖြတ်ပါတယ်။

• Computingမှာ ဘာကြောင့် Y-axisက ပြောင်းပြန်ဖြစ်နေရတာလဲ?
• အဖြေကတော့ ရှင်းပါတယ်။ ကျွန်တော်တို့က စာဖတ်တဲ့အခါမှာ ဘယ်ကနေညာ၊ ပြီးတော့ အပေါ်ကနေ အောက်ကို Quadrant IVပုံစံအတိုင်း ဖတ်ပါတယ်။ အဲ့ဒီပုံစံကို Computerရဲ့ video graphicsပိုင်းမှာလည်း သုံးထားပါတယ်။ Programming Languageတော်တော်များများမှာလည်း ဒီနည်းနဲ့ပဲ သုံးပါတယ်။ အဲ့ဒီတော့ ကျွန်တော်တို့က ဆွဲပြီးသား Shapeတခုခုကို renderလုပ်တဲ့အခါ ပုံမှန်အတိုင်းဆိုရင် အထက်အောက်ပြောင်းပြန်(Vertically inverted)ဖြစ်နေပါတယ်။
• ဒါကို အတည့်အတိုင်း ပြန်ထားချင်တယ်ဆိုရင် X-axisကို 180 (သို့မဟုတ်) -180ဒီဂရီ လှည့်ပေးရပါတယ်။ ဒါက YZ-coordinate planeကိုပါ လိုက်လည်စေပါတယ်။ (ခုချိန်မှာ YZ-coordinate planeကို ဂရုစိုက်စရာမလိုသေးပေမယ့် 3Dကျရင် ထည့်စဥ်းစားရမှာမို့ ပြောပြတာပါ။)

Rendering in computing

• ကျွန်တော်တို့မှာ (1,2), (2,3)နဲ့ (3,4)ဆိုတဲ့ အမှတ်၃ခုမှာ တြိဂံတခုကို ဆွဲလိုက်တယ်ဆိုပါစို့၊ ဒီပုံကို Computerပေါ်မှာ renderချတယ်ဆိုရင် ပြောင်းပြန်ကြီး ပေါ်နေပါလိမ့်မယ်။ ဘာကြောင့်လဲဆိုတော့ Y-axisက ပြောင်းပြန်ဖြစ်နေလို့ပါ။ ပြတဲ့နေရာကတော့ Quadrant Iပါပဲ။
• 2D shapeတွေကို XY-coordinate planeမှာ renderချတယ်ဆိုပေမယ့် 0 to infinityမှာရှိတဲ့ Quadrant I(+,+)ကိုပဲ ပုံသေအားဖြင့် renderချပါတယ်။

Reflection Matrices

• ဒါကို ကျွန်‌တော်တို့က အတည့်ပေါ်ဖို့ဆိုရင် X-axisကို လှည့်ပြီး လုပ်ယူလို့ရပေမယ့် ဒါက 3Dပိုင်းကို ကျွမ်းကျင်မှသာ သုံးသင့်တာပါ။ ဒီတော့ Axisတွေကို မလှည့်ဘဲနဲ့ Y-coordinatesတွေရဲ့ တန်ဖိုးကို -1နဲ့ မြှောက်ပြီး Quadrant IVဘက်မှာ အတည့်ပေါ်အောင် အရင်လုပ်ရပါတယ်။
• ဒါပေမယ့် ကျွန်တော်တို့က ဒါကို မြင်ရဖို့ဆိုရင် Quadrant IVဘက်ကို Offsetပစ်ပြီးမှပဲ ပေါ်ပါတယ်။ (Dragဆွဲကြည့်တဲ့ သဘောပါပဲ။)

(Matrixသုံးပြီး တွက်တာကတော့ ရှေ့လျှောက်လာမယ့် တွက်ချက်နည်းတွေအတွက် ပိုပြီးပြင်ရလွယ်ကူပါလိမ့်မယ်။)

Layers

• Layerသဘောတရားကတော့ Z-axisက valueတွေကို အတိုးအလျှော့လုပ်ပြီး အပေါ်အောက် ပြန်စီတာပဲဖြစ်ပါတယ်။ ဒါကတော့ Orthographic viewအနေနဲ့ ပြထားတာဖြစ်ပြီး Z-axisက infinityထိပဲ ဝေးသွားပါစေ ကိုယ်ဆွဲထားတဲ့ အချိုးအစားအတိုင်းပဲ ပေါ်ပါမယ်။
• 3Dရဲ့ Perspective viewအနေနဲ့ ကြည့်မယ်ဆိုရင်တော့ ကျွန်တော်တို့ ပုံမှန်မြင်နေရသလိုပဲ shapeတွေက ကိုယ်နဲ့ ဝေးသွားလေလေ သေးသွားလေလေ မြင်ရမှာပဲဖြစ်ပါတယ်။
• အခြေခံအားဖြင့် ဒီလောက်သ‌ဘောပေါက်ရင် simulationအတွက် အဆင်ပြေပါပြီ။ ကျန်တာက ကိုယ်သုံးမယ့် Programming Languageအပေါ်ပဲ မူတည်တာမို့ပါ။