Nebulocity Posted June 17, 2014 Share Posted June 17, 2014 I want to do two things:Draw concentric circles Not have them "filled"At first, I tried doing the following: var ctx = this.game.canvas.getContext('2d'); // First circle ctx.beginPath(); ctx.arc(game.world.centerX, game.world.centerY, 50, 0, 360); ctx.lineWidth = 1; ctx.strokeStyle = 'red'; ctx.stroke(); // Second circle ctx.beginPath(); ctx.arc(game.world.centerX, game.world.centerY, 100, 0, 360); ctx.lineWidth = 1; ctx.strokeStyle = 'green'; ctx.stroke(); // Third circle ctx.beginPath(); ctx.arc(game.world.centerX, game.world.centerY, 150, 0, 360); ctx.lineWidth = 1; ctx.strokeStyle = 'blue'; ctx.stroke(); // The alert acts as a "pause" so that I can see the circles drawn, // Before they get drawn over by displaying my sprites in phaser. alert('pause'); So it works! But then (after the alert), my sprites drawn with Phaser show up, which erases the circles that I drew. I want these circles to show up as part of my background (without having to resort to a background image for the canvas). I tried rummaging around in the Phaser documentation, and while there is a Phaser.Circle class, doesn't seem to have a "no fill" propert to it. But even with that being said, drawing circles like this doesn't work. circle = new Phaser.Circle(game.world.centerX, game.world.centerY, 100)Nothing shows up at all. So I'm not sure what I should be doing...if I draw it on the canvas directly, it gets overwritten. If I try drawing circles with Phaser (although, they're "filled" from what I can tell in the examples), they don't show up. Any help would be appreciated. Link to comment Share on other sites More sharing options...
lewster32 Posted June 17, 2014 Share Posted June 17, 2014 See my post on your other topic: http://www.html5gamedevs.com/topic/7220-drawing-circles/ Link to comment Share on other sites More sharing options...
Recommended Posts