JavaScript：将图像数组绘制到HTML5画布阵列位置时将它们重新排序

Question

我有以下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功能，当图像被拖动上面的函数（我只要检测到mouseup每当图像上检测到mousedown被设置为true，并设置为false一个布尔值。

此刻，当图像被拖动到​​正确的位置时，它会从画布中移除，并向用户提供反馈，但是阵列中其余图像的位置将被重新排序

我想知道这是因为我上面的函数中的行selectedImage.remove();是从数组中删除图像，而不是ju st从画布？

我该如何从画布中删除图像，但不是从数组中删除图像，记住我使用KineticJS库将所有图像绘制到画布上？

Answer 1

试图通过藏匿形状：

selectedImage.hide(); 

删除它代替。 KineticJS内置hide()方法。
如果连这个也不行，也许不透明度设置为0：

selectedImage.setOpacity(0);