javascript - 谷歌表格图表中的标题有非常不稳定的鼠标滚轮滚动

Question

在 Google Visualization API 中，当表格有大量数据时，使用鼠标滚轮上下滚动时，标题会非常不稳定。

我在这里有一个测试来说明我的意思（忽略标题没有任何文本的事实，不知道为什么它没有检测到它，这是一个单独的问题）。

有没有办法让这种情况下的滚动更体面？

查看 GIF：

google.charts.load('current', {
  callback: drawBasic,
  packages: ['table']
});

function drawBasic() {
  var query = new google.visualization.Query(
    'https://docs.google.com/spreadsheets/d/1w1vaFAPTE440jc2cpYGftXSaPwGxU_x7iQRSGK35oYc/edit#gid=0&headers=1'
  );
  query.setQuery('SELECT A,B,C,D,E,F,G,H,I');
  query.send(handleQueryResponse);
}

function handleQueryResponse(response) {
  if (response.isError()) {
    alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
    return;
  }


  var data = response.getDataTable();
  var options = {
    title: 'test',
    height: '80vh',
    showRowNumber: true,
    page: "enable",
		pageSize: 500,
		allowHtml: true
  }

  var chart = new google.visualization.Table(document.getElementById('chart_div'));
  chart.draw(data, options)
  
}

#chart_div{
  margin-top: 20px;
   white-space: nowrap;
}

.google-visualization-table-tr-head {
  
  background-color: red!important;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

标签： javascripthtmlcssgoogle-visualization