In some cases I need to reload the graph and redraw a graph and set it into initial position and scale without refresh the page(using jquery and ajax). What I used is the example code on https://github.com/cpettitt/dagre-d3 (not the interactive one, the one written in guide), and load the edges and nodes with dynamic queries.
However, when I reload the nodes and edges and do the rendering again, the $("g.zoom) position and scale remained where it was. I tried to edit attribute "transform" and "scale" attributes of $("g.zoom") with jQuery, but when users drag or zoom the graph, it the scale and position change back.
I tried the solution on https://github.com/cpettitt/dagre-d3/issues/17 to reset the svg,
var svg = d3.select("svg > g");
svg.selectAll("*").remove();
but after that zoom is not available.
Besides, I'd like to know if there are any ways to:
- calculate a proper scale to display the whole graph (sometimes I need to draw a very large graph)
- double click on the image, it will be zoomed into a fixed size, instead of becoming larger and larger, and for double click again, it will be back to the scale that can view whole graph
I hope I have made myself understood. :)