HTML 5 canvas not supporting gradients, showing black patches in preview

[bunki]

Dear all, '

I am unable to find a standard and defined solution for this. I have to convert several .fla files done with older versions in to HTML5. So I used the Animate's 'Convert to other document formats' option. It successfully converts but with warning "Only circular (not oval) radial gradients are supported."

When I preview it shows black color where the gradients were applied. I was successful to individually change them to solid color with outline. Yet there must be a way to apply gradients (including radial) to animate symbols so that it will work fine in HTM5 animations. If anybody had come across this situation and suggestions welcome.

[kglad · Accepted solution]

var g = new createjs.Graphics();

g.beginRadialGradientFill(["#FF0000", "#00FF00"], [0, 1], 100, 100, 0, 100, 100, 50).drawCircle(100, 100, 50);

var s = new createjs.Shape(g);

s.x = 100;

s.y = 100;

stage.addChild(s);

stage.update();

[bunki]

Hi kglad,

Can you elaborate your reply please. What you seem to suggest is draw new gradient filled shapes. My issue is converting existing flash project with gradients.

[kglad]

if you have a radial gradient already assigned to an on-stage object, that will get converted during the conversion process or, at least, it does for me using animate 19.2/windows.