Dagre is a JavaScript library that makes it easy to lay out directed graphs on the client-side. The dagre-d3 library acts as a front-end to dagre, providding actual rendering using D3
Questions tagged [dagre-d3]
88 questions
1
vote
0 answers
Custom node position in dagree-d3
I have a directed acylic graph done with dagre-d3. Is there any possibility to put a node in a different level and change the position of a node with some code? This library has some 'rank constraints' but it looks like in the latest version it's…

Bogdan Tushevskyi
- 712
- 2
- 12
- 25
1
vote
1 answer
How to create a decision tree / flow chart in D3/dagre-D3/javascript?
So I would like to create a question flowchart like below:
Not sure where the best place to start is... Is this a Directed Graph?
Some of those end up being really spaced out and not looking great for 'flows' like so:…

armyofda12mnkeys
- 3,214
- 2
- 32
- 39
1
vote
1 answer
Preserve d3 zoom state when changing out SVG contents?
I'm rendering something using d3, and using d3.zoom to zoom with the mouse. It works, but I also need to change the contents of the svg periodically (doing a full $('svg').html($('svg').html()) call, because my SVG contains HTML).
The problem is…

user31415629
- 925
- 6
- 25
1
vote
0 answers
Dagre.js draw edge from a child node to a parent node: Uncaught TypeError: Cannot set property ‘rank’ of undefined
I am currently using dagre.js for my visualisation project. This library is great.
I got to a point where I need to create nested graphs, so a node(s) can be contained within another node (parent), I am able to do that. But I am unable to draw an…

Michael Lin
- 13
- 5
1
vote
1 answer
set zoom after each redraw
I am using 'dagre d3' for displaying dependency graph. I also use slider(which I use to display step by step evolution of graph when user slides the slider) so each time Slider is moved, graph is redrawn. For the first time, 'zoom' feature will be…

Pradeepb
- 2,564
- 3
- 25
- 46
1
vote
1 answer
Dagre / D3 Rendering Nodes and Edges/Arrowheads at a larger size
I have this graph but it appears that the nodes and edges/arrowheads are rendering kind of small. The graph is being rendered using Dagre. I'm just wondering if there is a way to make the nodes and edges/arrowheads larger but keep them within the…

bschmitty
- 1,118
- 3
- 16
- 46
1
vote
2 answers
How to keep current zoom scale and translate level when re-rendering graph
I have a d3 graph that allows for pan and zoom behavior. It also has subGraph functionality that allows a user to expand and collapse the subGraph. When the user clicks on the icon to open and close the subGraph this code runs:
btn.on("click",…

bschmitty
- 1,118
- 3
- 16
- 46
1
vote
0 answers
dagre-d3 svg labels not rendering in Meteor
I'm somehow unable to apply the SVG label example here: http://cpettitt.github.io/project/dagre-d3/latest/demo/svg-labels.html into Meteor.
The svg_edge_label gets created, but somehow won't appear on the edge! Any idea what's unique about Meteor…

lyn
- 75
- 5
1
vote
1 answer
cytoscape.js dagre layout segment edges
see below cytoscape.js vs dagre-d3.js for same set of data.
cytoscape : https://jsfiddle.net/bababalcksheep/m40m5mmx/6/
dagre-d3: http://cpettitt.github.io/project/dagre-d3/latest/demo/tcp-state-diagram.html
How can I make cytoscape.js edges same…

django
- 2,809
- 5
- 47
- 80
1
vote
2 answers
Change default node shape in dagre-d3
I'm using dagre-d3 to display directed graphs in a Javascript application, and its default node shape is a rectangle. I'd prefer ellipses, but it's not at all obvious to me if there's a programmatic way of changing the default (I'd rather not hack…

user888379
- 1,343
- 12
- 30
1
vote
0 answers
d3.js svg path drawing not allowed
Hy i have this code: https://jsfiddle.net/fa765d2o/1/
(Sorry for the js part i had to paste in the dagre-d3 plugin, didnt knew any other way to make it work)
So i use d3.js and dagre-d3 to create an organizational chart, which works.
I'm working on…

Mr. Sam
- 790
- 2
- 9
- 31
1
vote
0 answers
Position of a custom shape using dagre
I'm trying to create a custom shape and set x and y axis on the svg, so far I got it done but for on top of my element I have a transform attribute that belongs to a group (g) that references the node, I tried to change the attribute setting a…

pedrommuller
- 15,741
- 10
- 76
- 126
1
vote
1 answer
Dynamic Graph Generation using dagre-d3.js
I want to generate a graph which takes input from json model. I am using dagre-d3.js. I am able to generate nodes and also able to connect nodes statically. The method graph.addEdge(null,"A","B") connects two nodes. But i want to create edges…

abhhab
- 253
- 2
- 6
- 22
0
votes
0 answers
Autolayout does not work correctly for groups of nodes. Where did I go wrong? Dargre-d3-es
I use the library dagre-d3-es
Autolayout does not work correctly for groups of nodes. I made an autolayout for nodes, but when I use groups, the position for this group is not set correctly.
I put all the nodes in the graph, and the nodes that…

Anton
- 1
0
votes
0 answers
getting error TypeError: labelSvg.node(...).getBBox is not a function in d3.js graph
I am dynamically rendering nodes and edges.
And it is working correctly. But in test cases getting error 'TypeError: labelSvg.node(...).getBBox is not a function'
I am using dagreD3 to render directional graph.
Note: Not using getBBox explicitly in…

Suraj Bande
- 89
- 2
- 9