在Tensorflow.js中计算面的Z轴旋转

3

注意:这个问题与Three.js无关,只涉及Tensorflow.js和三角函数。

我正在尝试通过旋转我的脸来旋转Three.js中的一个3D对象。我使用了这个由 akhirai560 提供的代码在X轴和Y轴上进行旋转:

function normal(vec) {
  let norm = 0;
  for (const v of vec) {
    norm += v * v;
  }
  return Math.sqrt(norm);
}

function getHeadAnglesCos(keypoints) {
  // Vertical (Y-Axis) Rotation
  const faceVerticalCentralPoint = [
    0,
    (keypoints[10][1] + keypoints[152][1]) * 0.5,
    (keypoints[10][2] + keypoints[152][2]) * 0.5,
  ];
  const verticalAdjacent = keypoints[10][2] - faceVerticalCentralPoint[2];
  const verticalOpposite = keypoints[10][1] - faceVerticalCentralPoint[1];
  const verticalHypotenuse = normal([verticalAdjacent, verticalOpposite]);
  const verticalCos = verticalAdjacent / verticalHypotenuse;

  // Horizontal (X-Axis) Rotation
  const faceHorizontalCentralPoint = [
    (keypoints[226][0] + keypoints[446][0]) * 0.5,
    0,
    (keypoints[226][2] + keypoints[446][2]) * 0.5,
  ];
  const horizontalAdjacent = keypoints[226][2] - faceHorizontalCentralPoint[2];
  const horizontalOpposite = keypoints[226][0] - faceHorizontalCentralPoint[0];
  const horizontalHypotenuse = normal([horizontalAdjacent, horizontalOpposite]);
  const horizontalCos = horizontalAdjacent / horizontalHypotenuse;

  return [horizontalCos, verticalCos];
}

它通过计算这些点的余弦值来计算旋转(原始图像来源):

垂直和水平地标

我还想计算Z轴旋转的余弦值。谢谢!


如果您正在使用ThreeJS建模面部,为什么不直接使用ThreeJS旋转网格? - Trentium
@Trentium 这个问题与three.js无关,我不是在创建脸的克隆。我只是用三角函数计算脸的旋转。 - ابن آدم
1个回答

1

我并不完全清楚问题的最终目标,但如果只是希望围绕Z轴旋转,以下代码片段将会有所帮助。

center = { x: 50, y: 50 };

points = [
  { x: 60, y:  60 },
  { x: 50, y: 100 }
]

function rotateAboutZ( xyRotationPoint, points, zRotation ) {

  let result = points.map( p => {
    // Adjust the point based on the center of rotation.
    let x = p.x - xyRotationPoint.x;
    let y = p.y - xyRotationPoint.y;
    // Calculate the radius and angle in preparation for rotation
    // about the Z axis.
    let radius = Math.sqrt( x * x + y * y );
    let angle = Math.atan2( y, x );
    // Adjust the angle by the requested rotation.
    let angleRotated = angle + zRotation;
    // Finally, calculate the new XY coordinates, and re-adjust 
    // based on the center of rotation.
    let xRotated = radius * Math.cos( angleRotated ) + xyRotationPoint.x;
    let yRotated = radius * Math.sin( angleRotated ) + xyRotationPoint.y;
    return { x: xRotated, y: yRotated };
  } );
  
  return result;

}

// Let's rotate the points by 180 degrees around the
// center point of (50,50).
let result = rotateAboutZ( center, points, Math.PI );
console.log( result );


@Iwo 第3行的点只是随机测试点,被输入到“rotateAboutZ”函数中。这两个测试点代表了构成面的实际点数组。 - Trentium

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接