單擊畫布外部的按鈕時，Kinetic.js從畫布中刪除圖像

Question

需要一些幫助..我不知道這是不是dynamic.js庫問題，或者我在這里做錯了什么。.我正在windows.onload上加載2個圖像，然后在畫布外部和onclick上有一組圖像我將這些圖像放置在畫布中工作正常。.（我只使用了一個功能，即可通過此操作從畫布外部加載任何圖像。

     <li>
        <a href="javascript:void(0)" onclick="loadWithType(document.getElementById('i3'))">

        <img src="<?php echo base_url()?>images/eagle/baby1.png" id="i3"  alt="Pulpitrock"width="100" height="120" /></a>
         <a href="javascript:void(0)" onclick="removewithType(document.getElementById('i3'))">Close</a>
       </li>
     <li>
        <a href="javascript:void(0)" onclick="loadWithType(document.getElementById('i4'))">
        <img src="<?php echo base_url()?>images/eagle/pattern-1.png" id="i4" alt="Pulpit rock" width="100" height="120" /></a>
        <a href="javascript:void(0)" onclick="removewithType(document.getElementById('i4'))">Close</a>
        </li>

加載圖像

         function loadWithType(img){
        var sources = {
            yoda1 : img.src,
        };
        loadImages(sources,initStage1);
      };

功能（定義位置和全部）

           function initStage1(images){ 

            layert = new Kinetic.Layer();

            var yoda1 = new Kinetic.Image({
            image: images.yoda1,
            x: 106,
            y: 0,
            width: 180,
            height: 220,
            draggable:true,
            detectionType: "pixel"

            });


                    /*
                     * check if animal is in the right spot and
                     * snap into place if it is
                     */
                    yoda1.on("dragend", function() {
                            layert.draw();
                            // disable drag and drop

                            yoda1.saveImageData();
                    });

            layert.add(yoda1);
            stage.add(layert);
            yoda1.saveImageData();

            }

這工作正常。.（單擊它們加載圖像）

但是，當我嘗試通過關閉按鈕來刪除圖像時，我遇到了麻煩，因為最新的圖像被刪除了，並且在該庫之后引發了一個錯誤..我正在執行類似的操作。

          function removewithType(img){
        var sources = {
            yoda1 :img.src,
        };
        loadImages(sources,removeStage1);
        }

         function removeStage1(images){

                var yoda1 = new Kinetic.Image({
                image: images.yoda1,
                x: 106,
                y: 0,
                width: 180,
                height: 220,
                draggable:true,

            });
                layert.clear();
                stage.remove(layert);
                layert.draw();

                 }

這里首先.. layert.remov（yoda1）函數不起作用。

並且此功能的行為異常。

任何指針

謝謝..

Answer 1

如果要刪除圖像的原因是隱藏了它，則可以簡單地使用.hide（）函數：

yoda1.hide();
layert.draw();

代碼的另一個問題是您使用了layert.draw(); 在您刪除它之后stage.remove(layert); ，因此刪除此層后將無法繪制它。