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中的FirstPersonControl,给出错误targetPosition.SetFromSphereCalCords不是一个函数_Javascript_Three.js_3d - Fatal编程技术网

Javascript 如何修复three.js中的FirstPersonControl,给出错误targetPosition.SetFromSphereCalCords不是一个函数

Javascript 如何修复three.js中的FirstPersonControl,给出错误targetPosition.SetFromSphereCalCords不是一个函数,javascript,three.js,3d,Javascript,Three.js,3d,当我尝试使用FirstPersonControl时,只会出现以下错误: 未捕获类型错误:targetPosition.SetFromSphereCalCords不是 功能 在THREE.firstPersonControl.update(firstPersonControl.js:276) 在动画中(main.js:143) const scene=new THREE.scene() const renderer=new THREE.WebGLRenderer() renderer.setSiz

当我尝试使用FirstPersonControl时,只会出现以下错误:

未捕获类型错误:targetPosition.SetFromSphereCalCords不是 功能 在THREE.firstPersonControl.update(firstPersonControl.js:276) 在动画中(main.js:143)

const scene=new THREE.scene()
const renderer=new THREE.WebGLRenderer()
renderer.setSize(window.innerWidth、window.innerHeight)
document.body.appendChild(renderer.doElement)
常数照相机=新的
三.透视照相机(75,窗内宽度/窗内高度,0.1,
1000 )
摄像机。位置。设置(0,10,100)
camera.rotation.x=-0.5
常数starsGeometry=新的三点几何();
for(设i=0;i<10000;i++){
常数星=新的3.Vector3()
star.x=THREE.Math.randFloatSpread(2000)
star.y=THREE.Math.randFloatSpread(2000)
star.z=THREE.Math.randFloatSpread(2000)
星形几何。顶点。推(星形)
}
const starsMaterial=新的三点材质({color:0x888888})
常数星场=新的三点(星几何、星材料)
场景.添加(starField)
控件=新的三个.firstPersonControl(摄影机、渲染器.doElement)
controls.lookSpeed=0.1
controls.movementSpeed=100
常数时钟=新的三个时钟(真)
函数animate(){
请求动画帧(动画)
渲染器。渲染(场景、摄影机)
控件。更新(clock.getDelta())
}
制作动画()

我所需要的是能够用鼠标四处查看,并且指针仍然可见,但我不知道如何使其可见。

我恐怕无法重现您的问题,请参见。我现在发现了问题,我在从本地服务器加载脚本时,更改了源代码,它以某种方式开始工作,谢谢!很抱歉,我无法重现您的问题,请参阅。我现在发现了问题,当我更改源代码时,我正在从本地服务器加载脚本。它以某种方式开始工作,谢谢!
const scene = new THREE.Scene()
const renderer = new THREE.WebGLRenderer()
renderer.setSize(window.innerWidth, window.innerHeight)
document.body.appendChild( renderer.domElement)

const camera = new  
THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight, 0.1, 
1000 )
camera.position.set( 0, 10, 100)
camera.rotation.x = -0.5

const starsGeometry = new THREE.Geometry();

for ( let i = 0; i < 10000; i ++ ) {
const star = new THREE.Vector3()
star.x = THREE.Math.randFloatSpread(2000)
star.y = THREE.Math.randFloatSpread(2000)
star.z = THREE.Math.randFloatSpread(2000)
starsGeometry.vertices.push( star )
}

const starsMaterial = new THREE.PointsMaterial( { color: 0x888888 } )
const starField = new THREE.Points( starsGeometry, starsMaterial )    
scene.add( starField )

controls = new THREE.FirstPersonControls( camera, renderer.domElement )
controls.lookSpeed = 0.1
controls.movementSpeed = 100

const clock = new THREE.Clock( true )

function animate() {

    requestAnimationFrame( animate )
    renderer.render( scene, camera  )
    controls.update( clock.getDelta() )

}

animate()