Transitions de chaîne D3.js pour des animations composées pour différentes formes

Ce que je suis en train de faire...

Je suis jongle avec D3 pour faire un composé de l'animation. J'ai le texte suivant état final:

Transitions de chaîne D3.js pour des animations composées pour différentes formes

Essentiellement, je veux de l'animation relier les points - ajouter le premier cercle. Ensuite, dessinez le ligne pour le deuxième cercle. Une fois que la ligne est tracée, le second cercle est ajouté.

Pour ajouter de l'attrait visuel, j'ai effectuer d'autres transitions, telles que la modification de cercle rayon pour le premier et le deuxième cercle que la ligne est le tirage au sort.

Ce que j'ai essayé...

Je peux ajouter les cercles et tracer la ligne individuellement, y compris les animations. Cependant, je ne suis pas sûr de savoir comment procéder avec enchaînant les transitions ensemble pour former le composé de l'animation.

J'ai lisez à propos de transitions/animationsce qui suggère l'utilisation de each("end"). Alors que ce serait le travail de dessiner les objets initiales, la fin n'est pas le feu jusqu'à ce que après les autres transitions.

Questions

  • Est à l'aide de each("end", ...) la bonne approche pour le chaînage de transitions?
  • Comment puis-je commencer un autre animation (c'est à dire commencer à tracer la ligne) tout en permettant une transition pour terminer (c'est à dire le premier rayon du cercle en rafale).

source d'informationauteur Jason McCreary