Forums » Help » Preload Images for animationsheet

hi, i have a small problem in my game. i create a lot of entities and kill them again and again. and sometime it happens, that the js cant get the image fast enought and so the entity is invisible :)

i have 10 images for the animsheets and create them like

this.animSheet = new ig.AnimationSheet( 'image'+balltype+'.png', 86, 86 );

can i preload these images so this will not happen again?

Make sure your AnimationSheets are loaded by the pre-loader. See Working with Assets.

Also, you probably shouldn&039;t change the #.animSheet property dynamically. Just load several AnimationSheets and use the ig.Animation constructor directly to specify the anim sheet, instead of the .addAnim() shorthand. Something like this:

EntityTest = ig.Entity.extend({
	animSheets: {
		steel: new ig.AnimationSheet( 'imagesteel.png', 86, 86 ),
		marble: new ig.AnimationSheet( 'imagemarble.png', 86, 86 )	
	},
	
	init: function( x, y, settings ) {
		this.parent( x, y, settings );
		this.anims.foo = new ig.Animation( this.animSheets.steel, 0.1, [0,1,2] );
		this.anims.bar = new ig.Animation( this.animSheets.marble, 0.1, [0,1,2] );
	},
	
	update: function() {		
		if( something ) {
			this.currentAnim = this.anims.foo;
			
		}
		else if( somethingElse ) {
			this.currentAnim = this.anims.bar;
		}
		
		this.parent();
	}
});

thx a lot dominic, awesome service!

So I also had this similar problem on Chrome that some images are "sometimes" not visible without any error or warning on the console.

After a lot of hair pulling, I moved the images to the 'preloader' from the init() and the problem solved.

But I still don't understand why the image becomes permanently invisible once it misses to load during execution?