Skip to content

Instantly share code, notes, and snippets.

@xem
Last active February 26, 2026 09:38
Show Gist options
  • Select an option

  • Save xem/99930986c5333125a13b0ea50600391f to your computer and use it in GitHub Desktop.

Select an option

Save xem/99930986c5333125a13b0ea50600391f to your computer and use it in GitHub Desktop.

Revisions

  1. xem revised this gist Aug 3, 2021. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -14,7 +14,7 @@ angleDeg = angleRad * 180 / Math.PI;

    ### Unit circle

    ![unit circle](http://www-math.mit.edu/~djk/calculus_beginners/chapter07/images/trigo_functions.gif)
    ![unit circle](https://ocw.mit.edu/ans7870/18/18.013a/textbook/HTML/chapter02/images/trigo_functions.gif)

    ## 2D

  2. xem revised this gist Jun 5, 2019. 1 changed file with 51 additions and 2 deletions.
    53 changes: 51 additions & 2 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -211,8 +211,57 @@ ftp://rtfm.mit.edu/pub/usenet-by-group/news.answers/graphics/algorithms-faq

    ### Easing functions

    https://gist.github.com/gre/1650294
    (from https://gist.github.com/gre/1650294)

    ```
    /*
    * Easing Functions - inspired from http://gizma.com/easing/
    * only considering the t value for the range [0, 1] => [0, 1]
    */
    EasingFunctions = {
    // no easing, no acceleration
    linear: function (t) { return t },
    // accelerating from zero velocity
    easeInQuad: function (t) { return t*t },
    // decelerating to zero velocity
    easeOutQuad: function (t) { return t*(2-t) },
    // acceleration until halfway, then deceleration
    easeInOutQuad: function (t) { return t<.5 ? 2*t*t : -1+(4-2*t)*t },
    // accelerating from zero velocity
    easeInCubic: function (t) { return t*t*t },
    // decelerating to zero velocity
    easeOutCubic: function (t) { return (--t)*t*t+1 },
    // acceleration until halfway, then deceleration
    easeInOutCubic: function (t) { return t<.5 ? 4*t*t*t : (t-1)*(2*t-2)*(2*t-2)+1 },
    // accelerating from zero velocity
    easeInQuart: function (t) { return t*t*t*t },
    // decelerating to zero velocity
    easeOutQuart: function (t) { return 1-(--t)*t*t*t },
    // acceleration until halfway, then deceleration
    easeInOutQuart: function (t) { return t<.5 ? 8*t*t*t*t : 1-8*(--t)*t*t*t },
    // accelerating from zero velocity
    easeInQuint: function (t) { return t*t*t*t*t },
    // decelerating to zero velocity
    easeOutQuint: function (t) { return 1+(--t)*t*t*t*t },
    // acceleration until halfway, then deceleration
    easeInOutQuint: function (t) { return t<.5 ? 16*t*t*t*t*t : 1+16*(--t)*t*t*t*t }
    }
    ```

    ### 2D Vector helpers

    https://twitter.com/MaximeEuziere/status/1047545802669875200
    (from https://twitter.com/MaximeEuziere/status/1047545802669875200 )

    ```
    V=(x,y)=>({x,y}) // Vec2D constructor
    l=v=>d(v,v)**.5 // length(v)
    a=(v,w)=>V(v.x+w.x,v.y+w.y) // add(v, w)
    s=(v,w)=>a(v,m(w,-1)) // sub(v, w)
    m=(v,n)=>V(v.x*n,v.y*n) // scale(v, n)
    t=(v,w)=>l(s(v,w)) // distance(v, w)
    d=(v,w)=>v.x*w.x+v.y*w.y // dot_product(v, w)
    c=(v,w)=>v.x*w.y-v.y*w.x // cross_product(v, w)
    r=(v,o,t)=>a(o,V(c(f=s(v,o),g=V(Math.sin(t),Math.cos(t))),d(f,g))) // rotate(v, origin, theta_angle)
    n=v=>m(v,1/(l(v)||1)) // normalize(v)
    ```

  3. xem revised this gist Jun 5, 2019. 1 changed file with 9 additions and 1 deletion.
    10 changes: 9 additions & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -207,4 +207,12 @@ https://www.youtube.com/playlist?list=PLZHQObOWTQDPD3MizzM2xVFitgF8hE_ab

    ### comp.graphics.algorithms's FAQ

    ftp://rtfm.mit.edu/pub/usenet-by-group/news.answers/graphics/algorithms-faq
    ftp://rtfm.mit.edu/pub/usenet-by-group/news.answers/graphics/algorithms-faq

    ### Easing functions

    https://gist.github.com/gre/1650294

    ### 2D Vector helpers

    https://twitter.com/MaximeEuziere/status/1047545802669875200
  4. xem revised this gist Mar 22, 2017. 1 changed file with 26 additions and 0 deletions.
    26 changes: 26 additions & 0 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -170,7 +170,33 @@ vec3 (
    ) // Rotation in YZ plane
    ````

    ### Rotation along X:
    ````
    y' = y*cos(a) - z*sin(a)
    z' = y*sin(a) + z*cos(a)
    x' = x
    ````

    ### Rotation along Y:
    ````
    z' = z*cos(a) - x*sin(a)
    x' = z*sin(a) + x*cos(a)
    y' = y
    ````

    ### Rotation along Z:
    ````
    x' = x*cos(a) - y*sin(a)
    y' = x*sin(a) + y*cos(a)
    z' = z
    ````

    ### 3D Perspective Projection (draw a 3D point on a 2D canvas)
    ````
    x' = x * fov / (z + viewer_distance) + half_screen_width
    y' = -y * fov / (z + viewer_distance) + half_screen_height
    (no z)
    ````
    ### Sphere trigonometry

    http://bit.ly/bm1ftU
  5. xem revised this gist Feb 24, 2017. 1 changed file with 16 additions and 3 deletions.
    19 changes: 16 additions & 3 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -62,10 +62,23 @@ vec2 (
    ````


    ### Project any point of the plane on the trigonometric circle (center: origin, radius: 1)
    ### Normalize a vector
    ### a.k.a Project any point of the plane on the trigonometric circle (center: origin, radius: 1)

    - Anew_x = Math.cos(atan2(Ax, Ay))
    - Anew_y = Math.sin(atan2(Ax, Ay))
    ES5:

    ````
    Anew_x = Math.cos(atan2(Ax, Ay));
    Anew_y = Math.sin(atan2(Ax, Ay));
    ````

    ES6:

    ````
    tmp = Math.hypot(Ax, Ay);
    Ax = Ax / tmp;
    Ay = Ay / tmp;
    ````

    ### Intersections between a line and the grid (a.k.a 2D raycasting)

  6. xem revised this gist Feb 24, 2017. 1 changed file with 5 additions and 1 deletion.
    6 changes: 5 additions & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -164,4 +164,8 @@ http://bit.ly/bm1ftU

    ### Great videos about linear algebra and matrices:

    https://www.youtube.com/playlist?list=PLZHQObOWTQDPD3MizzM2xVFitgF8hE_ab
    https://www.youtube.com/playlist?list=PLZHQObOWTQDPD3MizzM2xVFitgF8hE_ab

    ### comp.graphics.algorithms's FAQ

    ftp://rtfm.mit.edu/pub/usenet-by-group/news.answers/graphics/algorithms-faq
  7. xem revised this gist Feb 24, 2017. 1 changed file with 3 additions and 0 deletions.
    3 changes: 3 additions & 0 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -12,6 +12,9 @@ angleRad = angleDeg * Math.PI / 180;

    angleDeg = angleRad * 180 / Math.PI;

    ### Unit circle

    ![unit circle](http://www-math.mit.edu/~djk/calculus_beginners/chapter07/images/trigo_functions.gif)

    ## 2D

  8. xem revised this gist Aug 13, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -23,7 +23,7 @@ angleDeg = angleRad * 180 / Math.PI;
    ### Line passing through 2 points

    - line equation: y = ax + b
    - a = (yB - yA) / (yB - yA) = tan θ
    - a = (yB - yA) / (xB - xA) = tan θ
    - θ = angle between line and x axis
    - b = yA - a * xA (because yA = a * xA + b)

  9. xem revised this gist Aug 13, 2016. 1 changed file with 13 additions and 9 deletions.
    22 changes: 13 additions & 9 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -34,7 +34,7 @@ angleDeg = angleRad * 180 / Math.PI;
    - intersection point P:
    - xP = (a - a')/(b' - b);
    - yP = a * xP + b;
    - Ex with y = 5\*x+1 & y' = 2\*x+8:
    - Ex with y = 5 \* x + 1 and y' = 2 \* x + 8:
    - xP = 7/3;
    - yP = 12.666;

    @@ -46,7 +46,7 @@ angle = Math.atan2(Ax, Ay)

    angle = Math.atan2(By - Ay, Bx - Ax);

    ### Rotate a point (angle in radians)
    ### Rotate a point of the plane around the origin (angle in radians)

    - Anew_x = Ax * Math.cos(angle) - Ay * Math.sin(angle)
    - Anew_y = Ax * Math.sin(angle) + Ay * Math.cos(angle)
    @@ -59,24 +59,24 @@ vec2 (
    ````


    ### Project a point on the trigonometric circle
    ### Project any point of the plane on the trigonometric circle (center: origin, radius: 1)

    - Anew_x = Math.cos(atan2(Ax, Ay))
    - Anew_y = Math.sin(atan2(Ax, Ay))

    ### Intersections between a line and the grid (2D raycasting)
    ### Intersections between a line and the grid (a.k.a 2D raycasting)

    - http://www.cse.yorku.ca/~amana/research/grid.pdf
    - http://en.wikipedia.org/wiki/Bresenham%27s_line_algorithm
    - Demo by xem: http://codepen.io/xem/pen/RRxPNG?editors=1010

    ### Projection of a plane on a sphere (on a 2D canvas)
    ### Projection of a plane on a sphere

    - new_y = Math.sin(-y * Math.PI/2);
    - new_x = Math.sin(x * Math.PI) * Math.cos(y * Math.PI / 2);
    - if Math.abs(x) < .5, the projected point is hidden "behind" the sphere.
    - Prototype by subzey: http://codepen.io/subzey/pen/rVoXQx
    - Demo by xem: http://xem.github.io/articles/demos/js13k15/globe2.html
    - Demo by xem (on a 2D canvas): http://xem.github.io/articles/demos/js13k15/globe2.html

    ### 2D jumps / gravity (ex: for side-view platform games)

    @@ -96,9 +96,9 @@ Also applicable to all kind of accelerations in x or y directions.
    Use time instead of frames to make the animation.
    Demo: https://jsfiddle.net/subzey/p1ftrar0/

    ### Distance between a point and a line
    ### Minimal distance between a point and a line

    - line: a *x + b * y + c = 0
    - line: a * x + b * y + c = 0
    - point: xA, yA
    - distance: d = Math.abs(a * xA + b * yA + c) / Math.sqrt(a * a + b * b)

    @@ -157,4 +157,8 @@ vec3 (

    ### Sphere trigonometry

    http://bit.ly/bm1ftU
    http://bit.ly/bm1ftU

    ### Great videos about linear algebra and matrices:

    https://www.youtube.com/playlist?list=PLZHQObOWTQDPD3MizzM2xVFitgF8hE_ab
  10. xem revised this gist Jul 18, 2016. 1 changed file with 61 additions and 2 deletions.
    63 changes: 61 additions & 2 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,5 @@
    ### Conventions

    - o = [xo = 0, yo = 0] is the origin
    - A = [xA, yA] is a point on the 2D plane. Same for B, C, ...
    - lengths are in any unit (ex: pixels)
    - code snippets are in JavaScript
    @@ -13,6 +12,9 @@ angleRad = angleDeg * Math.PI / 180;

    angleDeg = angleRad * 180 / Math.PI;


    ## 2D

    ### Distance between two points (Pythagore)

    - dist = function(A,B){ return Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA)) } // ES5
    @@ -98,4 +100,61 @@ Demo: https://jsfiddle.net/subzey/p1ftrar0/

    - line: a *x + b * y + c = 0
    - point: xA, yA
    - distance: d = Math.abs(a * xA + b * yA + c) / Math.sqrt(a * a + b * b)
    - distance: d = Math.abs(a * xA + b * yA + c) / Math.sqrt(a * a + b * b)

    ### Lerp (Blend / shortest path between two angles)

    ````
    lerpDeg = function(start,end,amt){
    ver dif=end-start;
    dif = dif%360;
    if(dif>180.0) {
    dif-=360.0;
    }
    else if (dif<-180.0) {
    dif+=360.0;
    }
    return start+dif*amt;
    }
    ````
    ## 3D

    ### 3D rotations


    In order to create a 3d rotation, just take the idenity matrix:

    ````
    vec3 (
    1, 0, 0,
    0, 1, 0,
    0, 0, 1
    )
    ````

    And fill in the sines and cosines:

    ````
    vec3 (
    +cos(a), -sin(a), 0,
    +sin(a), +cos(a), 0,
    0 , 0 , 1
    ) // Rotation in XY plane
    vec3 (
    +cos(a), 0, -sin(a),
    0 , 1, 0 ,
    +sin(a), 0, +cos(a)
    ) // Rotation in XZ plane
    vec3 (
    1, 0 , 0 ,
    0, +cos(a), -sin(a),
    0, +sin(a), +cos(a)
    ) // Rotation in YZ plane
    ````


    ### Sphere trigonometry

    http://bit.ly/bm1ftU
  11. xem revised this gist Jul 16, 2016. 1 changed file with 5 additions and 0 deletions.
    5 changes: 5 additions & 0 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -89,6 +89,11 @@ vec2 (

    Also applicable to all kind of accelerations in x or y directions.

    ### Framerate-independant 2D jumps

    Use time instead of frames to make the animation.
    Demo: https://jsfiddle.net/subzey/p1ftrar0/

    ### Distance between a point and a line

    - line: a *x + b * y + c = 0
  12. xem revised this gist Jul 14, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -40,7 +40,7 @@ angleDeg = angleRad * 180 / Math.PI;

    angle = Math.atan2(Ax, Ay)

    ### Angle in radians between two points
    ### Angle in radians between two points and the origin

    angle = Math.atan2(By - Ay, Bx - Ax);

  13. xem revised this gist Jul 14, 2016. 1 changed file with 19 additions and 0 deletions.
    19 changes: 19 additions & 0 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -75,3 +75,22 @@ vec2 (
    - if Math.abs(x) < .5, the projected point is hidden "behind" the sphere.
    - Prototype by subzey: http://codepen.io/subzey/pen/rVoXQx
    - Demo by xem: http://xem.github.io/articles/demos/js13k15/globe2.html

    ### 2D jumps / gravity (ex: for side-view platform games)

    - let x, y the position of the object (ex: 0, 0)
    - let vx, vy the horizontal and vertical speed of the object (ex: 0, 0)
    - let g, the gravity (which is a downwards acceleration, ex: -10)
    - during the frame at the start of the jump: set vy to a high value, ex: 50
    - during all the frames of the jump:
    - Add g to vy (ex: 40, 30, 20, 10, 0, -10, ...)
    - Add vy to y (ex: 40, 70, 90, 100, 100, 90, ...)
    - place the object at [x,y]

    Also applicable to all kind of accelerations in x or y directions.

    ### Distance between a point and a line

    - line: a *x + b * y + c = 0
    - point: xA, yA
    - distance: d = Math.abs(a * xA + b * yA + c) / Math.sqrt(a * a + b * b)
  14. xem revised this gist Jul 14, 2016. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -16,7 +16,7 @@ angleDeg = angleRad * 180 / Math.PI;
    ### Distance between two points (Pythagore)

    - dist = function(A,B){ return Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA)) } // ES5
    - dist = (A, B) => Math.hypot(xB -x A, yB - yA) // ES6
    - dist = (A, B) => Math.hypot(xB - xA, yB - yA) // ES6

    ### Line passing through 2 points

    @@ -32,7 +32,7 @@ angleDeg = angleRad * 180 / Math.PI;
    - intersection point P:
    - xP = (a - a')/(b' - b);
    - yP = a * xP + b;
    - Ex with y=5x+1 & y'=2x+8:
    - Ex with y = 5\*x+1 & y' = 2\*x+8:
    - xP = 7/3;
    - yP = 12.666;

  15. xem revised this gist Jul 14, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -66,7 +66,7 @@ vec2 (

    - http://www.cse.yorku.ca/~amana/research/grid.pdf
    - http://en.wikipedia.org/wiki/Bresenham%27s_line_algorithm
    - Demo by xem: http://codepen.io/xem/pen/RRxPNG
    - Demo by xem: http://codepen.io/xem/pen/RRxPNG?editors=1010

    ### Projection of a plane on a sphere (on a 2D canvas)

  16. xem revised this gist Jul 14, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -31,7 +31,7 @@ angleDeg = angleRad * 180 / Math.PI;
    - line 2: y' = a' * x + b'
    - intersection point P:
    - xP = (a - a')/(b' - b);
    - - yP = a * xP + b;
    - yP = a * xP + b;
    - Ex with y=5x+1 & y'=2x+8:
    - xP = 7/3;
    - yP = 12.666;
  17. xem revised this gist Jul 14, 2016. 1 changed file with 6 additions and 2 deletions.
    8 changes: 6 additions & 2 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -29,8 +29,12 @@ angleDeg = angleRad * 180 / Math.PI;

    - line 1: y = a * x + b
    - line 2: y' = a' * x + b'
    - intersection point P: xP = (a - a')/(b' - b); yP = a * x' + b;
    - Ex with y=5x+1 & y'=2x+8: xP = 7/3; yP = 12.666;
    - intersection point P:
    - xP = (a - a')/(b' - b);
    - - yP = a * xP + b;
    - Ex with y=5x+1 & y'=2x+8:
    - xP = 7/3;
    - yP = 12.666;

    ### Angle in radians between the x axis at the origin and a point on the plane

  18. xem revised this gist Jul 14, 2016. 1 changed file with 8 additions and 1 deletion.
    9 changes: 8 additions & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -16,7 +16,7 @@ angleDeg = angleRad * 180 / Math.PI;
    ### Distance between two points (Pythagore)

    - dist = function(A,B){ return Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA)) } // ES5
    - dist = (A, B) => Math.hypot(xB -xA, yB -yA) // ES6
    - dist = (A, B) => Math.hypot(xB -x A, yB - yA) // ES6

    ### Line passing through 2 points

    @@ -25,6 +25,13 @@ angleDeg = angleRad * 180 / Math.PI;
    - θ = angle between line and x axis
    - b = yA - a * xA (because yA = a * xA + b)

    ### Intersection of 2 secant lines

    - line 1: y = a * x + b
    - line 2: y' = a' * x + b'
    - intersection point P: xP = (a - a')/(b' - b); yP = a * x' + b;
    - Ex with y=5x+1 & y'=2x+8: xP = 7/3; yP = 12.666;

    ### Angle in radians between the x axis at the origin and a point on the plane

    angle = Math.atan2(Ax, Ay)
  19. xem revised this gist Jul 14, 2016. 1 changed file with 16 additions and 0 deletions.
    16 changes: 16 additions & 0 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -37,6 +37,14 @@ angle = Math.atan2(By - Ay, Bx - Ax);

    - Anew_x = Ax * Math.cos(angle) - Ay * Math.sin(angle)
    - Anew_y = Ax * Math.sin(angle) + Ay * Math.cos(angle)
    - It's the same as applying the following rotation matrix:
    ````
    vec2 (
    +cos(a), -sin(a)
    +sin(a), +cos(a)
    )
    ````


    ### Project a point on the trigonometric circle

    @@ -47,4 +55,12 @@ angle = Math.atan2(By - Ay, Bx - Ax);

    - http://www.cse.yorku.ca/~amana/research/grid.pdf
    - http://en.wikipedia.org/wiki/Bresenham%27s_line_algorithm
    - Demo by xem: http://codepen.io/xem/pen/RRxPNG

    ### Projection of a plane on a sphere (on a 2D canvas)

    - new_y = Math.sin(-y * Math.PI/2);
    - new_x = Math.sin(x * Math.PI) * Math.cos(y * Math.PI / 2);
    - if Math.abs(x) < .5, the projected point is hidden "behind" the sphere.
    - Prototype by subzey: http://codepen.io/subzey/pen/rVoXQx
    - Demo by xem: http://xem.github.io/articles/demos/js13k15/globe2.html
  20. xem revised this gist Jul 14, 2016. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion readme.md
    Original file line number Diff line number Diff line change
    @@ -15,7 +15,8 @@ angleDeg = angleRad * 180 / Math.PI;

    ### Distance between two points (Pythagore)

    dist = (A,B) => Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA))
    - dist = function(A,B){ return Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA)) } // ES5
    - dist = (A, B) => Math.hypot(xB -xA, yB -yA) // ES6

    ### Line passing through 2 points

  21. xem revised this gist Jul 14, 2016. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -34,13 +34,13 @@ angle = Math.atan2(By - Ay, Bx - Ax);

    ### Rotate a point (angle in radians)

    Anew_x = Ax * Math.cos(angle) - Ay * Math.sin(angle)
    Anew_y = Ax * Math.sin(angle) + Ay * Math.cos(angle)
    - Anew_x = Ax * Math.cos(angle) - Ay * Math.sin(angle)
    - Anew_y = Ax * Math.sin(angle) + Ay * Math.cos(angle)

    ### Project a point on the trigonometric circle

    Anew_x = Math.cos(atan2(Ax, Ay))
    Anew_y = Math.sin(atan2(Ax, Ay))
    - Anew_x = Math.cos(atan2(Ax, Ay))
    - Anew_y = Math.sin(atan2(Ax, Ay))

    ### Intersections between a line and the grid (2D raycasting)

  22. xem revised this gist Jul 14, 2016. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -2,8 +2,8 @@

    - o = [xo = 0, yo = 0] is the origin
    - A = [xA, yA] is a point on the 2D plane. Same for B, C, ...
    - lengths are in pixels
    - code is in JavaScript
    - lengths are in any unit (ex: pixels)
    - code snippets are in JavaScript

    ### Degrees to radians

    @@ -22,11 +22,11 @@ dist = (A,B) => Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA))
    - line equation: y = ax + b
    - a = (yB - yA) / (yB - yA) = tan θ
    - θ = angle between line and x axis
    - b = yA - a * xA (bcause yA = a * xA + b)
    - b = yA - a * xA (because yA = a * xA + b)

    ### Angle in radians between the x axis at the origin and a point on the plane

    angle = atan2(Ax, Ay)
    angle = Math.atan2(Ax, Ay)

    ### Angle in radians between two points

  23. xem revised this gist Jul 14, 2016. 1 changed file with 19 additions and 20 deletions.
    39 changes: 19 additions & 20 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -1,49 +1,48 @@
    #### Conventions

    ### Conventions

    - o = [xo = 0, yo = 0] is the origin
    - A = [xA, yA] is a point on the 2D plane. Same for B, C, ...
    - lengths are in pixels
    - code is in JavaScript

    ### Degrees to radians

    #### Distance between two points (Pythagore)
    angleRad = angleDeg * Math.PI / 180;

    dist = (A,B) => Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA))
    ### Radians to degrees

    #### Line passing through 2 points
    angleDeg = angleRad * 180 / Math.PI;

    ### Distance between two points (Pythagore)

    dist = (A,B) => Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA))

    ### Line passing through 2 points

    - line equation: y = ax + b
    - a = (yB - yA) / (yB - yA) = tan θ
    - θ = angle between line and x axis
    - b = yA - a * xA (bcause yA = a * xA + b)

    #### Degrees to radians
    ### Angle in radians between the x axis at the origin and a point on the plane

    angleRad = angleDeg * Math.PI / 180;

    #### Radians to degrees

    angleDeg = angleRad * 180 / Math.PI;
    angle = atan2(Ax, Ay)

    #### Angle between two points
    ### Angle in radians between two points

    todo
    angle = Math.atan2(By - Ay, Bx - Ax);


    #### Rotate a point (angle in radians)
    ### Rotate a point (angle in radians)

    Anew_x = Ax * Math.cos(angle) - Ay * Math.sin(angle)
    Anew_y = Ax * Math.sin(angle) + Ay * Math.cos(angle)

    ### Project a point on the trigonometric circle

    #### Project a point on the trigonometric circle

    todo

    Anew_x = Math.cos(atan2(Ax, Ay))
    Anew_y = Math.sin(atan2(Ax, Ay))

    #### Intersections between a line and the grid (2D raycasting)
    ### Intersections between a line and the grid (2D raycasting)

    - http://www.cse.yorku.ca/~amana/research/grid.pdf
    - http://en.wikipedia.org/wiki/Bresenham%27s_line_algorithm
  24. xem revised this gist Jul 14, 2016. 1 changed file with 14 additions and 4 deletions.
    18 changes: 14 additions & 4 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -19,22 +19,32 @@ dist = (A,B) => Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA))
    - θ = angle between line and x axis
    - b = yA - a * xA (bcause yA = a * xA + b)

    #### Degrees to radians

    #### Angle between two points
    angleRad = angleDeg * Math.PI / 180;

    #### Radians to degrees

    angleDeg = angleRad * 180 / Math.PI;

    #### Angle between two points

    todo

    #### Rotate a point

    #### Rotate a point (angle in radians)

    Anew_x = Ax * Math.cos(angle) - Ay * Math.sin(angle)
    Anew_y = Ax * Math.sin(angle) + Ay * Math.cos(angle)


    #### Project a point on the trigonometric circle

    todo


    #### Intersections between a line and the grid (2D raycasting)

    #### Intersections between a line and the grid

    - http://www.cse.yorku.ca/~amana/research/grid.pdf
    - http://en.wikipedia.org/wiki/Bresenham%27s_line_algorithm

  25. xem revised this gist Jul 14, 2016. 1 changed file with 12 additions and 14 deletions.
    26 changes: 12 additions & 14 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -1,42 +1,40 @@
    Conventions
    ====
    #### Conventions


    - o = [xo = 0, yo = 0] is the origin
    - A = [xA, yA] is a point on the 2D plane. Same for B, C, ...
    - lengths are in pixels
    - code is in JavaScript


    Distance between two points (Pythagore)
    ====
    #### Distance between two points (Pythagore)

    dist = (A,B) => Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA))

    Line passing through 2 points
    ====
    #### Line passing through 2 points


    - line equation: y = ax + b
    - a = (yB - yA) / (yB - yA) = tan θ
    - θ = angle between line and x axis
    - b = yA - a * xA (bcause yA = a * xA + b)


    Angle between two points
    ====
    #### Angle between two points




    #### Rotate a point


    Rotate a point
    ====


    #### Project a point on the trigonometric circle

    Project a point on the trigonometric circle
    ===



    Intersections between a line and the grid
    ===
    #### Intersections between a line and the grid


  26. xem revised this gist Jul 14, 2016. 1 changed file with 7 additions and 7 deletions.
    14 changes: 7 additions & 7 deletions readme.md
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,5 @@
    Conventions
    ===
    ====

    - o = [xo = 0, yo = 0] is the origin
    - A = [xA, yA] is a point on the 2D plane. Same for B, C, ...
    @@ -8,26 +8,26 @@ Conventions


    Distance between two points (Pythagore)
    ===
    ====

    dist = (A,B) => Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA))

    Line passing through 2 points
    ===
    ====

    - line equation: y = ax + b
    - a = (yB - yA)/*(yB - yA) = tan θ
    - a = (yB - yA) / (yB - yA) = tan θ
    - θ = angle between line and x axis
    - b = yA - a * xA (bcause yA = a xA + b)
    - b = yA - a * xA (bcause yA = a * xA + b)


    Angle between two points
    ===
    ====



    Rotate a point
    ===
    ====



  27. xem renamed this gist Jul 14, 2016. 1 changed file with 0 additions and 0 deletions.
    File renamed without changes.
  28. xem created this gist Jul 14, 2016.
    42 changes: 42 additions & 0 deletions readme.mb
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,42 @@
    Conventions
    ===

    - o = [xo = 0, yo = 0] is the origin
    - A = [xA, yA] is a point on the 2D plane. Same for B, C, ...
    - lengths are in pixels
    - code is in JavaScript


    Distance between two points (Pythagore)
    ===

    dist = (A,B) => Math.sqrt((xB - xA)\*(xB - xA) + (yB - yA)\*(yB - yA))

    Line passing through 2 points
    ===

    - line equation: y = ax + b
    - a = (yB - yA)/*(yB - yA) = tan θ
    - θ = angle between line and x axis
    - b = yA - a * xA (bcause yA = a xA + b)


    Angle between two points
    ===



    Rotate a point
    ===



    Project a point on the trigonometric circle
    ===



    Intersections between a line and the grid
    ===