如何在垂直标签内容框的div内显示d3js图表？

Question

我目前正在尝试在垂直选项卡菜单的内容框中显示我使用d3.js 创建的折线图。图表本身的 d3 代码将在“普通”页面上运行，当我将代码放在选项卡内容框内时，甚至 d3 代码中的日志也可以工作，但图表不会显示。内容框中的其他项目（例如图像或标题）也可以正常工作。

这是我的代码的html部分

  <h1 id="testheading"> Test </h1>
  <div class="tab">
    <button class="tablinks" onclick="openArg(event,'Overview')"> Übersicht </button>
    <button class="tablinks" onclick="openArg(event,'JungAlt')"> Jung und Alt </button>
  </div>

  <div id="Overview" class="tabcontent">
    <div class="container">
        <div class="row">
            <div class="col">
                <div id="chart-area"></div>
            </div>
        </div>
    </div>
  </div>

  <div id="JungAlt" class="tabcontent">
    <h3>Jung und Alt</h3>
    <p>Kaufkraft ist sehr hoch</p>
  </div>

正如预期的那样，用于图表的csv 文件的内容将被正确记录。只是图表不会显示在内容框内

Answer 1

问题解决了。 d3.js 脚本和 JavaScript 代码在错误的位置初始化。