2014-03-28 2 views
0

D3 렌더링을 사용하여 간단한 네트워크 다이어그램을 사용하고 있습니다. 그리고 각 노드에서 해당 외부 객체에 대한 html 내용을 표시하려고합니다. 외부 개체에 html이 있습니다. 네트워크가 렌더링되고 있습니다. 그러나 html을 렌더링하지 않는 이유를 아는 html 콘텐츠를 볼 수 없습니까?SVG 외부 객체가 D3을 사용하여 표시되지 않습니다.

아래 코드를 사용하고 있습니다. 여기

dom.svg.selectAll('.node').append("foreignObject") 
    .attr("width", 100) 
    .attr("height", 100) 
    .append("xhtml:body").append("xhtml:p") 
    .style("color", "red") 
.text("Object in SVG"); 

당신은 circle 요소에 foreignObjects (또는 실제로 무엇을) 추가 할 수 없습니다 fiddle

답변

3

입니다. 대신, 예를 들어 g과 같은 컨테이너 요소에 추가하십시오. 고정 here.

+0

빠른 응답을 보내 주셔서 감사합니다. 원이 보이지 않도록 원숭이가 원 위에 놓이는 방법이 있습니까? –

+0

원을 추가하고 가운데에 더 많이 표시되도록 텍스트를 이동할 수 없습니다. http://jsfiddle.net/DVw3P/2/ –

+0

감사합니다. 나는 HTML div로 만들었습니다. http://jsfiddle.net/mailtoshebin/9faWA/ 두 SVG 라인의 교차점에 div의 가장자리를 놓을 수있는 방법이 있습니까? –

관련 문제