three.js - 在 THREE.js 中获取与 3D 空间相关的鼠标坐标

Question

在过去的 3 周里，我一直在努力解决这个问题。如果有人能帮助我，我将不胜感激。

我正在开发一个类似于 Geometry Wars 的游戏，其中我在屏幕中间有一个三角形，您可以四处移动。

问题是我需要三角形旋转并面向鼠标光标的方向。我不需要担心每个说的 z 轴，因为我总是将相机放在固定位置 (z=500) 并且我将场景视为“2D 场景” - 所有 Action 都发生在 z 上=0 平面。

计算三角形和鼠标之间的角度是基本的:

targetAngle = Math.atan2(mouseCoord.y-this.position.y, mouseCoord.x-this.position.x)

这是网格。

问题是 mouseCoords 是站立的 Dom 窗口格式，而三角形的位置是 Three.js 格式。

问)如何将鼠标坐标转换为表示三角形所在 z=0 平面上的坐标？

我尝试了很多方法，包括光线交叉，但没有任何效果；(

感谢大家的帮助，非常感谢你们提供了一个了不起的框架!!!!

Answer 1

我实际上没有看到问题。使用 THREE.vector3 和 0 中的 z 坐标。然后使用诸如 triangle.rotate(THREE.vector3(targetAngle,0,0) 之类的东西