BitmapData Circle Help (sandbox)

[UseTheForceFrodo]

Hey everyone,

 

I'm new to Phaser and love the sandbox functionality and editable examples, letting me test and try right there on the website. 

I've been looking at the Sprite From BitmapData example, but cannot seem to get it to display a circle instead of a rectangle. I've tried changing the line in the linked example page from:

bmd.ctx.rect(0,0,128,128);

to:

bmd.ctx.circle(0,0,50);

Every other line stays the same. The results I expect are a red circle with a radius of 50px in the same position as the rectangle/square. The results I get are a completely empty (black) canvas, regardless of the numbers I use for bmd.ctx.circle( ).

Am I doing something wrong? Do other people get an empty/black screen when they try change from a rectangle to a circle in the Sprite From Bitmapdata example?

Many thanks!

[rich]

You're accessing the BitmapData context directly - and an HTML5 Canvas Context has no method called 'circle'. Use BitmapData.circle instead.

[UseTheForceFrodo]

Hey Rich, thank you for getting back to me and thank you for your help! _{And sorry for the double post.}

 

I'm very new to all this (if you can't tell) and sadly still couldn't get it to work. 

[rich]

Here - like this: http://phaser.io/sandbox/LiVqqKGb

[UseTheForceFrodo]

I swear I tried that when I tried variants of your answer. Clearly not! Thank you so much Rich, I genuinely appreciate the assistance! Loving Phaser a lot so far (I went on to try other things after I couldn't figure out the silly circle thing).