Set pivot point to center of object imported from Blender

Ohh, that’s great, thank you so much, Don!

I thought that when I imported the tape.gld file I was just importing the tape mesh, and nothing else. I didn’t realize that the mesh was the child of a scene, and that I had to specifically find that child and manipulate it, rather than manipulate the entire scene that it sat inside. Poking around inside console.log(sceneTape); helped me understand that better.

I put a simplified working version here in case anyone finds this question later and wants to understand what I did:
https://themoaa.org/temp/rotate/index2.html

You can do a view source to see how that demo works. One thing that I did as an aide memoire was to use the variable name sceneTape so that it’s clear throughout the code that it’s referring to a whole scene, not just a mesh:

var sceneTape;

// load tape model
var loader = new THREE.GLTFLoader();
loader.load("tape.glb", function(gltf) {
  sceneTape = gltf.scene;
  sceneTape.scale.set(2,2,2);
  scene.add(sceneTape);
}, undefined, function(error) {
  console.error(error)
});

To spin the tape I used:

// spin the tape
function spinTape() {
  if (sceneTape) {
    //console.log(sceneTape);
    meshTape = sceneTape.getObjectByName('tape_-_left_-_reel');
    meshTape.rotation.y += 0.05;
  }
  updateRequest = window.requestAnimationFrame(spinTape);
}
spinTape();

(Note for other newbies: this was just a proof of concept, and some of the code was copied from elsewhere and might be out of date, so don’t take anything you see there as best practice.)

2 Likes