Animate the links and/or nodes

[NikTJ777]

I would like to animate the display of the links, to indicate traffic speed / throughput, etc.

What I would like is something simple like a stripe of colour moving "along" the link - similar to one of those "spinners" one sees on a webpage while waiting for a page reload.

And for the nodes, perhaps a simple grow-and-shrink pulsation for "active" nodes.

I am hoping I can do this with simple CSS definitions for the link or node display.

Can anyone help with a suggestion on how to accomplish this?

I presume there will need to be some minor changes to the code to associate the animation and its speed with some attribute of the node or link, and possibly adding one or more attributes to the node or link objects.

I am happy to refine the code and contribute back.

Cheers! Nik

[nemesifier]

mm I have no useful suggestions for this feature right now. It could be done in many ways, it really depends on your use case.

[NikTJ777]

Understood,

I was hoping that someone with more experience than me on animating lines and dots (the links and nodes) in JS could suggest a good approach that will work, saving me the wasted time of finding a viable approach through trial and error.

I think I can animate the display of a line or a dot through CSS, but perhaps that is not the most sensible approach, and I should rely on the features of the JS graphing library you are using.

It would really help me if someone could make a suggestion...

My use-cases are simple:

• indicate traffic volume: In addition to (or instead of) displaying traffic volume using the thickness of the line representing the link, the line could have a "spinner" animation suggesting movement of bytes along the line;

• indicate link activity: Indicate that a link is currently active (or available, etc), by animating its display as above;

• indicate node traffic volume; in addition to (or instead of) displaying the amount of traffic going through a node by changing the size of the dot used to represent the node, the node display is animated to make it pulse, with the rate of the pulse indicating business.

Thanks for any and all suggestions.

Cheers! Nik

[xraided]

Hi, @NikTJ777 did you managed to achieve this?