javascript - THREE.js Object Won't Rotate -


i have blender object able displayed on web page using three.js, object isn't rotating when loop function called.

i'm trying maintain oop approach while working js.

here's code snippet.

var scene, camera, renderer, box;  function createscene() {     scene = new three.scene();      renderer = new three.webglrenderer();     renderer.setsize(window.innerwidth, window.innerheight);     renderer.setclearcolor(0x3399ff);      camera = new three.perspectivecamera(75, window.innerwidth/window.innerheight, 0.1, 1000);     camera.position.z = 10;      container = document.getelementbyid('world');     container.appendchild(renderer.domelement); }  function createlight() {     light = new three.pointlight(0xffffff, 1.2);     light.position.set(0,0,6);      scene.add(light); }  function createbox() {     box = new box(); }  box = function() {     this.mesh = new three.object3d();    var loader = new three.jsonloader();   loader.load('json/model.json', function(geometry, materials) {       this.mesh = new three.mesh(geometry, new three.multimaterial(materials));       this.mesh.scale.x = this.mesh.scale.y = this.mesh.scale.z = 0.75;       this.mesh.translation = geometry.center();       scene.add(mesh);   }); }  box.prototype.rotatebox = function() {     if (!this.mesh) {         return;     }      this.mesh.rotation.x += .001;     this.mesh.rotation.y += .01; }  function loop() {     requestanimationframe(loop);     box.rotatebox();     renderer.render(scene, camera); }  function init() {     createscene();     createlight();     createbox();     loop(); }  window.addeventlistener('load', init, false); 

i think it's scope issue. code provided throw errors. might try this:

box = function() {   this.mesh = false;   var loader = new three.jsonloader();   var scope = this;   loader.load('json/model.json', function(geometry, materials) {       scope.mesh = new three.mesh(geometry, new three.multimaterial(materials));       scope.mesh.scale.x = scope.mesh.scale.y = scope.mesh.scale.z = 0.75;       scope.mesh.translation = geometry.center();       scene.add(scope.mesh);   }); }  box.prototype.rotatebox = function() {     if (!this.mesh) {         return;     }      this.mesh.rotation.x += .001;     this.mesh.rotation.y += .01; } 

your scope of "light" object left unhandled , needs fixed.


Comments