Arctangent Explained

Shader Gang

I will try to demystify the Arctangent function and hopefully it will open more creative doors for your Shaders and Gamedev journey.  👉 Do you want to support my work? The best way to support this channel is to buy my game on Steam. https://store.steampowered.com/app/2527340/Cosmic_roads/  👉 Alternate ways to support! https://github.com/sponsors/DigvijaysinhGohil https://www.patreon.com/DigvijaysinhG

Transcript

00:00you might have heard that you don't have to be good at maths to be a good game dev or graphics

00:04programmer or programmer in general well i believe that's a total nonsense while you don't have to

00:11be an expert at mathematics you must be aware of certain maths function and know how to use them

00:16in certain situations one such function that i believe you should know is called arc tangent

00:22i'll demystify it for you and by the end of the video it might open up new creative doors for

00:27your shaders and game dev journeys my goal is to help you understand the concept intuitively

00:32so you don't have to memorize everything all right you can call me the guj and let's dive right into

00:38the topic before we talk about our tangent we need to know what is tangent for that let's revise your

00:46trigonometry knowledge now now don't give me that look i promise i won't make it traditional boring

00:52lecture let me plot a right angle triangle and right angle triangle is basically a triangle which

00:59has the largest angle of 90 degrees the longest side or the side opposite to the 90 degrees angle

01:05is called hypotenuse now let's say i have this angle theta the side opposite of this angle is called

01:12opposite side sometimes also referred to as perpendicular and the side adjacent to the angle

01:18is called adjacent side also referred to as base but i will stick to opposite and adjacent

01:25now tangent of this angle theta tan theta is just the ratio of the length of opposite side

01:32divided by adjacent side technically it is opposite upon hypotenuse divide by adjacent upon hypotenuse

01:39but hypotenuse cancels out now let's say this angle theta is 32 degrees opposite sides length is 5 units

01:48and adjacent side's length is 8 units obviously i've taken some liberty and rounded off these values

01:54for the simplicity now tangent of 32 degrees is just the ratio of 5 divided by 8. so the tangent of 32

02:02degrees is 0.625 meaning if i were to feed 32 as input for the tangent function i will get 0.625

02:11arc tangent is just the inverse of the tangent meaning if i were to take this 0.625

02:17and feed it into the arc tangent function i will get 32 as output basically i will get the angle

02:23most programming languages have this function as a10 like this which will take single input which will

02:30be the ratio of opposite side divided by adjacent side and give the results back many programming

02:36languages offer an overloaded version of the a10 which will take two inputs first input being the length of

02:42opposite side and second being the length of adjacent side if the language does not have the overload

02:49then it will most likely be defined as a102 like in hlsl and this function is more intuitive to use

02:57let's say for our triangle i use the a10 and feed 5 and 8 as inputs i will get this angle of 32 degrees

03:05but if i were to flip the order of inputs around i will get this angle of 58 degrees instead because

03:13now i'm basically telling the arc tangent function that this is the opposite side and this is the

03:18adjacent side one important thing to notice a10 function will return the angle in radians and its

03:25range will be from minus pi to pi but obviously this is all just a theory a game math theory

03:33all right i know this joke is getting old and i probably still borrowed it from the amazing

03:40brackies but i simply cannot help it anyways i was telling that this is still all theoretical knowledge

03:47in my opinion knowledge is only valuable if you know how to apply it effectively so allow me to

03:52explain why i think this is an important function in game dev and shaders well that's because in games

03:58and shaders we deal with vectors a lot in form of position and direction let me just show you

04:06let's say i have this position p in 2d space if i were to imagine a vector on the graph it would look

04:13something like this this distance will be position dot x and this distance will be position dot y

04:20and just like that i have a right angle triangle so if i were to use a10 with p dot y and p dot x

04:27i will have the angle between my vector and the horizontal x axis and if i were to use the a10

04:34function with p dot x and p dot y i will get the angle between my vector and the vertical axis y

04:42in shaders i extensively use arc tangent to calculate polar coordinates y component based on the cartesian

04:48coordinates or uvs i also use it to distort my circular sdf shapes for games let's say i'm making

04:57an angry bird type game or even a pocket tank type game and i have a shooting velocity vector that

05:03follows my mouse pointer based on that vector i can get the rotation angle for my tank cannon using

05:11arc tangent you could also use it to find the angle between two vectors as well so our tangent is pretty

05:18handy now up to this point if the video was easier to understand hit that like button it really

05:24supports the channel and helps other discover the content subscribe if you haven't already and keep

05:31on grinding shaders until we meet again

Category

Transcript

Be the first to comment

Recommended