Skip to content

Instantly share code, notes, and snippets.

@ghernandez345
Created August 16, 2013 23:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ghernandez345/6254427 to your computer and use it in GitHub Desktop.
Save ghernandez345/6254427 to your computer and use it in GitHub Desktop.
d3 animated path rendering
// This will animate all the path rendering to draw from the begining of the path to the end of the path
var paths = d3.selectAll('path.link');
paths.each(function () {
var path = d3.select(this);
var totalLength = path.node().getTotalLength();
path.attr("stroke-dasharray", totalLength + " " + totalLength)
.attr("stroke-dashoffset", totalLength)
.transition()
.ease('linear')
.duration(300)
.ease("linear")
.attr("stroke-dashoffset", 0);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment