CODEWITHSUNDEEP
animationhtml5-canvasgifeaseljscreatejs
Kal37
Kal37

Reputation: 33

Animating with create.js without updating the whole canvas

I hope someone can help me. I am using ZigFu and Kinect with html5 and all is working fine but then I wanted to place gif images on the canvas and found out they don't work. So to get around this I have created a sprite sheet of my gif and placed it on the canvas.

My problem is that when updating the bmp animation using easeljs it updates the whole canvas and clears the original backgrounds I wanted to keep.

Can anyone offer an alternative way of making this happen? Can I animate the images without having to update the whole screen?

Many thanks for your answers, I have been at this a while and tried a lot of different things but just can't wrap my head around it.

Upvotes: 1

Views: 331

Answers (2)

Lanny
Lanny

Reputation: 11294

You could also use multiple canvases/stages, with BG elements behind, and updating items in the front.

Upvotes: 1

starscape
starscape

Reputation: 2973

You basically have to draw everything each time. So every animation loop you will have to draw the background as well. This may not be ideal, I know, but it really doesn't hurt performance. For instance:

function eachLoop(){
    //draw background
    //animate images
}

Apologies if I have misunderstood the way createJS works(I've never actually used it, but I am quite familiar with the canvas) Hope this helps and best of luck!

Upvotes: 1

Related Questions