使用THREE.Vector3和OrbitControls.js控制背景视频可见性

Question

我有这个example，stackoverflow用户 Marquizzo 帮助我进行了开发。想要更改的是，我希望有一个短循环的视频背景，而不是根据相机位置来更改背景颜色，该背景仅在示例中现在使背景逐渐变为黑色的位置才可见。

其他功能将以相同的方式增加音频音量，并激活一个不可见的热点（也仅在相同的摄像机位置范围内）以单击/点击以重定向到另一个页面。

下面是现在会影响背景颜色的代码：

var vantagePoint = new THREE.Vector3(6.8, 0.6, -1.8);
var distance = 100;
var normalized = 1;
var endColor = new THREE.Color(0xffffff);
var startColor = new THREE.Color(0x000000);
scene.background = startColor;



function animate() {
		
		distance = vantagePoint.distanceTo(camera.position);
   normalized = THREE.Math.smoothstep(distance, 0.3, 2); // Converts [1, 100] => [0, 1]

   // Resets the color on each frame
   startColor.set(0xf000000);
   startColor.lerp(endColor, normalized);

	render();
	requestAnimationFrame( animate );

	


	}