0

このリンクを参照してください

キャンバスが読み込まれると、ヨーダとダース ベイダーの 2 つの画像が表示されます。

Yoda をクリックして (選択する)、キャンバスの下の [変更] ボタンをクリックできるようにしたいと考えています。このボタンをクリックすると、ヨーダがダース ベイダーに置き換わり、「2 番目の」ダース ベイダーが選択されたままになります。

私のコードは次のとおりです。

  function replaceImage(i, callback) {

      selectedGroup.destroy();

      var images = {};
      images[i] = new Image();
      images[i].onload = function() {
          callback(i,images);
      };
      images[i].src = sources[i].path;    
  }

selectedGroup.removeChildren() で試してから、画像を手動で追加しましたが、どちらも機能しません-つまり

function replaceImage(i) {

      selectedGroup.removeChildren();

      var image = new Image();

        var newImage = new Kinetic.Image({
            id: i,
            image: image,
            x: 0,
            y: 0,
            width: sources[i].width,
            height: sources[i].height,
            name: 'image',
            stroke: 'red',
            strokeWidth: 2,
            strokeEnabled: false        
          });

        newImage.src = sources[i].path;
        selectedGroup.add(newImage);                  
  }

誰かが私が間違っていることを見ることができますか?

助けてくれてありがとう！

4

1 に答える 1

1

Yodaオブジェクトを破壊して新しいVaderオブジェクトを作成するsetImage代わりに、Yoda ImageをVaderイメージに置き換えるために使用するだけではどうですか?

何かのようなもの：

// get the image object from the selected group
var ImageObjects = selectedGroup.get("Image");
var ImageObject=ImageObjects.toArray()[0];

// keep the Kinetic.Image object
// but replace its image
ImageObject.setImage(myNewImage);
于 2013-07-17T16:58:12.747 に答える