Question

我正在使用Google Visualization API将基本折线图加载到我的页面上。

目前，此页面会在页面加载时立即显示。 Stack上的先前帖子表明这是由于google.setOnLoadCallback（drawVisualization）实际上取代了.ready事件。

我不希望这个图表无法加载，而是在用户点击按钮后加载。我无法移植这个＆＃34; drawVisualization＆＃34;功能是一个独立于负载的功能。

谢谢!!! 丹

<script type='text/javascript'>
  google.load('visualization', '1', {packages:['gauge']});
  **google.setOnLoadCallback(drawChart);**
  function drawChart() {
    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_div'));
    chart.draw(data, options);
  }

function foo（）{ 我喜欢从这里触发图表!!!! }

Answer 1

使用Javascript：

  google.load('visualization', '1', {packages:['gauge']});

  function foo() {
    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_div'));
    chart.draw(data, options);
  }

HTML：

<input type="button" onclick="foo()">Test</input>

setOnLoadCallback：尝试按下按钮时加载Google Visualization而不是页面加载

1 个答案: