gpt4 book ai didi

javascript - 设置 THREE.PerspectiveCamera 的距离而不改变 View 方向

转载 作者:行者123 更新时间:2023-11-30 19:57:12 28 4
gpt4 key购买 nike

我在空间某处的 THREE.js 中有 PerspectiveCamera 作为网格的子项。相机仍应注视网格(局部坐标 [0, 0, 0])。我想在不改变观察方向的情况下改变相机与网格的距离。有什么简单的方法可以做到这一点吗?

camera.position.z = 13 // Works only if position.x and position.y are 0.
camera.setDistanceFromTarget(13) // I need something like this.

我只是在考虑手动计算实际相机的旋转 Angular 和新相机的位置。这是 fiddle .

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

var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild(renderer.domElement);

var geometry = new THREE.BoxGeometry(3, 3, 3);

var cube = new THREE.Mesh(geometry);
scene.add(cube);
cube.add(camera);

camera.position.set(2, 4, 6)
camera.lookAt(cube.position)

function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
}

animate();

// How to set distance of camera from [0, 0, 0] to 13 without change view direction?
camera.position.z = 13;
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>THREE.js camera demo</title>
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r71/three.min.js"></script>
</body>
</html>

最佳答案

您需要normalize相机位置向量,然后是 scalarly multiply它按所需的长度:

camera.position.normalize().multiplyScalar(13)

[ https://jsfiddle.net/0jnw5guo/ ]

关于javascript - 设置 THREE.PerspectiveCamera 的距离而不改变 View 方向,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53842473/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com