CyberWEB

EaselJS: Haven problems replacing a bitmap image in a CreateJS Object

Recommended Posts

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();
}

 

Share this post


Link to post
Share on other sites

Suggestion: remove eventListeners when they complete their expected task - else passing the image around may invoke the same callback later unexpectedly.

You may also do well to separate loading concerns from appearance concerns - i.e. load the images first (e.g. using preloadjs), swap the images using interactive code later.  This can also help with the former suggestion.

 

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.