Matematika fakulteti

Ilova………………………………………………………………………..19

KIRISH
Kompyuter grafikasi doirasidagi amaliy dasturlari

WebGL dasturlari, C yoki C # tillariga o'xshash tilda yozilgan va OpenGL ES Shading Language (ESSL) JavaScript-da yozilgan , kompyuterning grafikaga ishlov berish birligida (GPU) bajariladi. WebGL notijorat Khronos Group tomonidan ishlab chiqilgan va ular tomonidan alamga tatbiq etilgan.

Biz WebGL-dan foydalanib uchburchak yaratish uchun namunaviy dasturni olib, dasturda keltirilgan qadamlarni kuzatamiz.

WebGL dasturining tuzilishi
WebGL bu veb-brauzerlarda interfaol 2D va 3D grafikalarni chizish va namoyish qilish uchun yaratilgan OpenGL ES 2.0-ga asoslangan texnologiya. Shu bilan birga, ushbu texnologiya bilan ishlash uchun uchinchi tomon plaginlari yoki kutubxonalari talab qilinmaydi. WebGL-dan foydalanadigan veb-ilovalarning barcha ishlari JavaScript kodiga asoslanadi va kodning ba'zi elementlari - to'g'ridan-to'g'ri video kartalardagi grafik protsessorlarda bajarilishi mumkin, buning natijasida dasturchilar qo'shimcha kompyuter resurslaridan foydalanishlari va tezlikni oshirishlari mumkin. Shunday qilib, dasturlarni yaratish uchun ishlab chiquvchilar veb-muhit uchun standart HTML / CSS / JavaScript texnologiyalaridan foydalanishlari va shu bilan birga grafikalarning apparat tezlashuvidan foydalanishlari mumkin.

WebGL (Web Graphics Library) dasturi haqida
WebGL (Web Graphics Library) - bu har qanday mos keladigan veb-brauzerda plaginlardan foydalanmasdan interfaol 2D va 3D grafikalarni ko'rsatish uchun JavaScript API. [2] WebGL boshqa veb-standartlar bilan to'liq integratsiyalashgan bo'lib, GPU-dan tezkor ravishda fizika va tasvirni qayta ishlash va veb-sahifaning kanvaslari sifatida effektlardan foydalanishga imkon beradi. WebGL elementlarini boshqa HTML elementlari bilan aralashtirib, sahifaning boshqa qismlari yoki sahifa fonida kompozitsiyalash mumkin.

Agar 2d va 3d grafikasi bilan ishlaydigan ish stoli dasturlarini yaratish ko'pincha maqsad platformasi bilan cheklangan bo'lsa, unda asosiy cheklash faqat WebGL texnologiyasini brauzer qo'llab-quvvatlashidir. Va ushbu platformadan foydalangan holda yaratilgan veb-ilovalar ishlatilgan platformadan qat'i nazar, dunyoning istalgan joyida Internetda mavjud bo'ladi: Windows, Linux, Mac yoki smartfonlar va planshetlar ishlaydigan stollar bo'lsin yoki bular o'yin pristavkalari.

WebGL 2006 yilda Mozilla-dan bo'lgan serbiyalik amerikalik dasturchi Vladimir Vukichevich tomonidan Canvas 3D-da o'tkazilgan tajribalardan kelib chiqdi. Keyinchalik Opera va Mozilla brauzerlarini ishlab chiquvchilari o'zlarining WebGL dasturlarini yaratishni boshladilar. Keyinchalik, Apple, Google, Mozilla, Opera brauzerlarining yirik ishlab chiqaruvchilari ishtirokida ushbu texnologiyaning spetsifikatsiyasi ustida ishlaydigan ishchi guruhi tashkil etildi. Va 2011 yil 3 martda WebGL 1.0 spetsifikatsiyasi taqdim etildi.
WebGL dastur kodi - bu JavaScript va OpenGL Shader tilining kombinatsiyasi.

• 
  CPU bilan bog'lanish uchun JavaScript talab qilinadi
  
• 
  GPU bilan bog'lanish uchun OpenGL Shader tili talab qilinadi.
  

Endi 2D koordinatalari yordamida oddiy uchburchak chizish uchun

Quyidagi dasturni diqqat bilan kuzatsak, WebGL-dan foydalanib oddiy uchburchak chizish uchun beshta ketma-ket qadam qo'ydik. Bosqichlar quyidagicha:
1-qadam - Tuvalni tayyorlang va WebGL renderlash kontekstini oling
Biz joriy HTML tuvali ob'ektini olamiz va uning WebGL renderlash kontekstini olamiz.
2-qadam - geometriyani aniqlang va uni buferli narsalarga saqlang
Biz geometriyaning uchlari, ko'rsatkichlari, rangi va boshqalar kabi xususiyatlarini aniqlaymiz va ularni JavaScript massivlarida saqlaymiz. Keyin, biz bir yoki bir nechta bufer ob'ektini yaratamiz va ma'lumotlarni o'z ichiga olgan massivlarni tegishli bufer ob'ektiga o'tkazamiz. Masalan, biz uchburchak uchlarini JavaScript massivida saqlaymiz va bu qatorni vertex bufer ob'ektiga o'tkazamiz.
3-qadam - Shader dasturlarini yaratish va kompilyatsiya qilish
Biz vertex shader va fragment shader dasturlarini yozamiz, ularni tuzamiz va ushbu ikkita dasturni bog'lash orqali qo'shma dastur yaratamiz.
4-qadam - Shader dasturlarini bufer moslamalari bilan bog'lang
Biz bufer ob'ektlarini va qo'shma shader dasturini birlashtiramiz.
5-qadam - Kerakli ob'ektni chizish (uchburchak)

WebGL-dan foydalanishni o'rganish uchun oddiy misolni ko'rib chiqaylik.