Google图表不适用于Materialise CSS

Question

我制作了这张Google Charts Graph，但根本没有响应。我的目标是将它集中在Materialise CSS容器div中，但没有任何效果。

google.charts.load('current', {
  'packages': ['bar']
});
google.charts.setOnLoadCallback(drawStuff);

function drawStuff() {
  var data = new google.visualization.arrayToDataTable([
    ['Modul', 'Note'],
    ["M122\n Abläufe mit Scripts/Macros", 5.3],
    ["M226A\n Klassenbasiert implementieren", 5.05],
    ["M307\n Interaktive Webseite erstellen", 5.64],
    ["M133\n Webapplikation realisieren", 4.9],
    ["M214\n Benutzer instruieren", 5.0]

  ]);

  var options = {
    width: '100%',
    height: '100%',
    legend: {
      position: 'none'
    },
    chart: {},
    axes: {
      x: {
        0: {
          side: 'top',
          label: 'Module'
        } // Top x-axis.
      }
    },
    bar: {
      groupWidth: "80%"
    }
  };

  var chart = new google.charts.Bar(document.getElementById('top_x_div'));
  // Convert the Classic options to Material options.
  chart.draw(data, google.charts.Bar.convertOptions(options));
};

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

<div id="top_x_div" class="chart" style="width: 100vw; height: 40vh;"></div>