3D rotation not working in HTML5 Canvas

Forum|Forum|5 years ago
July 22, 2020
2 replies
2173 views

Hello, I have an fla file that I'm trying to bring into HTML5 that has some 3D rotation animation in it. When I convert it, it tells me "* 3D cannot be imported in HTML5 Canvas document." I tried converting every frame of the animation into keyframes so that the tweening wasn't there anymore, but it doesn't work. Instead, the text I'm rotating moves to the upper left corner of my canvas and doesn't rotate at all. (It works on the original fla file, but not on the HTML5 Canvas version of it.) I'm using Animate 20.0.2. Any help is greatly appreciated!

This topic has been closed for replies.

PATurmel12

Inspiring

Appears to be not supported for HTML5. Probably 3D transformations in Javascript are too browser dependant for Adobe Animate.

There are javascript libraries online, or you can make symbols with 'Animate's Air for Desktop' and publish as PNG.

Colin Holgate

Inspiring

It's the 3D transform that isn't supported, not the tween. In youe AS3 version you would need to replicate the effect you want without using the 3D Rotation Tool.

D

denisel08Author

Participant

Thanks Colin. I'm still kind of new to Animate so excuse me if this is a foolish question. I right clicked on the tween and chose "convert to frame-by-frame animation". Then the tween is gone, but it still won't work/look right when I convert the file to HTML5. I thought I was taking the right approach. Am I missing something here?

Colin Holgate

Inspiring

As I mentioned, the tween isn't the problem, it's the 3D transform you have done. You would need to go to each frame and find a way to get the same look just using the rotate and skew tools.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded