4

I use the following code in my javascript (coffeescript) file:

myVar = document.querySelector('SVG > a:nth-child(2) > text').offsetWidth

In google chrome this returns the width of a the text element which is nested inside an a (anchor) element which is nested inside an svg element, as is expected. In Firefox this returns a NULL. I thought that perhaps my selector syntax wasn't up to Mozilla's standards so I played around with that as well, but even if I could select the DOM element correctly (as outputted by the console) I was unable to retrieve any property offsetWidth; it would always come back as undefined.

Now, in case it matters, my SVG object in injected into my page dynamically by some Javascript. It's placed directly into the body of a div and enclosed in <svg> and </svg> tags.

What gives? How can I ascertain the width of these elements?

Thanks!

torvum
  • 71
  • 6
  • Good, offsetWidth is only valid for html elements so Firefox is behaving perfectly correctly per http://www.w3.org/TR/cssom-view/#extensions-to-the-htmlelement-interface – Robert Longson Aug 03 '15 at 19:58

1 Answers1

3

NickFitz's answer at is what you need.

He offers to use SVG's standart function getBBox().

myVar = document.querySelector (...).getBBox ().width

Community
  • 1
  • 1
Ruslan Tushov
  • 1,153
  • 1
  • 10
  • 11