javascript - キネティック js で stage.toJSON() を使用してリロードするときに重複する画像を取得する

Question

私のキャンバスには、サイズ変更可能でドラッグ アンド ドロップをサポートする画像がほとんどありません。

キャンバスを保存した後、私はやっています

    var stage = Kinetic.Node.create(json, 'container');

キャンバスに単一の画像を追加するだけで問題ありません。しかし、複数追加すると、複数の画像が得られます。2 つの異なる画像を追加すると、それぞれ 4 つの画像が得られます。3 を足すと 3 になります。

ここに小さなスニペットがあります

   var stage = Kinetic.Node.create(json, 'container');
   var images = stage.get('.image');
   console.log(images) 

console.log で、同じ画像の複数の json 結果を取得しています。Rest Im は src を使用して画像をロードするだけです

   for(i=0;i<images.length;i++)
   {  
   //function to induce scope
   (function() {
   var image = images[i];

   console.log(images[i])
  var width = images[i].attrs.width;
  var height = images[i].attrs.height; 
  var imageObj = new Image();
  imageObj.onload = function() {
      image.setImage(imageObj);
       image.getLayer().draw();
    };
  imageObj.src = image.attrs.src;
  })();
 } 

Aなぜこれが起こっているのか知っている人はいますか?