4

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:

  1. calculate a proper scale to display the whole graph (sometimes I need to draw a very large graph)
  2. 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. :)

gaitat
  • 12,449
  • 4
  • 52
  • 76
user3458198
  • 311
  • 1
  • 8

0 Answers0