Animation of features in OpenLayers3

Question

I was curious about the possibilities of animating features in OpenLayers3.

I'm very aware of the examples presented here http://openlayers.org/en/v3.0.0/examples/animation.html and here https://gis.stackexchange.com/questions/26546/openlayers-animation-examples-and-algorithms

However, the official examples for OL3 don't quite fit my needs.

Let's assume that I have a layer (geojson for instance) that has a "time" column with lots and lots of time values.

I'd like to implement something like a slider that adds/removes features (or changes their style) depending on the user's actions.

The thing is that there are some APIs that might be able to do that, but they seem to be outdated (code examples were still working with ol2).

Do you have any suggestions on how to build a simple animation slider with OL3?

EDIT: It doesn't necessarily have to be proper animation. A possibility that came to my mind is changing the style of a layer whenever the slider is moved. Still no clue though on how to realise that.

This image illustrates what I have in mind:

EDIT: My current approach is to have a slider, that triggers code everytime it is moved. I somehow try do change the layer style dynamically, but I still haven't gotten a viable result.

Answer 1

Ok. I've come up with a solution myself. It's not really a full-fledged animation, but it works for me.

Basically what I do is that I load a wfs-layer to my map. Now, here is the trick: When I do that, I simply sort the time-values of the features one by one and add every feature with the time value of 1 to one layer, every feature with a time value of 2 to another and so and so forth. This basically does the trick. The rest is simple.

Next step is that I implement a slider that ranges from 1 (the lowest time value) to whatever the highest time value is. Everytime the slider is moved it triggers an event that finds out to which time value the slider is set to and then adds/removes the corresponding layers.

So, if the slider is set to 5. It will add every layer from 1 to 5 to the map and remove every other layer. Again, this is not really an animation, but it does work in my case.

If anyone comes up with another possible solution, please post it here. I'd appreciate it.

(Btw, this is what my solution looks like in action:)

EDIT: I can now also confirm that it is possible to build "proper" animations with this approach. I simply built a js-function that includes multiple "setTimeout"s to time when a layer is added and added a play button that triggers this function. This amounts to an animation that visualises the growth from t=1 to tmax.