0

我有一个 webdevelopers 背景,现在我正在使用 Three.js 制作一个简单的 2D 横向滚动条。即使我制作了一个 2D 游戏,我也会在 3D 空间中绘制它,以便在我觉得时间合适时简单地转换为 3D。为什么我选择 Three.js?嗯,它是 JavaScript,因为我喜欢为网络创建和探索新技术,所以用我已经知道的语言来制作它会很有趣。

但现在我的问题。这不是一个真正的技术问题,但由于我是 3D 空间的新手,所以它更像是一种思维方式。在使用网络时,我习惯于以像素或百分比(相对)大小来思考,它始终是 2 轴(X/Y)或更确切地说是宽度/高度。但是 3D 空间、相机和视角让我很头疼,因为我不习惯。

我应该如何看待 3D 空间中的大小问题?相机在 800x600 画布上具有 45 度的视野。平截头体是 1(近)和 1000(远)。这是否意味着如果一个对象在 (1) 附近并且大小为 800x600,它实际上会填满画布?

好吧,正如你所看到的,我对这个以及在 3D 空间中的思维方式很陌生,这对我来说是一个新的领域。

4

3 回答 3

1

你必须从三角学的角度来思考。

靠近近平面的物体必须小于靠近远平面的物体才能填充画布。

在您的情况下,填充画布的近平面中的对象的大小是多少?

请注意,在 45 度的视野下,相机中的顶点与中心和近平面顶部的端点的角度是 22.5 度,对吧?

那么,如果物体到相机的距离是1(近平面),这个物体填充画布中心到顶部距离的高度是:tan(22.5)。所以填充画布的对象的高度应该是:2 * tan(22.5)。一般来说:

     height = 2 * distance_object_camera * tan( field_of_view / 2 )

另请注意,此结果与您正在使用的画布大小无关。

于 2013-09-26T11:32:17.620 回答
1

选择适合您项目的比例,然后调整相机参数,以便更好地查看您想要显示的任何内容。所以你可以想象现实世界中的尺寸和位置。.

1 个单位 = 1m 是一个非常常见的约定,但实际上它可以是任何你喜欢的,只要它是一致的。如果您主要处理微观事物,也许将 1mm 视为基本单位更合适。Three.js 不需要知道或关心你的单位系统是什么。但是例如,尝试用 1 毫米单位对整个行星进行建模会产生如此巨大的值,以至于您可能会遇到与浮点数如何工作相关的问题。

与位图图形不同,屏幕分辨率等在这里没有太大的相关性。如果您确实需要与显示器相关的像素完美定位(例如调整对象大小或设置相机以使对象充满屏幕或以特定像素大小出现),这可能但通常涉及大量数学。

很难对数学部分给出明确的答案,对于这些特定情况有很多不同的用例、问题和答案。

您还可以考虑使用 OrtographicCamera 对 3D 场景进行严格的 2D(无透视)视图。这也将使像素定位/屏幕位置和尺寸计算更容易。

于 2013-09-27T01:32:52.870 回答
0

你需要很多几何学和三角学。例如,在 euklidian 空间中存在三角不等式。

于 2013-09-26T09:04:24.983 回答