Google 仪表图表未与同一页面上的其他图表一起显示

Question

Google 仪表图表未与同一页面上的其他图表一起显示。

我尝试将负责仪表图表的代码放在第一行，但没有帮助。

只有独自一人时才有效。

这是我的代码：

<script type="text/javascript">

    // Load the Visualization API and the package.
    google.charts.load('current', {'packages':['corechart']});

    // Set a callback to run when the Google Visualization API is loaded.
    google.charts.setOnLoadCallback(drawLineChart);
    // Set a callback to run when the Google Visualization API is loaded.
    google.charts.setOnLoadCallback(drawPieChart);


    function drawLineChart() {

      var jsonData = $.ajax({
          url: "dane.json",
         dataType: "json",
         async: false
         }).responseText;

          var options = {
        'title':'Wilgotność Początkowa VS Wilgotność Końcowa',

            hAxis: {
          title: 'Data - Godzina',
          textStyle: {
            color: '#1a237e',
            fontSize: 12,
            bold: true
          },
          titleTextStyle: {
            color: '#1a237e',
            fontSize: 14,
            bold: true
          }
        },
        vAxis: {
          title: 'Wilgotność %',
          textStyle: {
            color: '#1a237e',
            fontSize: 12,
            bold: true
          },
          titleTextStyle: {
            color: '#1a237e',
            fontSize: 14,
            bold: true
          }
        }

          };


      // Create our data table out of JSON data loaded from server.
     var data = new google.visualization.DataTable(jsonData);

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data,  options);
}

    function drawPieChart() {

      var jsonData = $.ajax({
          url: "dane2.json",
         dataType: "json",
         async: false
         }).responseText;

         var options = {
        title:'Straty Towaru w %',
        pieHole: 0.4,
            slices: {
            0: { color: 'red' },
            1: { color: 'blue' },
            2: { color: 'orange' }
          }

          };

      // Create our data table out of JSON data loaded from server.
     var data = new google.visualization.DataTable(jsonData);

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.PieChart(document.getElementById('chart_div2'));
      chart.draw(data,  options);

    }

    // Load the Visualization API and the package.
    google.charts.load('current',  {'packages':['gauge']});
    // Set a callback to run when the Google Visualization API is loaded.
    google.charts.setOnLoadCallback(drawGaugeChart);

function drawGaugeChart() {

        var data = google.visualization.arrayToDataTable([
          ['Label', 'Value'],
          ['Memory', 80]
        ]);

        var options = {
          width: 400, height: 120,
          redFrom: 90, redTo: 100,
          yellowFrom:75, yellowTo: 90,
          minorTicks: 5
        };

        var chart = new google.visualization.Gauge(document.getElementById('chart_div3'));

        chart.draw(data, options);

        setInterval(function() {
          data.setValue(0, 1, 40 + Math.round(60 * Math.random()));
          chart.draw(data, options);
        }, 13000);

      }

有人知道问题出在哪里吗？

Answer 1

我也有同样的问题。仪表图在与任何其他图表放在一起时才加载