Stack Overflow
Stack Overflow

Questions tagged [dagre]

Dagre is a JavaScript library that makes it easy to lay out directed graphs on the client-side.

75 questions
2
votes
0 answers

JointJS, defining ports for custom shapes but they do not show up on graph

Having a few problems implementing an interactive flowchart in JointJS (and the Dagre layout library). My first problem: when creating custom JointJS elements with ports using the following code, unless I comment out the "type:" definition the ports…
Mark Dyson
  • 305
  • 1
  • 12
2
votes
1 answer

How to deal with multiple trees situation when using dagre layout in Cytoscape.js

I'm new to Cytoscape.js and trying to draw a graph with the help of Dagre layout depending on users' search input. Number of nodes is typically 50-100. Although Dagre works well for a single tree, when the graph contains several trees (and sometimes…
yetisun
  • 121
  • 2
  • 5
2
votes
3 answers

Dagre layout for simple tree in cytoscape.js

How to use dagre layout in cytoscape.js to draw a simple tree. I am putting layout{ name: 'dagre'} and added dagre.js file from https://github.com/cpettitt/dagre/blob/master/dist/dagre.js. It is not working.
smita chougale
  • 235
  • 5
  • 19
1
vote
2 answers

why the following simple cytoscape-dagre html is not working

I would like to tryout cytoscape-dagre by creating a simple html. Here is my html code: …
David M
  • 433
  • 1
  • 4
  • 10
1
vote
2 answers

Getting unexpected black background after applying style:"stroke: blue; stroke-width: 2px;"

I'm new to reactJS and I have been trying to create a graph in react using DagreGraph. I learnt minimum react required to understand how to create a graph. This is my code that is giving errors with the edge that is created between two nodes. import…
srisatyavennela 007
  • 11
  • 1
1
vote
0 answers

How to configure Cytoscape headless layout?

I want to draw a graph from a bunch of nodes. Dagre (https://github.com/dagrejs/dagre) was fine so far, as long as I didn't have to draw the inputs/outputs. I'd like to render something like this: So I'd like to use cytoscape…
Christophe Thomas
  • 65
  • 8
1
vote
1 answer

cytoscape.js and dagre result in one node positioned awkwardly

Given the cytoscape.js snippet below, using the dagre layout, can anyone explain why node number 2 positions itself to the bottom right instead of in order like the rest of them? var cy = cytoscape({ container: document.getElementById('cy'), …
43Tesseracts
  • 4,617
  • 8
  • 48
  • 94
1
vote
1 answer

The "dagre" utility is a mandatory dependency

I am using jointjs and to auto layout the nodes I am using dagre library. my code break at this line joint.layout.DirectedGraph.layout(self.graph, { setLinkVertices: false, rankDir: "LR", rankSep: 150, marginX: 100, …
Mojo
  • 498
  • 1
  • 8
  • 16
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
1 answer

how to pass additional properties through Dagre?

I'm using Dagre to layout my graph and need to send additional properties through to set class/style later in cytoscape. var graph = new dagre.graphlib.Graph({...}); graph.setEdge(source, target, { val1: 'foo' }, e.value); How to access the…
mut1na
  • 795
  • 6
  • 21
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

Cytoscape.js: Recalculate graph layout after mouse tab

similar to this prototype http://jsfiddle.net/g5f16erz/ I use Cytoscape.js to create an interactive directed acyclic graph using the dagre layout. In particular the following code is used to collapse and expand nodes: cy.nodes().on('click',…
Andy
  • 9,483
  • 12
  • 38
  • 39
1
vote
1 answer

change label data of node without rendering graph in D3.js

I want to change the label of the nodes of svg graph using d3.js without rendering it again. I do not want to generate graph again and again but only change the data in node labels. It seems if I change the label value I need to call "renderer"…
David
  • 63
  • 1
  • 10
1 2
3
4 5