Javascript Three.js:Panorama Cube可放大并过渡到不同的Panorama Cube

我对Three.js不熟悉。我用这个例子来描述6个立方体的全景效果，在这个例子中，人们可以围绕立方体进行平移、放大和缩小

我想弄清楚，在最大放大级别下，如何将用户转换到不同的全景立方体（具有不同的图像源），映射到这个特定的立方体部分。所以我会打开下一个场景，让用户在他的旅程中更进一步

这几乎就是谷歌街景所做的，当你点击箭头沿着道路向前移动

---

我没有看到太多的例子。我研究并发现这可能与创建2个场景有关？如果有任何关于如何使其功能化的想法，我将不胜感激。

检测何时转换：

在给出的示例中，鼠标事件都给出了。通过调整相机的

fov

属性，可以在

onDocumentMouseWheel

中处理缩放。“放大”减少视野，而“缩小”增加视野。当

fov

达到最小/最大值时，检测将触发到新场景的转换，这将是很简单的

检测转换位置：

下一步是确定要过渡到哪个新场景。你可以做一些热点的事情，比如，你从相机中拍摄一条光线，看看它是否击中了一个特定的地方（例如，你战略性地定位了一个

THREE.Sphere

）。但是为了简单起见，我们假设您只有您提到的6个方向，并且您仍然在使用示例的鼠标控件

通过更新

lat

和

lon

变量（以度为单位），在

onDocumentMouseMove

中处理相机移动。（注意：似乎

lon

无限制地增加，因此为了清晰起见，最好给它一个重置值，使其只能在0.0-359.99或其他之间。）您可以让所有的math-y更好地检查拐角，或者您可以简单地检查45度：

if(lat > 45){
    // you're looking up
}
else if(lat < -45){
    // you're looking down
}
else{
    // you're looking at a side, check "lon" instead
}

甚至可以影响材质的“不透明度”（opacity）值，使一个球体逐渐消失，另一个球体逐渐就位

---

我的主要观点是，这种转变可以通过多种方式实现，由@Vad决定使用何种效果。

我发现了一个没有答案的重复：谷歌地图实际上具有世界的3d表示。这不仅仅是全景。它使用该3d数据将全景图的各个部分映射到简化（低多边形）模型，使用该3d模型滑动摄影机，十字渐变为新的全景图。如果没有3D数据，你将无法有效地回购。一种方法是使用简单的3D世界，就像gman说的那样。在这种情况下，你可以走在任何箭头。另一方面，如果你想全景的方法，你将需要准备在某种方式的三维视频。Panorama使用纹理时，您需要记录所有相机的移动，以便在应用程序中导航。使用两个切换几何体（在您的情况下为立方体），一个始终是当前的，另一个是未来的（视频纹理）。使用不透明度淡出淡出效果。在箭头键上，只需加载当前全景视频纹理的下一个序列。仅在移动线的开始或结束时启用箭头。最大放大级别取决于摄影机参数。灯光变暗不会对场景产生影响。将其指定给立方体纹理后，背景属性。我想他是在问是否有办法在一个立方体结构到另一个立方体结构之间进行渐变过渡。

// These are in the global scope, defined just before the call to init();
// I moved "mesh" to the global scope to access its material during the animation loop.
var mesh = null,
    colorChange = -0.01;

// This code is inside the "update" function, just before the call to renderer.render(...);
// It causes the color of the material to vary between white/black, giving the fading effect.
mesh.material.color.addScalar(colorChange);
if(mesh.material.color.r + colorChange < 0 || mesh.material.color.r + colorChange > 1){ // not going full epsilon checking for an example...
    colorChange = -colorChange;
}