0
私はthree.jsで始まります。そして今、問題が見つかり、助けが必要です。シンプルに見えますが、私は良い答えを見つけることはありません。問題は、OrbitControls.js（CODE1）の使用を宣言しても、DOMの3つのツリーに表示されていても（図1）。コンストラクタ（CODE 2）を使用しようとすると、エラーが発生します。 "TypeError：THREE.OrbitControlsはコンストラクタではありません"図2TypeError：THREE.OrbitControlsはコンストラクタではありません
CODE1 :***index.html***
<html>
<head>
<title>My first three.js app</title>
<style>
body { margin: 0; }
canvas { width: 100%; height: 100% }
</style>
</head>
<body>
<script src="js/libs/three.min.js"></script>
<script src="js/cena.js"></script>
<script src="js/libs/AxisHelper.js"></script>
<script src="js/libs/GridHelper.js"></script>
<script src="js/libs/OrbitControls.js"></script>
</script>
</body>
</html>
CODE2***:cena.js***
var cena = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
var renderizador = new THREE.WebGLRenderer({antialias:true});
renderizador.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderizador.domElement);
//----------------------------
var geometry = new THREE.BoxGeometry(3, 1, 2);
var material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
var cube = new THREE.Mesh(geometry, material);
var axisHelper = new THREE.AxisHelper(5);
cena.add(axisHelper)
var tamanho = 10;
var elementos = 10;
var grid = new THREE.GridHelper(tamanho,elementos);
cena.add(grid);
cena.add(cube);
camera.position.z = 10;
camera.position.y = 10;
camera.position.x = 5;
var lookat_vector = new THREE.Vector3(0,0,0);
camera.lookAt(lookat_vector);
//++++++++++++++++++++++++++++++++++++++++++++++++++++++
var controle = new THREE.OrbitControls(camera, renderizador.domElement);
var render = function() {
requestAnimationFrame(render);
controle.update();
cube.rotation.x += 0.01;
cube.rotation.y +=0.01;
cube.rotation.z +=0.03;
renderizador.render(cena, camera);
//controle.update();
};
render();
ビンゴ。あなたは正しい。信じられない。 –