CODEWITHSUNDEEP
javascriptanimationsvgd3.jstransition
Spearfisher
Spearfisher

Reputation: 8773

D3JS - animate a circle along an svg path at a constant speed

I'd like to move a circle along a path using d3.js. I used the code from Mike Bostocks' website here:

http://bl.ocks.org/KoGor/8162640

I'd like to move my circle at a constant speed along the path and have it moving immediately after it has been added to my svg. I cannot see how to twist the code here to make it work.

Does anybody have an idea how to do this?

Best

Upvotes: 1

Views: 2046

Answers (1)

VividD
VividD

Reputation: 10536

You should just add a line

.ease("linear")

after .duration(7500), and you should be all set.

This is documentation on ease(), but you should read all that is related to transitions, while you ate at it...

Here is also a test example for various possibilities related to ease():

enter image description here

Upvotes: 3

Related Questions