dagre d3 zoom

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.16/d3.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dagre-d3/0.4.17/dagre-d3.min.js"></script>
<svg width=800 height=800>
  <g/>
</svg>

CSS

.panel {
    margin: 0;
    cursor: pointer;
  }
  
  .node rect {
    fill: #fff;
  }
  
  .edgePath path {
    stroke: #333;
    fill: #333;
    stroke-width: 1.5px;
  }

JavaScript

var g = new dagreD3.graphlib.Graph().setGraph({});
for (var i = 0; i < 7; i++) {
  var html = '<div class="panel panel-primary">'
  html += '<div class="panel-heading">' + i + ' Panel</div>'
  html += '<div class="panel-body"><p style= "color: black;">Test<p></div>'
  html += '</div>'
  g.setNode(i, {
    labelType: "html",
    label: html,
    padding: 0
  })
}
g.setEdge(0, 1, {
  label: "",
  lineInterpolate: 'basis',
})
g.setEdge(1, 2, {
  label: "",
  lineInterpolate: 'basis',
})
g.setEdge(0, 2, {
  label: "",
  lineInterpolate: 'basis',
})
g.setEdge(2, 3, {
  label: "",
  lineInterpolate: 'basis',
})
g.setEdge(3, 1, {
  label: "",
  lineInterpolate: 'basis',
})
g.setEdge(4, 1, {
  label: "",
  lineInterpolate: 'basis',
})
g.setEdge(5, 2, {
  label: "",
  lineInterpolate: 'basis',
})
g.setEdge(6, 1, {
  label: "",
  lineInterpolate: 'basis',
})

var svg = d3.select("svg"),
  inner = svg.select("g");

// Set up zoom support
var zoom = d3.behavior.zoom().on("zoom", function() {
  inner.attr("transform", "translate(" + d3.event.translate + ")" +
    "scale(" + d3.event.scale + ")");
});
svg.call(zoom);
var render = new dagreD3.render();
render(inner, g);
var initialScale = 0.75;
zoom
  .translate([(svg.attr("width") - g.graph().width * initialScale) / 2, 20])
  .scale(initialScale)
  .event(svg);

//svg.transition().duration(750).call(zoom.translate([0, 0]).scale(1).event);
//svg.transition().duration(500).attr('transform', 'scale(0.75) translate(0,0)');