0

我有以下 JS 函数,我用它来检测图像何时被拖到 HTML5 画布上的某个位置:

function isHit(mouseX, mouseY, obj){
console.log("isHit has been called from within if statement in mousemove function");
console.log("draggingImage variable value = " +draggingImage);
if(draggingImage == true){
    console.log("if dragging image == true statment is being called");
    console.log("Value of selectedImage = " + selectedImage);
    console.log("Value of selectedImageArrayLocation = " + selectedImageArrayLocation);
    if(mouseY > 250){
        console.log("Value of obj.shape.index = " +obj.shape.index);
        if((mouseX > 80) && (mouseX < 200) && (selectedImageArrayLocation >= 0) && (selectedImageArrayLocation <= numImagesAssets)){
            console.log("Correct");
            document.getElementById('tipsParagraph').innerHTML = "Correct! This is an asset because it is an item that can be bought or sold for cash.";
            selectedImage.remove();
            console.log("selectedImage has been removed: " + selectedImage);
        }else{
            console.log("Incorrect");
            document.getElementById('tipsParagraph').innerHTML = "Incorrect! This icon is an asset because it is an item that can be bought or sold for cash.";
        }
    }
}
}

如果图像被拖到正确的位置,我想将其从画布中删除,并为用户提供一些反馈。如果它被拖到错误的位置,我想将图像留在画布上,并为用户提供反馈。

每当拖动图像时,我都会从我的mousemove函数中调用上述函数(我有一个布尔值,每当mousedown在图像上检测到 a 时将其设置为 true,并且在检测到 a 时将其设置为 false mouseup

目前,当图像被拖到正确的位置时,它会从画布中移除,并向用户提供反馈,但数组中其余图像的位置随后会重新排序。

我想知道这是否是因为selectedImage.remove();我上面的函数中的行正在从数组中删除图像,而不仅仅是从画布中?

我如何从画布中删除图像,而不是从数组中删除,记住我已经使用 KineticJS 库将所有​​图像绘制到画布上?

4

1 回答 1

0

尝试通过以下方式隐藏形状:

selectedImage.hide();

而不是删除它。该hide()方法内置于 KineticJS 中。
如果即使这样也不起作用,也许将不透明度设置为 0:

selectedImage.setOpacity(0);
于 2013-03-19T22:57:25.520 回答