# Rotate model face towards camera using face normal

**URL:** <https://discourse.processing.org/t/rotate-model-face-towards-camera-using-face-normal/2614>\
**Category:** Coding Questions\
**Created:** [August 13, 2018, 3:24pm UTC](https://discourse.processing.org/t/rotate-model-face-towards-camera-using-face-normal/2614 "2018-08-13T15:24:02Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![nosarious](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/nosarious/32/1113_2.png) [@nosarious](https://discourse.processing.org/u/nosarious)\
**Post date:** [August 13, 2018, 3:24pm UTC](https://discourse.processing.org/t/rotate-model-face-towards-camera-using-face-normal/2614/1 "2018-08-13T15:24:02Z")

</div>

I am having trouble trying to rotate the face of a 3d model so it faces the camera directly.

I have this function so far, but the result is inconsistent. I would normally call this just before drawing the model. Assume the normal vector in these cases has been normalized so the distance is 1.

```auto
void doRotation (PVector theNormal){  
  //theNormal is the normal of face of model

  //direction we want it to face, towards the camera which is facing (0,0,1)
  PVector upVector = new PVector (0,0,-1);
  
  float angleOfRotation = PVector.angleBetween(n, upVector);
  PVector axisOfRotation = n.cross(upVector);
  
  rotate( (-angleOfRotation), axisOfRotation.x, axisOfRotation.y, axisOfRotation.z );  
}

```

I usually confirm the normal by drawing it as a line with two spheres… maybe this format is incorrect? The face is correctly rotated if the smaller blue sphere is inside the larger red sphere.

```auto
void drawNormal(PVector tc, PVector tn, int distance){
  /// tc = face center, tn = face normal
  line (tc.x, tc.y, tc.z, tn.x*distance, tn.y*distance, tn.z*distance);
  pushMatrix();
    stroke(255,0,0);
    translate(tc.x, tc.y, tc.z);
     sphere(30);
  popMatrix();
    
  pushMatrix();
    stroke(0,0,255);
    translate(tn.x*distance, tn.y*distance, tn.z*distance);
    sphere(10);
  popMatrix();
  stroke(0);
}

```

I am using the HE\_Mesh library for the model itself, but wanted to keep the problem spots of the code simpler.

---

<div class="post-metadata">

**Author:** ![nosarious](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/nosarious/32/1113_2.png) [@nosarious](https://discourse.processing.org/u/nosarious)\
**Post date:** [August 13, 2018, 3:36pm UTC](https://discourse.processing.org/t/rotate-model-face-towards-camera-using-face-normal/2614/2 "2018-08-13T15:36:08Z")

</div>

solved the problem when drawing the normal (My google-fu was not working as well yesterday?)  
Need to add the center values to the normal values when drawing the line and capping sphere.

```auto
void drawNormal(PVector tc, PVector tn, int distance){
  line (tc.x, tc.y, tc.z, tc.x+tn.x*distance, tc.y+tn.y*distance, tc.z+tn.z*distance);
  pushMatrix();
    translate(tc.x, tc.y, tc.z);
     sphere(30);
  popMatrix();
    
  pushMatrix();
    translate(tc.x+tn.x*distance, tc.y+tn.y*distance, tc.z+tn.z*distance);
    sphere(10);
  popMatrix();
  stroke(0);
}

```

still cannot rotate a face properly.