createjs struggling with hitTest()

Question

I am populating the canvas with small circles to form a shape and would like to destroy some of the circles where ever user clicks on the screen using the following function.

dotsArray : is the array of all circles dot.ball: is the circle being drawn bomb: is the circle drawn using user input being taken by the mouse click and hold.The bomb scales up in size as the mouse is pressed

function onMouseDown(event){
                bomb.x = event.stageX;
                bomb.y = event.stageY;
                bomb.active = true;
            }

function decimateBalls(){
                for (var i = 0; i < dotsArray.length; i++){
                    for ( var j = 0; j < dotsArray[i].length; j++){
                        var dot = dotsArray[i][j];
                        var pt = dot.ball.localToLocal(dot.ball.x, dot.ball.y,bomb);
                        if(bomb.hitTest(pt.x,pt.y)){
                            dot.setType("empty"); // this changes dot's circle to white making it seem invisible
                        }   
                    }
                }
        }

When I use the above code, even though i calculate the location of the small dots with respect to the bomb circle being drawn, the dots that disappear are the ones that are a lot offset from the bomb circle being drawn.

Am i doing something obviously wrong? Is there a better way to approach this problem? Thanks a lot for your time.

Answer 1

I used the following work around to get the desired result.

1. made sure everything is added to stage. got rid of containers.
2. Use if(bomb.hitTest(dot.ball.x - bomb.x,dot.ball.y - bomb.y)) and got rid of localToLocal() function provided by createjs to find local coordinates of an object with respect to another object.

Hope this helps someone who comes across a similar issue.