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
并对其应用转换而不是 stage
:http://jsfiddle.net/1bc396d5/1/
我一直在测试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
并对其应用转换而不是 stage
:http://jsfiddle.net/1bc396d5/1/