javascript - 在 jCanvascript 中转换为图像

Question

我应用 jcanvaScript（JavaScript 库）

在画布元素上有一些图像如何交换位置图像（例如单击鼠标后）？

    function start(){   

// Add mouse listener.
canvas = document.getElementById('firstCanvas');

canvas.addEventListener('click',coordinateClick);

    var img =[];
    for(var i=0;i<16;i++){
    img[i]=new Image;
    img[i].src="./image/"+i+".png";
    }

    jc.start('firstCanvas',true);

        function allOnloadImages(){//initialization by canvas id


            for(var i=0;i<16;i++){

            jc.image(img[i],cordinaImg[i][0],cordinaImg[i][1]).id('img'+i);

            };              

    };              

    jc.start('firstCanvas');

    for(var i=0;i<img.length;i++){
        img[i].onload=allOnloadImages;          
    }

}
function coordinateClick(e){

 ...    
//here we interchange the position of pictures 


    jc('#img'+i).translateTo(cordinaImg[numberFieldEmpty][0],cordinaImg[numberFieldEmpty][1]+11);
 jc('#img15').translateTo(cordinaImg[i][0],cordinaImg[i][1]+11);
...

    }

因此存在图片的分叉，即同一张图片的两个副本……例如，如果是这样，则不会删除任何内容

jc('#img'+i).del();//