Skip to content
Animate a svg generated with graphviz
Branch: master
Clone or download


jQuery Graphviz plugin

With this plugin you can move (click and drag and drop) and remove (double click on a node or on a edge) the nodes and the edges of a graph created with graphviz


  • jquery.ui.core.js
  • jquery.ui.widget.js
  • jquery.ui.mouse.js
  • jquery.ui.draggable.js


  • Add CSS
<link rel="stylesheet" href="jquery.graphviz.0.0.1.css" />
  • Add JS
<script type="text/javascript" src="jquery.graphviz.0.0.1.js"></script>
  • Initialize
<script type="text/javascript">
        $(document).ready(function () {


This jquery plugin has been tested on the browsers: Latest versions of Firefox, Safari and Google Chrome, and even IE9. You can see in jsfiddle


0.0.1 (2012-07-25)

  • Move node and edges (drag and drop)
  • Remove node and edges (dobleclick)
  • Works, at least, Firefox, Safari, Google Chrome and IE9
You can’t perform that action at this time.