Why my getBoundingClientRect() function doesn't take the right misure of my svg in the accordion?

Question

I made some charts with the d3.js library and to do that I've always used the function element.node().getBoundingClientRect() to take the width and the height from the svg that I've created on the HTML. Now i took some code from others to make an accordion and I need to create my chart in the div that disappear. The problem is that when I checked the function mentioned before I discoverd that it returns 0 for both width and height of the container.

This my HTML

<h2 class="accordion-header" id="headingFour">
  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-    target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
    <span>Content</span>
  </button>
</h2>
<div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour" data-bs-parent="#accordionExample">
  <div class="accordion-body middle-align linechart-container-accordion">
    <svg id="accordion-chart"></svg>
  </div>
</div>

and this is my JavaScript

function filledLineChart(ID)
{
    let svg = d3.select("#" + ID),

    let svgObject = svg.node().getBoundingClientRect(),
         width = svgObject.width,
         height = svgObject.height;

    console.log(width);
    console.log(height);
}