Three.js 中的初始精灵大小

Question

有人可以帮助我理解three.js最初是如何确定精灵的大小/比例的吗？

目前，我正在处理 3D 空间中堆叠的 4 个精灵（透明度为 3000 像素？×？1830 像素的 PNG），但我必须将它们放大到 16 倍和 22 倍之间。不过，为了防止精灵看起来被压扁，我必须将 y 轴缩放为 x 轴的 75%。

最终，我希望能够系统地提取图像，并让它们适当地缩放。

可能我只是没有正确设置这个东西。看起来不错，但现在感觉超级hacky。我几乎改变了一堆数字，直到它看起来对我来说是正确的。我不喜欢那样。我想明白。

这是我目前正在使用的内容：http : //valorink.com/3d-test/stackoverflow/

Answer 1

查看Sprite类的代码发现在构造函数中创建了一个宽和高为 1 的简单平面。我不会期望其他任何东西，因为几何尺寸通常不是由纹理尺寸定义的。

您可能希望它们填充视口，因此您必须缩放它们。对于透视相机，它有点数学，因为适合视口大小的 x 尺度（或 y 尺度）量与到相机的距离有关。所以，它应该是这样的

var halfHeigt = distanceToCamera / Math.tan( camera.fov/2 * Math.PI / 180 );
y-scale = halfHeight * 2;

当然，您需要考虑纵横比，以免看起来被压扁。所以，x-scale应该是y-scale * textureWidth / textureHeight，或者反过来y-scale = x-scale * textureHeight / textureWidth。