0

I draw 2 shapes, one above the other. The getObjectsUnderPoint function returns only one shape even the point is part of both shapes. The point I get in addEventListener handler of the upper shape. Here is full jsfiddle example.

var stage;

function init() {
    stage = new createjs.Stage("canvas");
    var rect = new createjs.Shape();
    rect.graphics.beginFill("#ff0000").drawRect(10, 10, 100, 100);
    stage.addChild(rect);
    var circle = new createjs.Shape();
    circle.graphics.beginFill("#00ff00").drawCircle(60, 60, 40);
    circle.addEventListener("click", onClick);
    stage.addChild(circle);
    stage.update();
}

function onClick(e) {
    // the length should be 2: circle + rectangle, but is only 1 ???
    alert(stage.getObjectsUnderPoint(e.stageX, e.stageY).length);
}
Petr Felzmann
  • 1,271
  • 4
  • 19
  • 39

1 Answers1

2

This is a bug in 0.7.1 that has since been patched and is confirmed to be fixed in version 0.8.2 as Pim Schaaf has demonstrated with this fiddle. If you are stuck with version 0.7.1, you can use the workaround described here by iterating over the children of the container and calling hitTest(x, y) giving the mouseX and mouseY as parameters.

Community
  • 1
  • 1
Andrew
  • 1,030
  • 13
  • 24
  • The link has died. It appears this is fixed in more recent versions of easeljs (0.8.2). See http://jsfiddle.net/84oz06t4 with EaselJS 0.8.2. – Pim Schaaf Aug 26 '16 at 07:56
  • 1
    @PimSchaaf: I edited my answer to better explain the issue. Thanks for bringing the broken link to my attention. – Andrew Aug 26 '16 at 13:18
  • Great, thanks! (small typo in my name there, but no worries xD) – Pim Schaaf Aug 26 '16 at 14:55