Closed IndraPriyaDarshini closed 4 years ago
Looks like the demos rely on CSS to make this stuff visible. See e.g.
Hi Gordonwoodhull,
I tried your suggestion but problem still exists.
https://codesandbox.io/s/angular-graph-kq2nb
In the above link open the app folder under src folder where we can find the actual code.
app.component.css for CSS and app.component.ts for TS
Huh? Your link shows a graph with links and node labels visible.
Hmm. May I know in which browser you are viewing it.
I'm not able to see the above graph in Chrome.
Must be some caching issue.
Anyway, that is definitely how to get the nodes and links to show in dagre-d3. Figuring out how to get CSS to correctly apply inside of Angular and codesandbox.io is out of scope for this repo.
In Chrome, Firefox, and Safari, pasting the following CSS into styles.css, and then pressing enter, will work:
.node rect {
stroke: #333;
fill: #fff;
}
.edgePath path {
stroke: #333;
fill: #333;
stroke-width: 1.5px;
}
Probably Angular transforms the CSS in app.component.css in some way that makes it not work.
Ok. Figured it out. Need to put encapsulation: ViewEncapsulation.None
https://codesandbox.io/s/angular-graph-kq2nb
Thank you for the quick help.
Hi, I'm using dagre-d3 with angular 8 and following are the issues I'm facing
Problems: Links are not appearing between the nodes. Labels on the nodes are not visible.
https://codesandbox.io/s/angular-graph-kq2nb