Choppy animation with Javascript function

Using JavaScript with Hype
1

Hi, I'm using Hype Pro 3.6.10 and I'm experiencing choppiness after scaling a symbol the second time using the following javascript function:

var webcam1El = hypeDocument.getElementById('webcam1');

hypeDocument.setElementProperty(webcam1El, 'scaleX', '0.51', '0.4', 'easeinout')
hypeDocument.setElementProperty(webcam1El, 'scaleY', '0.51', '0.4', 'easeinout')
hypeDocument.setElementProperty(webcam1El, 'top', '66', '0.3', 'easeinout')
hypeDocument.setElementProperty(webcam1El, 'left', '38', '0.3', 'easeinout')

The first time I scale and move the symbol, the animation is smooth, after the second time the animation becomes very choppy. This happens in all browsers.

See this example video

choppy animation.zip (1.8 MB)

2

I can reproduce with v3.6.10, but not with the latest v4.1.7. I'd give that version a try (after first duplicating your document so it isn't upgraded incompatibly with v3).

Please note that v3 is no longer supported.

3

I haven't bought v4 so I can't upgrade, but thanks for replying anyway!

I guess I'll do the animation entirely in JS + SVG :cold_sweat:

4

Understood.... If it is a quick go, you can use the 14-day trial. There are also discounts available for v3 users.