3D rotation not working in HTML5 Canvas

[denisel08]

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!

[Colin Holgate]

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.

[denisel08]

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]

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.

[PATurmel12]

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.