Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/three.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Three.js如何使相机跟随地形高度图?_Javascript_Three.js_Game Physics - Fatal编程技术网

Javascript Three.js如何使相机跟随地形高度图?

Javascript Three.js如何使相机跟随地形高度图?,javascript,three.js,game-physics,Javascript,Three.js,Game Physics,我有一个相机飞行视图定位接近高度地图。摄像头使用标准键盘控制,不允许在y轴上移动;它保持在设定的y轴上。因为地形不是一个均匀的水平面并且随机渲染。如何让相机跟随地形高度图?这是一个例子。下面是添加光线投射器以在地形上缩放的尝试。所有代码都在项目中的动画功能中。我注意到当摄像机试图放大地形时。如果太陡,它将笔直通过。此外,它不会随着地形下落。摄像机保持在最高位置 var raycaster = new THREE.Raycaster(camera.position.clone(), new THR

我有一个相机飞行视图定位接近高度地图。摄像头使用标准键盘控制,不允许在y轴上移动;它保持在设定的y轴上。因为地形不是一个均匀的水平面并且随机渲染。如何让相机跟随地形高度图?这是一个例子。下面是添加光线投射器以在地形上缩放的尝试。所有代码都在项目中的动画功能中。我注意到当摄像机试图放大地形时。如果太陡,它将笔直通过。此外,它不会随着地形下落。摄像机保持在最高位置

var raycaster = new THREE.Raycaster(camera.position.clone(), new THREE.Vector3(0, -1, 0));
raycaster.ray.origin.copy(camera.position);

var intersections = raycaster.intersectObjects( terrain );

if (intersections.length > 0){

    var distance = intersections[0].distance;
    if(distance > 0 && distance < 10){
        camera.position.y= intersections[0].point.y + 20;
    }

}
var raycaster=new THREE.raycaster(camera.position.clone(),new THREE.Vector3(0,-1,0));
raycaster.ray.origin.copy(摄像机位置);
var交叉点=光线投射器。交叉点对象(地形);
如果(交点长度>0){
var距离=交点[0]。距离;
如果(距离>0&&距离<10){
camera.position.y=交点[0]。点.y+20;
}
}
在此片段中:

if(distance > 0 && distance < 10){
    camera.position.y= intersections[0].point.y + 20;
}
if(距离>0&&distance<10){
camera.position.y=交点[0]。点.y+20;
}
…忽略距离>10的交点,但随后摄影机移动到地形上方+20处。我怀疑这就是为什么它不能随着地形下落。我不太确定“太陡”的问题,但那可能是类似的。。。尝试将光线投射器保持在高于最大地形高度的高度,而不是相机的位置


如果问题仍然存在,您可能希望包括一个实时演示或地形导出。

将camera.position复制到一个向量,并提升vector position.y,然后将光线投射器设置为向量

  var castFrom = new THREE.Vector3();
      var castDirection = new THREE.Vector3(0,-1,0);
      var raycaster = new THREE.Raycaster(camera.position.clone(), new THREE.Vector3(0, -1, 0));
        castFrom.copy(camera.position);
        castFrom.y += 1000;
        raycaster.set(castFrom,castDirection);
    var intersections = raycaster.intersectObjects( terrain );
     if (intersections.length > 0){
       camera.position.y = intersections[0].point.y+20;
       }