2014-10-14 3 views
1

d3.js의 트리 레이아웃에 대한 계층 구조를 만들려고하고 있는데 행 데이터는 링크 만 있고 링크 중 일부는 링크에서 몇 번 같이 서로 재귀하고 있음을 나타냅니다. 기본 d3.js 트리 함수로 대상을 지정하면 해당 상황에서 문제가 발생합니다.행 데이터에서 계층 구조 만들기

다른 옵션이 있습니까?

예 : 그래서이이 시나리오도

0  0 
\ /
    0 
    | 
    0 

이들은 하나의 루트 부모 아래 있지 또한 트리에 두 개의 서로 다른 부모를 의미 같은 것이

{ source: "main1", target: "level 3"} 
{ source: "main2", target: "level 3"} 
{ source: "level 3", target: "level 4"}  

같은 데이터가!

어떤 유용한 링크 당신은 당신이 임의의 방향 그래프 (아마도 비순환?)를 나타내는 데이터를 가지고, 당신은 그것에서 계층 구조를 만들 것을 말하는 사전

답변

0

에서

덕분에 감사 할 것이다. 당신이 지적한대로 그것은 계층 구조를 나타내지 않습니다. 그래서 당신은 무엇을 기대합니까? 귀하의 '질문'에 대한 대답은 다음과 같습니다.

"그렇게 할 수 없으므로 계층 구조가 필요없는 다른 시각화를 사용해야합니다." 당신이 계층 구조를 따라 당신이 기대했던 결과는 무엇을 함께 예를 들어, 데이터의 전체 세트를 제공하시기 바랍니다 원하는 확신 경우

은 아마 당신은
https://github.com/nickholub/d3-dag-visualization

같은 DAG 시각화를 원한다. 우리는 당신이 제공 한 것에서 당신이 원하는 것을 추측 할 수 없습니다.

0

예이 직접 d3.js으로 불가능하지만 다른 방법이 오히려 우리가 할 수있는 각 노드에 연결하는 get 링크의

tree.links(nodes); 

를 사용하는 것보다)

1 D3.js

으로이 할

d3.layout.hierarchy() 

를 사용하고 무시

.links(nodes) 

방법을 사용하고 링크 연결을 관리하는 것은 원래의 자식이 여러 부모 노드에 배치하려는 위치에 있고 고유 한 ID를 부여하여 노드를 식별하고 연결함으로써 연결 연결을 관리한다는 의미입니다. 참고 :이 예에서 일부 복사본 과거의 코드를 사용하는 경우 여기에 당신이

var link = svgGroup.selectAll("path.link") 
     .data(links, function(d) { 
      return d.target.id; 
     }); 

것은 지금은 아동과 부모에 의존하지 있기 때문에이 코드를 변경하는 데 필요한 모든 링크는 그렇게 자신의 그들에게 ID를 부여하고 ID를 사용하는 필터 대신 대상 ID를 사용하는 것

2) 또는 자기 자신에 의해 고유 한 기능을 생성하고 링크와 마찬가지로 객체를 보유하는 하나의 객체 또는 객체를 만들 수 있습니다. 사용자가 원하는대로 소스, 타겟 및 링크 ID를 지정해야합니다. 연결 논리.여분의 attr 등을 추가 할 수 있기 때문에 원하는대로 연주 할 수 있습니다.

관련 문제