I have been working on a webpage that is inspired by the CSS3D molecules sample from ThreeJS's library. You can check out the original sample here.
In my project, I am dynamically creating new nodes (atoms) and attaching them to existing nodes. Once I add the new atom to the scene, I want to bring it to the forefront using the least amount of rotate, pan, and zoom operations possible. While I know how to perform each of these operations individually, I am struggling with calculating the optimal sequence based on the current position and quaternion of the node where the atom was created, and its new position at (0, 0). I plan to animate the transition from the old position to the new one, so I cannot simply assign the new values to the element's position and quaternion. I want to animate the movement over time, applying a fraction of each operation (pan, zoom, rotate) per animation frame.
Does anyone know of any ThreeJS methods that could assist me in achieving this?