animation - Best way to animate radar data in openlayers

I have a project using OpenLayers which displays radar data on a map. The radar data itself is just a bunch of polygons each of which is filled with one of 6 possible colors. The goal is to animate the radar on the map. Each file contains radar data for a given time and the files are separated by about 5 minutes so my current approach is to loop through all the files and load them one by one into new separate layers. Once each layer is created it has its visibility set to false and it's added to the map. I then animate the layers using a timer which turns on the visibility of one layer and turns off the visibility of the preceding layer. Currently the layers are all vector layers and the data is loaded from KML files although the data files can be pretty much any format that will work best for this project.

The problem with this approach is that once I hit a fairly large time span (around 3 hours or so) of data (equating to approximately 36 layers) the memory consumption gets pretty high (around 250mb). The final product is supposed to be able to handle up to 18 hours of data in one loop which based on the above number would require over 1GB of memory just for the animation and would likely crash the browser or at least make it very sluggish.

I attempted the same thing using WMS layers for each layer but the redrawing was too slow (the animation changes layers every 100ms) and the memory consumption wasn't much better than the vector version.

I have scoured the net trying to find some example of how to do this but so far am coming up empty handed. Does anyone out there have any suggestions on how to do this? I'll take any ideas you have at this point as I've been stuck on this for weeks now with no answer in sight.

Answer

Try a sliding window of sorts. You can buffer 10 layers at a time. Start destroying layers and removing them from the DOM and memory once you reach 10 layers. So once you hit layer 10, layer 0-9 are destroyed and layers 20-30 are loaded with visibility to false. This will give you a buffer of about 10 layers but you can modify your tolerance as you see fit for performance. If you feel 20 layers works better, go with 20.

          {Destroy Layers} |10|11...19|20| {Start Loading Layers}

|---------------------------------------------------------------------------|
                           ↑
        Timespan           Current Possition