displayObject.hitArea 与其所有者无关

displayObject.hitArea not relative to it's owner

我一直在测试hitarea。而且似乎 hitarea 与父元素缩放或移动没有任何关系。基本上你可以从这个 fiddle 测试:http://jsfiddle.net/7rchubyd/4/ .

有没有我没有考虑到的事情,或者有人对如何实施这个有好的建议吗?

jsfiddle 有问题的代码:

var c = document.getElementById("can");
var stage = new createjs.Stage(c);

var shape = new createjs.Shape();
shape.graphics.beginFill("#666666")
    .drawPolyStar(50, 50, 50, 6, 0, 30);

var shapeHitArea = new createjs.Shape();
shapeHitArea.graphics.beginFill("#FF0000")
    .drawPolyStar(50, 50, 50, 6, 0, 30);

shape.hitArea = shapeHitArea;

stage.addChild(shape);

stage.addEventListener("stagemousedown", function (e) {
    stage.addEventListener("stagemousemove", mouseMoveCB);
});

stage.addEventListener("stagemouseup", function (e) {
    stage.removeEventListener("stagemousemove", mouseMoveCB);
    var objects = stage.getObjectsUnderPoint(e.stageX, e.stageY);
    document.getElementById("objectCount").innerHTML = objects.length;
});

stage.update();

document.getElementById("scale").addEventListener("click", function() { 
    stage.scaleX *= 1.5;
    stage.scaleY *= 1.5;
    stage.update();
});

function mouseMoveCB(e) {
    stage.x = e.stageX;
    stage.y = e.stageY;
    stage.update();
}

这看起来像是一个专门针对缩放舞台的错误。我将在 GitHub 存储库中为此提交错误。

要解决此问题,只需将您的转换直接应用于实例 shape.scaleX = 2;http://jsfiddle.net/1bc396d5/

或者,将您的项目移至 Container 并对其应用转换而不是 stagehttp://jsfiddle.net/1bc396d5/1/