当位置（x、y 或 z）太大时，网格会在 three.js 中抖动答案

【问题标题】：Mesh shakes in three.js when position (x, y or z) is too large number当位置（x、y 或 z）太大时，网格会在 three.js 中抖动
【发布时间】：2018-08-14 01:45:16
【问题描述】：

我需要一个场景（宇宙），其中网格之间的距离非常大（例如 10^15）。但是位置较大（x、y 或 z）的网格会抖动。我试过logarithmicDepthBuffer，但没有用。

我无法缩短距离，因为有距离为 1000 公里和 1 000 000 光年的网格。有什么办法可以解决吗？这里是example。

<html>

<head>
	<script src="https://threejs.org/build/three.js"></script>
</head>

<body>
<script>
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);

var renderer = new THREE.WebGLRenderer({
	logarithmicDepthBuffer: true
});

renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var geometry = new THREE.BoxGeometry(1, 1, 1);
var material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
var cube = new THREE.Mesh(geometry, material);

cube.position.x = Math.pow(10, 15) // Very large position x.
cube.add(camera)
scene.add(cube);

camera.position.z = 3;

function animate() {
	requestAnimationFrame(animate);
	renderer.render(scene, camera);
	cube.rotation.y += 0.01;
}

animate();
</script>
</body>

</html>

【问题讨论】：

有数字限制..您可能需要将所有单位缩小 10 或 100 倍...或者更改坐标系，以便相对于相机区域正在，任何太远的东西都会将其距离限制为适合您的相机近/远的东西

标签： javascript three.js 3d largenumber

【解决方案1】：

您应该将相机添加到场景而不是网格中：

scene.add(camera);

即使cube(camera) 有效，也请使用; 来关闭语句。

【讨论】：