Where can I find a list of properties that can be used on MC in ANCC Canvas?

[avid_body16B8]

I am making an analog clock animation (not real time) and I used this:

var hand = this.minuteHand, h = 0;
setInterval(function(){ 
        hand.rotation = h+=5;
    }, 1000);

I am wondering if I could have an easing dynamically like easein bounce?

Also is there a list of properties that can be used. Of course I know a few like opacity, x, y, scaleX, scaleY, etc.... But I feel there are a lot I am missing.

[ClayUUID]

In the official documentation, of course.

https://www.createjs.com/docs/easeljs/classes/Container.html

[avid_body16B8]

Thanks.

[ClayUUID · Accepted solution]

Also...

var hand = this.minuteHand; 
setInterval(function() {
    var h = (hand.rotation + 5) % 360;
    cjs.Tween.get(hand).to({rotation: h}, 500, cjs.Ease.bounceOut);
}, 1000);

https://www.createjs.com/docs/tweenjs/modules/TweenJS.html

https://www.createjs.com/demos/tweenjs/tween_sparktable

[avid_body16B8]

Oh cool! Thanks. Pretty awesome!

[ClayUUID]

Shouldn't you be incrementing by 6 though, instead of 5? Last I checked there aren't 72 seconds in a minute.

[avid_body16B8]

Well you are right. I changed that and I also changed the timing because I need an accelerated clock rather than an accurate one in this particular case (like time travel) and added the hour hand too but without bounce.

[ClayUUID]

BTW, since this is a continuous rotation, you'll need some extra logic to keep the hand from sweeping backwards when it tweens from near 360 to back near 0.

setInterval(function() {
    var h = hand.rotation % 360;
    hand.rotation = h;
    h += 6;
    cjs.Tween.get(hand).to({rotation: h}, 500, cjs.Ease.bounceOut);
}, 1000);

or...

setInterval(function() {
    var h = 6 + (hand.rotation = hand.rotation % 360);
    cjs.Tween.get(hand).to({rotation: h}, 500, cjs.Ease.bounceOut);
}, 1000);

[avid_body16B8]

I actually redid it last night and here is my clock. After thinking about it, I decided to do a real time clock.

I made a sample to share here. Thanks for your help.

https://drive.google.com/open?id=1q_E9edyUdxVib03vquqf6Luq3jg8bCXe

[avid_body16B8]

I really do not see any way to implement an easing dynamically like with CSS or jquery animate().