Can someone explain the Draw.Circle method used in Hudpaint?

[LearningLua]

Hey... bottom line... I suck at math. I also don't work with HUDs all that much. I was wondering if someone could ELI5 how the (slightly modified) example from the Gmod Lua library works?
function draw.Circle( x, y, radius, seg )
    local cir = {}

    table.insert( cir, { x = x, y = y, u = 0.5, v = 0.5 } )
    for i = 0, seg do
        local a = math.rad( ( i / seg ) * -360 )
        table.insert( cir, { x = x + math.sin( a ) * radius, y = y + math.cos( a ) * radius, u = math.sin( a ) / 2 + 0.5, v = math.cos( a ) / 2 + 0.5 } )
    surface.DrawPoly( cir )
    end
    --for i = 0, seg do
        --local a = math.rad( ( i / seg ) * -360 ) -- This is needed for non absolute segment counts
        --table.insert( cir, { x = x + math.sin( a ) * radius, y = y + math.cos( a ) * radius, u = math.sin( a ) / 2 + 0.5, v = math.cos( a ) / 2 + 0.5 } )

--end
end
hook.Add( "HUDPaint", "PolygonCircleTest", function()

    surface.SetDrawColor( 0, 0, 0, 200 )
    draw.NoTexture()
    draw.Circle( ScrW() / 2, ScrH() / 2, 200, 90 )--math.sin( CurTime() ) * 20 + 25 )

    --Usage:
    --draw.Circle( x, y, radius, segments )

I'd be especially grateful if someone explained the math that is going on.

[Clovis]

I haven't actually drawn circles in Lua, but here's some maths from something I wrote in JS for canvas that should demonstrate the basics of the trigonometry you'll presumably need. I've cut out the irrelevant bits, so ignore the missing syntax. No idea if it will be any help, but it's worth a go, I thought. Look up trigonometry and circles to learn a bit more, is my recommendation.

function drawCircle(centreCanvasX, centreCanvasY, radius, canvasContext, degreeStart, degreeEnd) {
for(nAngle = 0;nAngle <= 360;nAngle++) {
var currentX = centreCanvasX + radius * Math.cos(nAngle * (Math.PI / 180))
var currentY = centreCanvasY + radius * Math.sin(nAngle * (Math.PI / 180)) 

[LearningLua]

I appreciate the recommendation unfortunately the example your provided is beyond my understanding at this time. ELI5 = Explain like I'm 5.

With that being said I do see the similarities in the code.

[Clovis]

So, to get the X coordinate, you need to provide the middle coordinate around which the circle should go, the radius of the circle and then use the Lua cosine function of the angle, which would be 1 degree in my example, but it's more a matter of precision, so iterating by a 4 degree angle each time will be 4x as efficient but create a slightly less precise circle to our eyes.

For the Y coordinate, it's exactly the same, but instead of using the cosine of the angle, you use the sine of the angle. Does that help at all?

[LearningLua]

It does and I suspected that was the case (with setting the middle of the circle) but I don't understand what math.cos(ine) or math.sin(e) does/is. I have a high-school level education on mathmatics with a bit of Algebra but it's been a very long time since I've had to use any Algebra.

[Clovis]

Me too. It was a bitch relearning trigonometry back in my Visual Basic 6 days when I wanted to make a solar system simulation thing.

With coding, it's generally a great idea to be constantly referring to the documentation. Even seasoned veteran programmers are always referring to documentation - there's simply too much to remember otherwise.

math.sin
math.cos

Those pages will tell you which arguments are accepted and what they're supposed to be. It seems that Lua also requires radians, so you will need to do the same thing I did where I multiply the angle by pi divided by 180.

[LearningLua]

I actually took a look at those pages which is was part of the reason I posted this discussion in the first place I just don't understand what a sine is or what a cosine is or a radian lol. I'm sorry, I know this is probably painful but could you give me a simplified answer of what a sine and cosine are?

[Clovis]

They're basically lookup tables that take a degree or radian as an input and return a value you process with the other values such as radius and the middle coordinates of the circle to give you the place to draw a line to. AFAIK, sine and cosine don't actually calculate, but simply spit out some predefined value - or at least that's how it works on calculators. You don't really need to understand anything about them to use them though, as long as you're formatting your input values the same way I did.

[LearningLua]

It's definitely interesting to see that the moon on your site behaves identical to the circle when it's parsed through gmod. There's a white border around your moon that gets smaller the closer it gets to the X and Y axis.

I think you've helped me quite a bit so in the example above really the only thing that needs my attention is math.rad which defines 'a' math.cos and math.sine simply use that value - the predefined value you mentioned. I feel it's necessary to understand them because how do you know when and where to use math.cos or math.sin

how do I decide which one needs to be used?

[Clovis]

I think math.rad is to convert degrees into radians, so it's neater to do it that way, but it will need to replace the bit where my code was multiplying the angle by pi / 180.

[LearningLua]

function drawCircle(centreCanvasX, centreCanvasY, radius, canvasContext, degreeStart, degreeEnd) {
for(nAngle = 0;nAngle <= 360;nAngle++) {
var currentX = centreCanvasX + radius * Math.cos(nAngle * (Math.PI / 180))
var currentY = centreCanvasY + radius * Math.sin(nAngle * (Math.PI / 180))
would be...

var currentX = centreCanvasX + radius * Math.cos(nAngle * (Math.rad))
var currentY = centreCanvasY + radius * Math.sin(nAngle * (Math.rad))

Right?

[MansNotCold]

https://i.gifer.com/4FI4.gif

[Clovis]

math.rad is a function that takes in a value and returns an answer. It's not a constant. So you need to input something into the function to get a result, like in the example you posted in the OP.