svg 요소 안에 div를 추가하는 것이 가능합니다

그래프를 만들려고하는 svg 안에 html div를 추가하려고합니다. 아래 코드를 사용하여 추가하려고하지만 방화 광구를 사용하여 요소를 검사 할 때 div가 "rect"요소 코드 안에 표시되지만 그래프 UI에는 나타나지 않습니다. 그것은 노력하고있는 방법으로 뭔가 wrng인가 아니면 svg 내부에 div를 추가 할 수있는 부탁할만한가요?svg 요소 안에 div를 추가하는 것이 가능합니다

 marker.append("rect").attr("width", "50px").attr("height", "50px").append("div").attr("id", function (d) { 
      return "canvas_" + d.key.split(" ").join("_"); 
     }).style("width", "50px").style("height", "50px");

출처

2013-07-11 sam

당신은 SVG (기술적으로는 foreignObject 때와 수에 HTML을 추가 할 수 없습니다, 그러나 토끼 구멍의). 또한 SVG의 보이는 요소는 중첩 될 수 없기 때문에 circle, rect, path 등과 같은 요소는 하위 요소를 가질 수 없습니다.

출처

2013-07-11 14:27:59 Duopixel

foreignObject를 참조 해 주셔서 감사합니다 !! 작동했습니다 – sam

크로스 브라우저 호환성이 필요한 경우를 대비하여 'foreignObject'가 IE에서 작동하지 않습니다. – Duopixel

@sam 문제가 해결되면이 대답을 수락하는 것을 고려하십시오. 나는 사양을 알고 그것이 맞는지 확인할 수 있습니다. –

같은 줄에 "rect"와 "div"를 추가하려고합니다. 당신이 ... 그 놀라운 라이브러리가 SVG에 따라 D3에 대한 이러한 tutotials을 체크 아웃 실패 곳 Porbably 즉 http://alignedleft.com/tutorials/d3/drawing-svgs/

출처

2013-07-11 14:24:16 AnaMaria

그것은 rect 중 하나를 사용하지 못했습니다 .. 나는 방금 추가했습니다. 추가가 깨지려고하는지 궁금합니다. – sam

자습서를 확인하십시오. 나는 SVG 이상의 것을 배울 것이라고 약속 할 수 있습니다. – AnaMaria

물론 ... 감사합니다 !!! – sam

개체를 그룹화하여 <div>과 비슷한 용도로 사용하기 때문에 <g> 요소를 사용하는 것도 고려해 볼 수 있습니다. More about it here.

출처

2015-10-21 11:06:16

맞습니다. g 태그가 더 좋습니다. 정보 주셔서 감사합니다. – swapyonubuntu

svg 요소 안에 div를 추가하는 것이 가능합니다

답변

관련 문제