Question

我在这里有标签内容

<div id="views" class="tab">
  <button class="tablinks" onclick="openTab(event, 'energy')" id="defaultOpen">Energía</button>
  <button class="tablinks" onclick="openTab(event, 'electricity')">Electricidad</button>
</div>

<div id="results">
  <div id="ajax_loader"></div>
  <div id="energy" class="tabcontent">
    <table align="center">
      <tr>
        <td>
          <div id="chart_div1" style="width: 600px; height: 400px;" class="chart"></div>
        </td>
        <td>
          <div id="chart_div2" style="width: 600px; height: 400px;" class="chart"></div>
        </td>
        <td>
          <div id="chart_div3" style="width: 600px; height: 400px;" class="chart"></div>
        </td>
      </tr>
    </table>
  </div>

  <div id="electricity" class="tabcontent">
    <table align="center">
      <tr>
        <td>
          <div id="chart_div4" style="width: 600px; height: 400px;" class="chart"></div>
        </td>
        <td>
          <div id="chart_div5" style="width: 600px; height: 400px;" class="chart"></div>
        </td>
      </tr>
    </table>
  </div>
</div>

使用相应的脚本

<script>
    // Get the element with id="defaultOpen" and click on it
    document.getElementById("defaultOpen").click();

    function openTab (evt, tabName) {
      // Declare all variables
      var i, tabcontent, tablinks;

      // Get all elements with class="tabcontent" and hide them
      tabcontent = document.getElementsByClassName("tabcontent");
      for (i = 0; i < tabcontent.length; i++) {
          tabcontent[i].style.display = "none";
      }

      // Get all elements with class="tablinks" and remove the class "active"
      tablinks = document.getElementsByClassName("tablinks");
      for (i = 0; i < tablinks.length; i++) {
          tablinks[i].className = tablinks[i].className.replace(" active", "");
      }

      // Show the current tab, and add an "active" class to the button that opened the tab
      document.getElementById(tabName).style.display = "block";
      evt.currentTarget.className += " active";
    }
</script>

在每个标签中我分别得到3个和2个图表，当我绘制图表时，它们在活动标签中看起来不错，但是当我在第二个标签中切换或反之时，图表变小，直到我使用一些工具刷新它们在webtool中（用于重新计算图表中值的按钮）。我错过了什么或做错了什么？

Answer 1

修正：我在使用toogle标签时重绘图表。

当谷歌标签时谷歌图表失去了他们的风格

1 个答案: