我试图在我的three.js项目中添加OrbitControls,但是当我尝试调用构造函数时,它给出了一个未捕获的类型错误“ THREE.OrbitControls不是构造函数”。我已经在寻找解决方案,但是我唯一能找到的就是显式导入文件。但是当我这样做时,它仍然会给出错误。 这是我的代码:
<script src="JS/three.js"></script>
<scirpt src="JS/OrbitControls.js"></scirpt>
<script src="JS/Models/ModelLoader.js"></script>
<script>
var scene = new THREE.Scene( );
var camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.01, 10000 );
var renderer = new THREE.WebGLRenderer( );
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
camera.position.z = 3;
var controls = new THREE.OrbitControls(camera, renderer.domElement);//here is the problem
var pointLight = new THREE.PointLight(0,2);
pointLight.position.z = 2;
scene.add(pointLight);
// Game Logic
var update = function( ){
}
// Draw Scene
var render = function( ){
renderer.render( scene, camera );
}
var testLoad = function(){
var modelLoader = new ModelLoader();
var obj = modelLoader.loadObj("/Res/Models/Characters/char1.obj", "/Res/Models/Characters/char1.mtl");
scene.add(obj);
}
// Main Game Loop(update, render, repeat)
var gameLoop = function( ){
requestAnimationFrame( gameLoop );
update( );
render( );
}
gameLoop();
ModelLoader是用于加载obj文件的自定义类。
知道我做错了什么的人吗?预先感谢!
答案 0 :(得分:2)
您有错字:
<scirpt src="JS/OrbitControls.js"></scirpt>
应该是
<script src="JS/OrbitControls.js"></script>