How to detect onClick in Circle graphics ?

[kenshero]

i use this code

    var circles = this.game.add.graphics(this.game.world.centerX, this.game.world.centerY);
    circles.lineStyle(1, 0x0000ff);
    circles.drawCircle(0, 0, 200); // and finally add the third 1px wide unfilled blue circle with a radius of 150
    circles.inputEnabled = true
    circles.events.onInputDown.add(function(){
      console.log("cire click");
    }, this)

 

but not working. Can i detect click in Circle ?

[mickeyren]

maybe create a circle Phaser.BitmapData and use that to create a a Phaser.Sprite? Pretty sure sprites can detect input events.

[kenshero]

problem of sprite . i found around circle is rectangle picture i can click blank space. I dont want detect onclick blank space.  

[casey]

Do you mean you can click on the stage? Is your circle a BitmapData object?

[samme]

You can create a Phaser.Circle and then set hitArea.

[MrRoboman]

To fix the problem of the clicking the rectangle you can check the distance between your click and the center of the circle and compare it to the radius of the circle.

var distanceToCenterOfCircle = Phaser.Math.distance(circle.x, circle.y, pointer.x, pointer.y);
var circleRadius = 100;
if (distanceToCenterOfCircle <= circleRadius){
  // Do click logic.
}