如何使我的图表仅在加载数据时可见？

Question

当我单击按钮时，我会调用图表。但是，我想要的是该图表在调用该函数之前是不可见的。 一切都按我的想象进行，但是在我使用“确定”按钮调用函数之前，该图表已经可以看到一个白色的小矩形框。可以仅在调用函数之后使图表可见吗？

HTML代码：

<button id="button_ok" onclick="GetTimeseries_rotation()">Ok</button></p>
<div style="width: 80%; min-width: 600px;">
  <canvas id="mychart"></canvas>
</div>

JAVASCRIPT-CODE：

var ctx = document.getElementById('mychart').getContext('2d');
var chart = new Chart(ctx, {
  type: 'line',
  responsive: true,
  pointDotRadius: 10,
  bezierCurve: false,
  scaleShowVerticalLines: false,
  data: {
    labels: time,
    datasets: [{
      label: "Bowl rpm",
      data: bowl_rotation,
      borderColor: 'rgb(17,31,50)',
      fill: false
    }]
  },
  options: {
    elements: {
      rectangle: {
        borderWidth: 2,
        borderColor: 'rgb(0, 255, 0)',
        borderSkipped: 'bottom'
      }
    },
    hover: {mode: null},
    events: [],
    responsive: true,
    legend: {
      position: 'top',
    },
    title: {
      display: true,
      text: 'Trommeldrehzahl'
    },
    scales: {
      xAxes: [{
        ticks: {
          autoSkip: true,
          maxTicksLimit: 20
        }
      }]
    },
  }
});

CSS代码：

#mychart{
  background-color: whitesmoke;
  height: 100px;
  margin-left: 20px;
  margin-top: 50px;
}