Three.js, OBJLoader -> Uncaught ReferenceError: объект не определен

Question

Мой код ниже. Когда я раскомментирую object.rotation.y += (targetRotation - object.rotation.y) * 0.05; от render() или animate() функция Я получаю ошибку "Uncaught ReferenceError: object is not defined ".

Я пробовал что-нибудь, моя функция animate() даже в обратном вызове загрузчика, я попытался сменить three.js на более старую версию (в настоящее время использую r59), надеясь, что var object = event.content; может решить ее, никакого эффекта.

Я хочу добавить «щелчок и перемещение мыши, чтобы повернуть модель» юзабилити, у меня нет проблем с этим, когда его куб.

но он просто не будет работать с моей * obj.

Помогите? =)

 var scene, camera, renderer, loader, ambient, directionalLight; 

     var windowHalfX = 300; 
     var windowHalfY = 145; 

     var targetRotation = 0; 
     var targetRotationOnMouseDown = 0; 

     var mouseX = 0; 
     var mouseXOnMouseDown = 0; 

     init(); 

     function init() { 
      container = document.createElement('div'); 
      document.getElementById("3dbox").appendChild(container); 

      scene = new THREE.Scene(); 
      camera = new THREE.PerspectiveCamera(45, 600/290, 0.1, 1000); 
      //camera.position.set(-15, 10, 15); 
      renderer = new THREE.WebGLRenderer(); 

      renderer.setSize(600, 290); 
      container.appendChild(renderer.domElement); 

      // MODEL 
      var loader = new THREE.OBJMTLLoader(); 
      loader.addEventListener('load', function (event) { 
       var object = event.content; 
       scene.add(object); 
       animate(); 
      }); 
      loader.load('<?php bloginfo('template_directory'); ?>/obj/female02.obj', '<?php bloginfo('template_directory'); ?>/obj/female02.mtl'); 

      camera.position.z = 100; 
      camera.position.y = 10; 

      ambient = new THREE.AmbientLight(0x101030); 
      scene.add(ambient); 

      directionalLight = new THREE.DirectionalLight(0xffeedd); 
      directionalLight.position.set(0, 0, 1); 
      scene.add(directionalLight); 

      document.addEventListener('mousedown', onDocumentMouseDown, false); 
      document.addEventListener('touchstart', onDocumentTouchStart, false); 
      document.addEventListener('touchmove', onDocumentTouchMove, false); 
     } 

     function render() { 
      //object.rotation.y += (targetRotation - object.rotation.y) * 0.05; 
      renderer.render(scene, camera); 
     } 

     function animate() { 
      //object.rotation.y += (targetRotation - object.rotation.y) * 0.05; 
      requestAnimationFrame(animate); 
      render(); 
     } 

     function onDocumentMouseDown(event) { 

      event.preventDefault(); 

      document.addEventListener('mousemove', onDocumentMouseMove, false); 
      document.addEventListener('mouseup', onDocumentMouseUp, false); 
      document.addEventListener('mouseout', onDocumentMouseOut, false); 

      mouseXOnMouseDown = event.clientX - windowHalfX; 
      targetRotationOnMouseDown = targetRotation; 

     } 

     function onDocumentMouseMove(event) { 

      mouseX = event.clientX - windowHalfX; 

      targetRotation = targetRotationOnMouseDown + (mouseX - mouseXOnMouseDown) * 0.02; 

     } 

     function onDocumentMouseUp(event) { 

      document.removeEventListener('mousemove', onDocumentMouseMove, false); 
      document.removeEventListener('mouseup', onDocumentMouseUp, false); 
      document.removeEventListener('mouseout', onDocumentMouseOut, false); 

     } 

     function onDocumentMouseOut(event) { 

      document.removeEventListener('mousemove', onDocumentMouseMove, false); 
      document.removeEventListener('mouseup', onDocumentMouseUp, false); 
      document.removeEventListener('mouseout', onDocumentMouseOut, false); 

     } 

     function onDocumentTouchStart(event) { 

      if (event.touches.length === 1) { 

       event.preventDefault(); 

       mouseXOnMouseDown = event.touches[ 0 ].pageX - windowHalfX; 
       targetRotationOnMouseDown = targetRotation; 

      } 

     } 

     function onDocumentTouchMove(event) { 

      if (event.touches.length === 1) { 

       event.preventDefault(); 

       mouseX = event.touches[ 0 ].pageX - windowHalfX; 
       targetRotation = targetRotationOnMouseDown + (mouseX - mouseXOnMouseDown) * 0.05; 

      } 

     } 

Answer 1

Это потому, что «объект» является локальной переменной в вашей функции обратного вызова. Арам это глобально:

var object; 

Затем в обратном вызове

object = event.content; 

Three.js R.59