Constructor Three.js Three.DeviceOrientationControl不是构造函数

Constructor Three.js Three.DeviceOrientationControl不是构造函数,constructor,three.js,device-orientation,Constructor,Three.js,Device Orientation,我对ThreeJS向我发送此错误消息有问题。我包括了所有必要的ThreeJS文件,但仍然会显示此消息。我的目的是让移动设备使用DeviceOrientationControl.js进行导航。Mousemove工作得很好,但我无法让它工作。有什么想法吗 Uncaught TypeError: THREE.DeviceOrientationControls is not a constructor at init ((index):201) at (index):193 从'/

我对ThreeJS向我发送此错误消息有问题。我包括了所有必要的ThreeJS文件,但仍然会显示此消息。我的目的是让移动设备使用DeviceOrientationControl.js进行导航。Mousemove工作得很好,但我无法让它工作。有什么想法吗

Uncaught TypeError: THREE.DeviceOrientationControls is not a constructor
    at init ((index):201)
    at (index):193


从'/bftest/THREE/build/THREE.module.js'导入*为三;
从'/bftest/three/examples/jsm/controls/OrbitControls.js'导入{OrbitControls};
从'/bftest/three/examples/jsm/loaders/GLTFLoader.js'导入{GLTFLoader};
从'/bftest/three/examples/jsm/controls/DeviceOrientationControls.js'导入{DeviceOrientationControls};
var摄影机、场景、渲染器、统计信息、控件、windowHalfX=window.innerWidth/2、,
windowHalfY=window.innerHeight/2,
mouseX=0,
mouseY=0;
var renderer=new THREE.WebGLRenderer();
renderer.shadowMap.enabled=true;
renderer.shadowMapSoft=true;
renderer.shadowMap.type=THREE.PCFSoftShadowMap;
变量宽度=window.innerWidth;
var height=window.innerHeight;
init();
制作动画();
函数init(){
摄像机=新的三个透视摄像机(45,宽/高,0.11000);
控件=新的三个设备方向控件(摄像头);
摄像机位置设置(0,0,8);
场景=新的三个。场景();
var方向灯=新的三个方向灯(0xffffff,5);
方向光.颜色.设置HSL(0.1,1,0.95);
方向灯位置设置(0,1,1);
方向灯。位置。多重刻度(10);
场景。添加(方向光);
directionalLight.shadow.mapSize.width=2048;
directionalLight.shadow.mapSize.height=2048;
directionalLight.shadow.camera.left=-20;
directionalLight.shadow.camera.right=20;
directionalLight.shadow.camera.top=20;
directionalLight.shadow.camera.bottom=-20;
directionalLight.shadow.camera.near=1;
directionalLight.shadow.camera.far=200;
directionalLight.ShadowCameravible=真;
var spotLight1=新的三方向光(0xff4000);
聚光灯1.位置设置(-15,3,-4);
聚光灯1.目标位置设置(0,1,0);
聚光灯1.2度=1.2;
聚光灯1.5暗度=0.5;
聚光灯1.shadowcameranear=0;
聚光灯1.1暗影摄影机far=15;
spotLight1.shadowcameraleft=-5;
聚光灯1.shadowcameraright=5;
聚光灯1.shadowcameratop=5;
聚光灯1.shadowcamerabottom=-5;
spotLight1.castShadow=true;
场景。添加(聚光灯1);
var spotLight2=新的三方向光(0xff0aea);
聚光灯2。位置。设置(15,3,-4);
聚光灯2.目标位置设置(0,1,0);
聚光灯2.2度=1.2;
spotLight2.castShadow=true;
场景。添加(聚光灯2);
var hemisphereLight=新的三个半球灯(0xffffff,0x000000,.5)
var shadowLight=新的三方向光(0xff8f16,.4);
阴影灯。位置。设置(50,0,22);
阴影灯。目标。位置。设定(50,50,0);
shadowLight.rotation.set(Math.PI/-2,0,0);
shadowLight.shadow.camera.near=0.5;
shadowLight.shadow.camera.far=5000;
shadowLight.shadow.camera.left=-500;
shadowLight.shadow.camera.bottom=-500;
shadowLight.shadow.camera.right=500;
shadowLight.shadow.camera.top=500;
场景。添加(阴影灯);
var light2=新的三方向灯(0xfff150,.25);
light2.位置设置(-600350350);
var light3=新的三方向灯(0xfff150,.15);
light3.位置设置(0,-250,300);
场景。添加(半球灯光);
场景。添加(阴影灯);
const gltfLoader=新的gltfLoader();
gltfLoader.load('./3D/Bobby.glb',(gltf)=>{
const root=gltf.scene;
旋转根(-89.55);
根位置集(0,-0.7,0);
root.castShadow=true;
gltf.scene.transverse(函数(节点){
if(节点实例为三个.Mesh){
node.castShadow=true;
}
});
scene.add(root);//默认值为false
//计算包含所有内容的框
//自下而上
const box=new THREE.Box3().setFromObject(根);
const-boxSize=box.getSize(新的三个.Vector3()).length();
const-boxCenter=box.getCenter(新的3.Vector3());
//将相机设置为框
框架面积(boxSize*0.7,boxSize,boxCenter,摄像头);
box.castShadow=true;
//更新轨迹球控件以处理新尺寸
controls.maxDistance=boxSize*10;
控件。目标。副本(boxCenter);
});
renderer=new THREE.WebGLRenderer({antialas:true,canvas:document.querySelector('canvas'),alpha:true,});
renderer.shadowMap.enabled=true;
renderer.shadowMap.type=THREE.PCFSoftShadowMap;
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth、window.innerHeight);
addEventListener('resize',onWindowResize,false);
window.addEventListener('mousemove',onDocumentMouseMove,false);
}
onDocumentMouseMove函数(事件){
mouseX=-(event.clientX-windowHalfX)/150;
mouseY=-(event.clientY-windowHalfY)/150;
}
函数animate(){
请求动画帧(动画);
渲染(场景、摄影机);
}
函数onWindowResize(){
camera.aspect=window.innerWidth/window.innerHeight;
camera.updateProjectMatrix();
renderer.setSize(window.innerWidth、window.innerHeight);
}
函数render(){
camera.position.x+=(mouseX-camera.position.x)*0.9;
camera.position.y+=(-mouseY-camera.position.y)*0.9;
摄像机。注视(场景。位置);
渲染器。渲染(场景、摄影机);
}

通过ES6模块导入示例文件(如
DeviceOrientationControl
)时,不再需要使用
THREE
命名空间。所以不是

controls = new THREE.DeviceOrientationControls(camera);
使用


说得好!现在没有错误,但仍然不起作用(
controls = new THREE.DeviceOrientationControls(camera);
controls = new DeviceOrientationControls(camera);