dagrejs / dagre-d3

A D3-based renderer for Dagre
MIT License
2.83k stars 588 forks source link

Multigraph has something wrong when change style #354

Closed MeiRuiSu closed 5 years ago

MeiRuiSu commented 5 years ago

When use multigraph, I got something strange, seems render has something wrong.

screen shot 2019-01-14 at 2 36 53 pm

If only one edge between node "Kevin Spacey" and "Saul Williams", everything is fine. If no style in the setEdge and it's fine also. Can you help me on how to remove the black triangle background? Code is here: let g = new dagreD3.graphlib.Graph({ multigraph: true }); g.setGraph({}); g.setDefaultEdgeLabel(function() { return {}; }); g.setNode('kspacey', { label: 'Kevin Spacey' }); g.setNode('swilliams', { label: 'Saul Williams' }); g.setNode('bpitt', { label: 'Brad Pitt' }); g.setNode('hford', { label: 'Harrison Ford' }); g.setNode('lwilson', { label: 'Luke Wilson' }); g.setNode('kbacon', { label: 'Kevin Bacon' });

// Add edges to the graph. g.setEdge('kspacey', 'swilliams', {style: 'stroke: #FF4A4E', label: 'kspacey-swilliams'}, 'kspacey-swilliams'); g.setEdge('kspacey', 'swilliams', {label: 'kspacey-swilliams-2'}, 'kspacey-swilliams-2'); g.setEdge('swilliams', 'kbacon'); g.setEdge('bpitt', 'kbacon'); g.setEdge('hford', 'lwilson'); g.setEdge('lwilson', 'kbacon'); render(inner, g);

MeiRuiSu commented 5 years ago

Resolved by change .edgePath path { stroke: #333; fill: #fff; stroke-width: 1.5px; }

gkrishnan724 commented 4 years ago

Hi, I am having the same problem.

The solution you suggested also keeps the arrow-heads as white, which I don't want.

Is there any workaround this?

mcdemarco commented 3 years ago

I am having the same problem.

The solution you suggested also keeps the arrow-heads as white, which I don't want.

Is there any workaround this?

.edgePath path.path {
    stroke: #333;
    fill: #fff;
    stroke-width: 1.5px;
}