2012-08-09 83 views
0

需要一些幫助.. 我不知道它是否是kinetic.js庫問題或我在這裏做錯了什麼.. 我是在windows.onload上加載2個圖像 然後在畫布外有一組圖像,並且我將這些圖像放在畫布內部,這些圖像工作正常。(我只用了一個函數來加載任何圖像通過這樣做.. 組圖像畫布外:Kinetic.js從畫布上移除圖像上的按鈕點擊按鈕

 <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)功能不起作用。

和這個函數是在一個意想不到的行爲方式..

任何指針

謝謝..

+0

你可以發佈一個問題的工作示例到http://jsfiddle.net? – 2012-08-09 14:58:03

回答

1

如果要刪除的圖像的原因是隱藏它,你可以簡單地使用。隱藏()函數:

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

與你的代碼是你用來layert.draw();卸下後stage.remove(layert);另一個問題,所以WH你已經刪除了這個圖層,你不能繪製它。

+0

嘿明白了..我改變了一下代碼..謝謝.. :) – ashishashen 2012-08-10 11:17:46

+0

我歡迎你,讓我知道如果你有任何進一步的問題。 – 2012-08-10 17:11:20