title: 3D normal/look-at vector from Euler angles
body: <p>I'm working on a JavaScript/Canvas 3D FPS-like engine and desperately need a normal vector (or look-at vector if you will) for near and far plane clipping. I have the x and y axis rotation angles and am able to do it easily with only one of them at the time, but I just can't figure out how to get both of them...</p>
  
  <p>The idea is to use this vector it to calculate a point in front of the camera, the near and far clipping planes must also be definable by constants so the vector has to be normalized, I hoped that with only the angles it would be possible to get this vector length to 1 without normalizing, but that's not the problem.</p>
  
  <p>I don't have any roll (rotation around z axis) so it's that much easier.</p>
  
  <p>My math looks like this:</p>
  
  <pre><code>zNear = 200; // near plane at an arbitrary 200 "points" away from camera position
  
  // normal calculated with only y rotation angle (vertical axis)
  normal = {
      x: Math.sin(rotation.y),
      y: 0,
      z: Math.cos(rotation.y)};
  </code></pre>
  
  <p>Then clip a point in 3D space by testing the vector from the plane to it by means of a dot product.</p>
  
  <pre><code>nearPlane = {
      x: position.x+normal.x*zNear,
      y: position.y+normal.y*zNear,
      z: position.z+normal.z*zNear};
  
  // test a point at x, y, z against the near clipping plane
  if(
      (nearPlane.x-x)*normal.x+
      (nearPlane.y-y)*normal.y+
      (nearPlane.z-z)*normal.z &lt; 0
  )
  {
      return;
  }
  
  // then project the 3D point to screen
  </code></pre>
  
  <p>When a point is behind the player its projection coordinates are reversed (x=-x, y=-y) so nothing makes sense any more, that's why I'm trying to remove them.</p>
  
  <p><img src="https://i.stack.imgur.com/wrSKp.png" alt="enter image description here"></p>
  
  <p>I want that green arrow there, but in 3D.</p>