Three.js：无论我的窗户高度如何，都要保持我的物体同时

Question

我想在我的网站上添加一个THREE.JS场景，但我发现它的响应有些问题：

如果我在 x轴上调整窗口大小，我的对象大小是相同的：

但是现在如果我在 y轴上调整窗口大小，我的对象大小就会改变：

我想阻止这种行为。我希望我的物体大小取决于我的窗户宽度而不是窗户的高度。

有谁知道怎么做？非常感谢你！

camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 4000 );
camera.position.set(-200,-50,0);
camera.lookAt(new THREE.Vector3(0,0,0));

scene = new THREE.Scene();
scene.background = new THREE.Color( 0x0c0c0d );
scene.add(camera);

renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

更新： 关于TheJim01的答案，我应该做一些计算。我将相机位置简化为camera.position.z = 750.这是我发现的一张照片，说明了我的问题：

所以我认为我应该这样做：

Math.tan(50/2) = window.innerHeight/2 / camera.position.z

最后：

camera.position.z = window.innerHeight/2 / Math.tan(50/2)

不幸的是它似乎没有用......