d3.js -할 수 있는 방법을 확장력 방향 그래프의 수평?

Question

내 노드의 그래프에서 d3(보기: http://jsfiddle.net/u56Tr/1 는)그래프 자체는 매우 원(링크 노드를 확산 상대적으로 동등에서 모든 방향)-어떻게 만들이에 더 잘 맞 16:9 니까?나는 가정 나를 확장해야 x,y 위치는 요소의 수는 없지만 꽤 바로 그것을 얻을 수 있습니다.

관련 D3 코드:

force.on("tick", function() {
link.attr("x1", function(d) {
    return d.source.x;
})
    .attr("y1", function(d) {
        return d.source.y;
    })
    .attr("x2", function(d) {
        return d.target.x;
    })
    .attr("y2", function(d) {
        return d.target.y;
    });
node_bg.attr("cx", function(d) {
    return d.x;
})
    .attr("cy", function(d) {
        return d.y;
    });
node.attr("x", function(d) {
    return d.x - (d.group > 0 ? 24 : 32);
})
    .attr("y", function(d) {
        return d.y - (d.group > 0 ? 24 : 32);
    });

});

Answer 1

포인트의 레이아웃을 자동으로 눕는 그래프 이와 같은 그래서 당신이 지정하지 않아도 위치 노드의 자신입니다.어떻게 그것이 그가 크게 의해 영향을 받은 연결이 사이의 노드입니다.그래프를 빌려하지 않다 매우 잘 배치되는 다양한 화면 형식이 높기 때문에 연결는 많은 노드에 연결하는 많은 다른 노드입니다.었다면 스트레칭하는 그래프,일부 링크가 될 것 보다 훨씬 더 이상 다른 사람과 어떤 노드는 것이 훨씬 더 가까이 함께는 다른 사람보다-이것은 무엇인지 정확히 힘 레이아웃을지 않도록 합니다.

할 수 있습니다 물론 수동으로"해킹"레이아웃을 달성하기 위해 무엇을 원할 수 있습니다,예를 들어,다른 지정 링크리/장점에 대한 각 링크에 그래서 당신이 원하는 사람을 크게가 약해지고있다.마찬가지로,지정할 수 있습니다 충전하는 기능을 할당 약한 반발 충전 노드 당신이 원하는 것을 가까이 함께.

그러나,위의 모든 이해야 합니는 아주 좋은 생각이 무엇을 원하는 그래프를 보면 완성된다.그것은 아마도 쉽게 도랑력 레이아웃 모두고 간단하게 지정한 위치 노드의 자신입니다.

Answer 2

다이어그램을 쉽게 짜낼 수 있습니다.

9/16은 .5625입니다.이 "Nofollow"> 바이올린 .5625가 포함 된 라인을 찾으십시오. 다이어그램을 짜내는 데 필요한 모든 것이 필요합니다.

및이 다른 바이올린 다이어그램을 완전히 박살냅니다.:).

다이어그램이 약간 혼란스러운 표정이 있기 때문에, 당신의 사건에 대한 좋은 일정한 일정은 0.4 일 것입니다.그런 식으로 16 : 9 더 확실하게 적합합니다.