Three.js - 缩小时事物消失答案

【问题标题】：Three.js - Things disappear when zooming outThree.js - 缩小时事物消失
【发布时间】：2015-05-24 23:58:21
【问题描述】：

在我的 three.js 项目中，我为我的相机使用了高 z 位置。当 z 位置太高时，我的场景会变黑。所以，当我缩小它变成黑色。但我不希望这种情况发生。

camera.position.z = 3000; 就是这样

当我缩小时，只放大一次，是这样的：

对于我使用 OrbitControls 的控件，我的相机是这样的：

var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 3000);
camera.position.z = 3000;

这里是行星和一些行星轨道的代码：

var scene = new THREE.Scene();

var material = new THREE.MeshLambertMaterial({
    map: THREE.ImageUtils.loadTexture("assets/img/sun.jpg")
});

var sun = new THREE.Mesh(new THREE.SphereGeometry(200, 50, 50), material);
scene.add(sun);

var orbitLine = function(radius,y)
{
    var segments = 64,
        line_material = new THREE.LineBasicMaterial( { color: 0xffffff } ),
        geometry = new THREE.CircleGeometry( radius, segments );

    geometry.vertices.shift();

    var orbit = new THREE.Line( geometry, line_material );
    if(y)
        orbit.position.y=y;
    else if(!y)
        orbit.position.y=0;

    scene.add(orbit);
};
var Mercury_orbit = orbitLine(400,-70);
var Venus_orbit = orbitLine(700,70);
var Earth_orbit = orbitLine(900,70);
var Mars_orbit = orbitLine(1250,70);
var Jupiter_orbit = orbitLine(3000,70);

无法提供小提琴，因为某些原因它不起作用。如果您需要更多代码，请在 cmets 中告诉我，我会添加。

有什么想法吗？谢谢。

【问题讨论】：

标签： javascript html three.js

【解决方案1】：

您的相机的远平面位于 3000 处，这意味着 3000 单位以外的所有内容都将被剪裁而不是绘制。

同时，您将相机放置在 (0,0,3000) 处，因此您正处于事物开始消失的位置。

【讨论】：

要小心，因为设置高的远平面值会降低深度缓冲区的分辨率。改变世界的单位要好得多。在您的示例中，将所有内容除以 10。然后您可以将远平面设置为 1000。