KineticJS - 原始圖像顯示在移動

Question

從這裏開始，例如：http://www.html5canvastutorials.com/labs/html5-canvas-drag-and-drop-multiple-images-with-kineticjs/

我想用這個上的PhoneGap項目的一些測試。問題是，一旦圖像移動，就會有相同的圖像卡在原始起始位置。這就像圖像創建了兩次。從桌面查看時不會發生這種情況，有人知道這是怎麼發生的？

function loadImages(sources, callback){ 
    var images = {}; 
    var loadedImages = 0; 
    var numImages = 0; 
    for (var src in sources) { 
     numImages++; 
    } 
    for (var src in sources) { 
     images[src] = new Image(); 
     images[src].onload = function(){ 
      if (++loadedImages >= numImages) { 
       callback(images); 
      } 
     }; 
     images[src].src = sources[src]; 
    } 
} 

function initStage(images){ 

    var stage = new Kinetic.Stage("container", wW, wH); 

    var layer = new Kinetic.Layer(); 

    var darthVaderImg = new Kinetic.Image({ 
     image: images.darthVader, 
     x: 100, 
     y: 40 
    }); 

    darthVaderImg.draggable(true); 

    darthVaderImg.on("dragstart", function(){ 
     this.moveToTop(); 
     stage.draw(); 
    }); 

    layer.add(darthVaderImg); 

    // yoda 
    var yodaImg = new Kinetic.Image({ 
     image: images.yoda, 
     x: 350, 
     y: 55, 
    }); 

    yodaImg.draggable(true); 

    yodaImg.on("dragstart", function(){ 
     this.moveToTop(); 
     stage.draw(); 
    }); 

    layer.add(yodaImg); 

    stage.add(layer); 

} 

var wH = window.innerHeight, 
    wW = window.innerWidth, 
    mCanvas = document.getElementById('container'), 
    app = { 

    initialize: function() { 
     this.bindEvents(); 
    }, 

    bindEvents: function() { 
     document.addEventListener('deviceready', this.onDeviceReady, false); 
    }, 

    onDeviceReady: function() {  
     app.receivedEvent('deviceready'); 
     var sources = { 
      darthVader: "img/darth-vader.jpg", 
      yoda: "img/yoda.jpg" 
     }; 
     mCanvas.style.width = wW; 
     mCanvas.style.height = wH; 
     loadImages(sources, initStage); 
    }, 

    receivedEvent: function(id) { 

    } 

}; 

if(typeof PhoneGap !== 'undefined') { 
    app.initialize(); 
}else{ 
    window.onload = function(){ 
     app.onDeviceReady(); 
    } 
} 

Answer 1

我已經看到這個測試我的網頁與Adobe Edge Inspect。但它只發生在瀏覽器上。使用適用於Android的Google Chrome瀏覽器可正常運行。