I am working with an SVG text element that looks like this:
<text data-model-id="k10673" x="584" y="266" fill-opacity="1" style="font: 12px Arial,Helvetica,sans-serif; " fill="#a5d16f">BU YIL SONU</text>
The text is positioned approximately in the middle of the screen. When I inspect it using Chrome debugger, I can see that its width is 83.941.
However, when trying to retrieve this width from my JavaScript page, all methods related to the width return either zero or undefined, even though Chrome debugger displays it correctly.
This is how I obtain the element:
var x = document.querySelector("#k11489 > g:nth-child(27) > text:nth-child(1)")
Subsequently, the following JavaScript functions provide no width value:
x.getComputedTextLength()
x.getBBox().width
x.style.width
Similarly, jQuery functions I tried also do not fetch the width:
x.width() //Returns the function
x.innerWidth() //Returns null
x.outerWidth() //Returns null
Please note: To ensure that 'x' points to the correct text element, I verify it through the console. Here are snapshots of the JavaScript and jQuery objects:
Is there a way to accurately retrieve the width of this object using JavaScript or jQuery?