Chart JS -如果数据太多，则使图表可滚动

<div style="height: 400px; overflow-y: scroll;">
  <canvas id="myChart"></canvas>
</div>

<div style="height: 400px; overflow-y: scroll;">
  <canvas id="myChart"></canvas>
</div>

<script src="path/to/Chart.min.js"></script>
<script src="path/to/Chart.Scroller.js"></script>

<script>
  var ctx = document.getElementById('myChart').getContext('2d');
  var chart = new Chart(ctx, {
    type: 'line',
    data: {
      // 数据设置
    },
    options: {
      // 基本配置选项
      plugins: {
        scroller: {
          // 启用插件
          enabled: true,
          // 设置滚动条样式和位置
          scrollbar: {
            mode: 'x',
            backgroundColor: 'rgba(0, 0, 0, 0.5)',
            width: 10,
            show: true,
          },
          // 设置缩放功能
          zoom: {
            enabled: true,
            mode: 'x',
          },
        },
      },
    },
  });
</script>