这个古怪的数学在three.js中是什么？

Question

我正在学习three.js的过程中，我不断遇到这些古怪的数学公式，我无法理解为什么。

这是一个例子。

mouse.set( ( event.clientX / window.innerWidth ) * 2 - 1, 
- ( event.clientY / window.innerHeight ) * 2 + 1 );

如果有人可以向我解释这个逻辑，那么可能会给我带来一个与众不同的世界。从我从这个例子中可以理解的是，我们将屏幕上的当前鼠标x位置，然后除以屏幕的宽度，然后乘以2，然后减去1.对我来说似乎是不合逻辑的。

示例2

geometry.rotateX( - Math.PI / 2 );

Answer 1

首先，我要假设你错过了some_distance/total_distance的重要性。它与some_number_on_a_ruler/ruler_length基本相同 - 结果基本上是0到1之间的数字，表示第一个数字相对于第二个数字的位置。

例如，如果你这样做：

(event.clientX / window.innerWidth) * 100

您将获得一个代表鼠标位置的数字（以百分比表示）。所以如果你这样做：

(event.clientX / window.innerWidth) * 2

您将获得一个介于0和2之间的数字，代表鼠标位置。相反，如果你这样做：

(event.clientX / window.innerWidth) * 2 - 1 

您将得到介于-1和1之间的数字，表示鼠标位置，其中0表示window的中间位置。那是数字的意思。它越接近0越接近window的中间。

至于- ( event.clientY / window.innerHeight ) * 2 + 1。这是同一件事，只是它实际上是一个重新排列：

- (( event.clientY / window.innerHeight ) * 2 - 1 )

内部部分与clientX完全相同，只有符号已被反转。

现在，对于geometry.rotateX( - Math.PI / 2 )，你需要知道的是2PI是360度。如果你想做很多几何体，请完全忘记度数。角度的自然单位是弧度。事实上，我们通常不会在数学中说2PI弧度，我们只说2PI。

如果2PI是一个圈，则PI为半圈，因此PI / 2为四分之一圆或90度。所以它旋转了90度。