Ցույց տալ դեպի շարժումը

Վերադառնանք մեր առաջին օրինակներից մեկին՝ դեպի մկնիկ արագացող Mover օբյեկտի օրինակին։

Գուցե նկատել ես, որ մեր նկարած բոլոր պատկերներն առայժմ շրջաններ են եղել։ Դա հարմար է, որովհետև պտույտ քննարկելու կարիք չկա. չէ՞ որ շրջանն ինչպես էլ պտտես, նույն տեսքը կունենա։ Այնուամենայնիվ, բոլոր ծրագրավորողներն էլ, ինչ-որ պահից սկսած, ուզում են շրջանից տարբերվող առարկա նկարել, որը շարժվում է դեպի օգտատիրոջ ցույց տված ուղղությունը. գուցե դու ուզում ես մրջյուն, մեքենա կամ տիեզերանավ նկարել։ Ուշադրություն դարձրու, որ օգտատիրոջ ցույց տված ուղղությամբ շարժվել ասելով նկատի ունենք ըստ արագության վեկտորի պտտվել։ Արագությունը վեկտոր է՝ x և y բաղադրիչներով, սակայն ProcessingJS-ում մեզ անկյուն է պետք։ Եվս մեկ անգամ նկարենք եռանկյունաչափության դիագրամը՝ կիրառելով օբյեկտի արագության վեկտորը.

Գիտենք՝ ինչ է տանգենսը.

t a n g e n t (ա ն կ յ ո ւ ն) = \frac{ա ր ա գ ո ւ թ յ ո ւ ն_{y}}{ա ր ա գ ո ւ թ յ ո ւ ն_{x}}

Հավասարման խնդիրն այն է, որ արագությունը գիտենք, բայց անկյունը՝ ոչ. պետք է անկյունը գտնենք։ Դրա համար պետք է կիրառենք հակադարձ տանգենս կոչվող ֆունկցիան, որը կոչվում է նաև արկտանգենս կամ tan-1։ Գոյություն ունի նաև հակադարձ սինուսի և հակադարձ կոսինուսի ֆունկցիա։

Եթե a արժեքի տանգենսը հավասար է b-ի, ապա b-ի հակադարձ տանգենսը հավասար է a-ի։ Օրինակ՝


Եթե	$t a n g e n t (a) = b$ ‍
Ապա	$a = a r c t a n g e n t (b)$ ‍

Հակադարձը հասկացա՞ր. այն մեզ կօգնի հավասարման մեջ անկյունը գտնել։


Եթե	$t a n g e n t (a n g l e) = v e l o c i t y_{y} / v e l o c i t y_{x}$ ‍
Ապա	$a n g l e = a r c t a n g e n t (v e l o c i t y_{y} / v e l o c i t y_{x}$ ‍)

Հիմա փորձենք հասկանալ, թե բանաձևը display() ֆունկցիայի որ հատվածում պետք է կիրառենք։ Ուշադրություն դարձրու, որ ProcessingJS-ում արկտանգենսի ֆունկցիան atan()-ն է։ JavaScript-ն տրամադրում է նաև Math.atan() ֆունկցիա և նույնը հիմնական եռանկյունաչափական մյուս ֆունկցիաների համար, սակայն կկիրառենք ProcessingJS-ի ֆունկցիաները։

Mover.prototype.display = function () {
  var angle = atan(this.velocity.y / this.velocity.x);

  stroke(0, 0, 0);
  fill(127, 127, 127);
  pushMatrix();
  rectMode(CENTER);
  translate(this.position.x, this.position.y);
  rotate(angle);
  rect(0, 0, 30, 10);
  popMatrix();
};

Այս կոդը համարյա այն է, ինչ ուզում ենք. համարյա աշխատում է։ Այնուամենայնիվ, մի մեծ խնդիր ունենք։ Դիտարկենք ստորև ներկայացված արագության երկու վեկտորները։

Չնայած նրան, որ նման են թվում, դրանք իրար հակառակ են ուղղված։ Այնուամենայնիվ, եթե մեր բանաձևով երկուսի համար անկյունը գտնենք…

V1 ⇒ Անկյուն = atan(3/-4) = atan(-0,75) = -0,644 ռադիան = -57 աստիճան
V2 ⇒ Անկյուն = atan(-3/4) = atan(-0,75) = -0,644 ռադիան = -57 աստիճան

…երկու վեկտորների համար նույն անկյունը կստանանք։ Տրամաբանական է, որ սա սխալ արդյունք է, քանի որ վեկտորներն իրար հակառակ են ուղղված։ Իրականում համակարգչային գրաֆիկայում սա տարածված խնդիր է։ Լուծումը ProcessingJS-ի atan2() ֆունկցիան է, որը քեզ կազատի atan() ֆունկցիան ու մի քանի բացասական ու դրական դեպքերը դիտարկող պայմանական դրույթներ կիրառելուց. ուշադրություն դարձրու, որ JavaScript-ն էլ, ու հիմնական բոլոր ծրագրավորման լեզուները պարունակում են այդ ֆունկցիան։

Mover.prototype.display = function () {
  var angle = atan2(this.velocity.y, this.velocity.x);

  stroke(0, 0, 0);
  fill(127, 127, 127);
  pushMatrix();
  rectMode(CENTER);
  translate(this.position.x, this.position.y);
  rotate(angle);
  rect(0, 0, 30, 10);
  popMatrix();
};

Ամեն ինչ ավելի պարզեցնելու համար PVector օբյեկտն ունի heading() կոչվող ֆունկցիա, որը ցանկացած PVector-ի երկչափ ուղղության անկյունը ռադիաններով ստանալու համար կանչում է atan2() ֆունկցիան։

Ստորև ներկայացնում ենք ամբողջական ծրագիրը։ Շարժիր մկնիկը և տես՝ ինչպես է շարժվում։

«Բնական նմանակիչներ» դասընթացը ստեղծվել է Դանիել Շիֆմանի «Կոդի բնույթը» գրքի հիման վրա և կիրառվում է ըստ Creative Commons Attribution-NonCommercial 3,0 Unported License-ի։

Ուզո՞ւմ ես միանալ խոսակցությանը։

Մուտք գործել

Դասակարգել ըստ

Առայժմ հրապարակումներ չկան։

Անգլերեն հասկանո՞ւմ ես: Սեղմիր այստեղ և ավելի շատ քննարկումներ կգտնես «Քան» ակադեմիայի անգլերեն կայքում: