Search code examples
javascripteaseljscreatejs

CreateJS - d.mousedown.f error on hitAreas

While programming in CreateJS I have encountered a bug:

Unhandled exception at line 13, column 10113 in https://code.createjs.com/createjs-2014.12.12.min.js

0x800a138f - Runtime Error JavaScript code: Can not retrieve "matrix" properties for undefined or empty appeal

This bug appears only when I add a hit area into an image:

    function drawButton(e) {
        var button = new createjs.Bitmap(e.target);
        var newContainer = new createjs.Container();
        newContainer.addChild(button);
        var label = new createjs.Text("Next round", "20 px Arial", "#000");
        newContainer.addChild(label);
        button.hitArea = new createjs.Rectangle(0, 0, 100, 100);
        button.addEventListener("click", onClick);
        buttonContainer.addChild(newContainer);

        GameData.hudStage.update();
    }

After removing: button.hitArea = new createjs.Rectangle(0, 0, 100, 100); the bug does not appear. Is it a a library bug, or did I something miss?

Solution

  • hitArea has to be a DisplayObject - but you're trying to assign a Rectangle as a hitArea, which isn't a DisplayObject. If you use a Shape (or so) the code should work as expected:

     var shape = new createjs.Shape();
 shape.graphics.beginFill("#000000").drawRect(0, 0, 100, 100);

 button.hitArea = shape;