I have been haven some problems trying to replace a image in an existing Object. I have a example of the code I am using to do this.. The background image loads and shows on the canvas fine.. But when I call the handleReplaceImage function it doesn't replace the existing image, but adds the new image so I get the old and the new both in the same CreateJS Object.. So on the canvas I see two Slate Holes when it should be just the new one. So its overlaying..
How do I total replace SlateHole1.png with SlateHole2.png?
Or remove SlateHole1.png from the CreateJS Object?
I guess both would be worth knowing if anyone can help...
var SlateHole=null;
function init(){
stage=new createjs.Stage("Canvas");
createjs.Touch.enable(stage);
var SlateHoleSrc=new Image();
SlateHoleSrc.src="images/SlateHole1.png";
SlateHoleSrc.onload=handleSlateHoleLoad;
}
function handleSlateHoleLoad(event){
SlateHole=new createjs.Bitmap(event.target);
stage.addChild(SlateHole);
stage.update();
}
function handleReplaceImage(event){
var SlateHoleSrc=new Image();
SlateHoleSrc.src="images/SlateHole2.png";
SlateHoleSrc.onload=handleSlateHoleChange;
}
function handleSlateHoleChange(event){
SlateHole.image=event.target;
stage.update();
}