PDA

View Full Version : Customized D3 tree node Links needs to be started from edge



sankar22222
30 Mar 2017, 10:46 AM
I am using D3 Horizontal tree premium control with sencha architect 4.2.1 already i have overridden the component as following ( verify attached image) . I have few queries and need help on those.
1) Node links needs to be started as i depicted on the Diagram . I am unable to achieve that.
2) Always tree needs to stay in width and height similar to collapsible tree http://bl.ocks.org/serra/5012770. In my case its growing more than specified width and height. If i achieved that i don't need to drag the screen unnecessarily.

56104

har0ngas
16 Aug 2017, 4:50 PM
Hi,

I got the same issue as yours here, I found a thread in stackoverflow for your solution, I would like to ask on what event you had put it in?

here's a fiddle of my work https://fiddle.sencha.com/#fiddle/252t&view/editor

i've put it on 'initialize' event but didn't work



//How to make the links start from the edge of the rectangle.
node.addNodeListener('initialize', function(e, t){
var rectSize = 246;
this.setDiagonal(
d3.svg.diagonal()
.source(function(node){ return {'x': node.source.x,'y': node.source.y + rectSize,};})
.target(function(node){ return {'x': (node.target.x),'y': node.target.y,};})
.projection(function(node){ return [node.y , node.x];}));
});


cheers,