Merge pull request #192 from MasseGuillaume/optimize-width-browser

Optimize the screen space for dependencyBrowseGraph
This commit is contained in:
Jacob Wang 2020-07-14 11:40:54 +12:00 committed by GitHub
commit af7acdf3de
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 6 additions and 17 deletions

View File

@ -37,11 +37,10 @@ THE SOFTWARE.
<script src="dependencies.dot.js"></script> <script src="dependencies.dot.js"></script>
<style> <style>
svg { body {
border: 1px solid #999; margin: 0;
overflow: hidden; overflow: hidden;
} }
.node { .node {
white-space: nowrap; white-space: nowrap;
} }
@ -76,8 +75,6 @@ THE SOFTWARE.
<body onLoad="initialize()"> <body onLoad="initialize()">
<h1>Dependencies</h1>
<svg width=1280 height=1024> <svg width=1280 height=1024>
<g/> <g/>
</svg> </svg>
@ -91,6 +88,8 @@ function initialize() {
inner.attr("transform", "translate(" + d3.event.translate + ")" + inner.attr("transform", "translate(" + d3.event.translate + ")" +
"scale(" + d3.event.scale + ")"); "scale(" + d3.event.scale + ")");
}); });
svg.attr("width", window.innerWidth);
svg.call(zoom); svg.call(zoom);
// Create and configure the renderer // Create and configure the renderer
var render = dagreD3.render(); var render = dagreD3.render();
@ -98,21 +97,11 @@ function initialize() {
var g; var g;
{ {
g = graphlibDot.read(inputGraph); g = graphlibDot.read(inputGraph);
// Set margins, if not present g.graph().rankdir = "LR";
if (!g.graph().hasOwnProperty("marginx") &&
!g.graph().hasOwnProperty("marginy")) {
g.graph().marginx = 20;
g.graph().marginy = 20;
g.graph().rankdir = "LR";
}
g.graph().transition = function(selection) {
return selection.transition().duration(500);
};
// Render the graph into svg g
d3.select("svg g").call(render, g); d3.select("svg g").call(render, g);
// Center the graph // Center the graph
var initialScale = 0.75; var initialScale = 0.10;
zoom zoom
.translate([(svg.attr("width") - g.graph().width * initialScale) / 2, 20]) .translate([(svg.attr("width") - g.graph().width * initialScale) / 2, 20])
.scale(initialScale) .scale(initialScale)