Viewer API: animation play pause


(Klaasnienhuis) #1

I just saw this model and animation:

Futuristic car for 3d printing by DennisH2010 on Sketchfab

It would be pretty cool and useful to be able to play/pause the animation through the viewer API. Coupled with the current ability to update the camera position and as such make camera animations this could be a great feature for instructions, infographics or any step-by-step content.
I think being able to play and pause the animation could be included. Also a method which says: play frame 50 to 150 at 2x speed would be useful.

(Andrew Leahy) #2

Hi, I've started working a bit with Viewer API and would really like control over the animation. So I wanted to support this request with more than a :heart: !

My API suggestions:

For the following, if using "frames" doesn't make sense, then time in seconds would be okay.

api.setAnimationFrame(frame) // jump to frame number. Could be used for a 'rewind' button or for skipping to start of a particular sequence.

api.getAnimationFrame() // retrieve the current frame number or something similar if using time

api.getAnimationLength() or getAnimationDuration() // return total frame count or total playtime in seconds

api.setAnimationRate( multiplier ) // 0.5 half speed, 1 normal, 2 double speed

Also add ui_animations: [0|1 to viewer/embed settings. So the UI overlay can be toggled. If you're going to have all those API things, developers will also want to replace the player UI, so being able turn it off is a good start.

Tip: Have a peak at the youtube iframe API to get an idea what they offer.

Cheers, Andrew | Western Sydney University

(Studioxygene) #3

Met with some members of the team today, I'll get into the API asap. It's not about playing/pausing an animation but it's possible to do some transforms on any mesh in your scene with an annotation "trigger". Also let's add some :heart:


There are a few functions:

translate( [nodeID], [translateTo], [duration], [easing], [callback] )

rotate( [nodeID], [rotateTo], [duration], [easing], [callback] )

getMatrix( nodeID, callback )

Returns the transform matrices for a given node.
The callback will be passed (err, matrices).

setMatrix( nodeID, matrix, [duration], [callback] )

Sets the transform matrix of a given node.
The callback will be invoked with no parameter.

(Studioxygene) #7

Hello @james,

I made a simple trigger using the annotations to move a mesh with the api.translate function. It was working well last week and without any changes it no longer works. Here is the current code. And the test page :

api.addEventListener( 'annotationFocus', function( index ) {
   console.log ( 'Annotation n°' + (index +1));
   if (index+1 == 3) {
       api.translate( 427, [-75,60,0], 2,0.2);
       api.translate( 442, [75,60,0], 2,0.2);
   else if (index+1 == 4) {
       api.translate( 427, [-38,60,0], 2,0.2);
       api.translate( 442, [38,60,0], 2,0.2);
} );

As I did not change anything I checked everything. Using the getNode function I've realized that the instanceIDs changed since last time, any reason ? Anyway I changed the instanceIDs used in the api.translate and still nothing. Any ideas ?




I don't think you can count on the IDs to stay constant. You should get them programmatically based on the nodes' names. @shaderbytes ?


(Shaderbytes) #9

The question now is does this api function accept node names as the first argument? It is not documented..

edit , anyway just thought about it you can use the name to retrieve the current id anyway.. check out my api utility it handles getting the node objects by name. I should wrap this function in my utility as well since getting a node by name can possibly return an array if there are multiple objects with the same name.

James do you have an exhaustive list of all undocumented api functions? please send it to me so I can see what else I caan add to the utility, like this for example.


@shaderbytes those are the only undocumented functions that I know of, although I haven't dug into the api object super thoroughly.

(Studioxygene) #11

@shaderbytes hello, thanks for the info, but I'm not good with javascript, and checking your example api pages I'm not sure how to use the retrieve unique objects by names in my case. Could you help me a bit ?

(Shaderbytes) #12

I updated the utility and made some sample pages. Translate function has now being added , read here :