Skip to content

Instantly share code, notes, and snippets.

@magjac
Last active August 29, 2017 05:14
Show Gist options
  • Save magjac/37c24c53b38a6efe2dba0f399b2635ba to your computer and use it in GitHub Desktop.
Save magjac/37c24c53b38a6efe2dba0f399b2635ba to your computer and use it in GitHub Desktop.
Basic d3-graphviz transition example
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="//d3js.org/d3.v4.min.js"></script>
<script src="http://viz-js.com/bower_components/viz.js/viz-lite.js"></script>
<script src="https://github.com/magjac/d3-graphviz/releases/download/v0.1.0/d3-graphviz.min.js"></script>
<div id="graph" style="text-align: center;"></div>
<script>
var graphviz = d3.select("#graph").graphviz()
.tweenShapes(false);
graphviz
.renderDot('digraph {a; b}');
graphviz
.transition(
d3.transition()
.delay(1000)
.duration(1000)
)
.renderDot('digraph {a -> b}');
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment