svg:g 요소의 너비를 구하는 방법

svg:g 요소의 너비를 구하는 방법

저는 현재 일을 하고 있습니다.svg자바스크립트의 요소입니다.그리고 저는 이것에 처음입니다.

제 질문은 제가 한가지를svg내가 여러개를 가지고 있는 요소.svg:g요소들.그리고 내 안에svg:g저는 여러가지 다른 svg 요소를 가지고 있습니다.

    <svg>
     <g class="my-class">
      <g class "c1">
         <text style="font-size: 9" x="0" y="-4"> john </text>
         <text style="font-size: 9" x="70" y="-4"> 13 </text>
      </g> 
      <g class="c2">
         <text style="font-size: 9" x="0" y="-4"> john </text>
         <text style="font-size: 9" x="70" y="-4"> 13 </text>
      </g> 
      <g class="c3">
         <text style="font-size: 9" x="0" y="-4"> john </text>
         <text style="font-size: 9" x="70" y="-4"> 13 </text>
      </g> 
    </g>
   </svg>

g역동적으로 내 안에 나타나고 있습니다.

g "my_class"

이제 나는 내 것을 설정하고 싶습니다.svg폭이 다음의 폭과 같습니다.g.my_class폭이 넓은

var svgWidth  =   $('.my-class').width()
alert(svgWidth);

하지만 그건 나에게 0을 줍니다.그러나 브라우저에서 노란색 도구 팁 상자에서 볼 수 있습니다.

제가 이 선을 선택할 수 있습니다.

누가 나를 친절하게 안내해 줄 수 있습니까?제가 이 일을 제대로 하고 있는 것일까요, 아니면 어떻게 하면 이 일을 해낼 수 있을까요?감사해요.

해라.getBoundingClientRect

$('.my-class')[0].getBoundingClientRect().width;

데모 http://jsfiddle.net/5DA45/

추천합니다.getBBox(SVG 1.1의 일부인) 이상getBoundingClientRect(그렇지 않음):

$('.my-class')[0].getBBox().width;

데모 http://jsfiddle.net/TAck4/

언급URL : https://stackoverflow.com/questions/11702952/how-to-get-the-width-of-an-svgg-element