1

我正在使用 Google Charts 绘制柱形图和折线图。如何检查图表是否绘制成功（或者数据表是否填充成功）？

目前我只检查是否已经提交了绘图表单，并确保为数组索引设置了默认值，以避免任何尺寸问题。但我仍然想知道如何以编程方式检查其成功或失败。

我从谷歌得到的唯一提示是这个GadgetHelper 响应，但我没有使用查询来生成数据。

我的代码如下：

<?php
    if(isset($_POST['submit'])){
        echo 'google.setOnLoadCallback(drawChart);';
    }
?>

<script>
function drawChart() {
    data = google.visualization.arrayToDataTable([
        <?php
            // populate array via PHP
        ?>
    ]);
    options = {
       // some options
    };
    chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, options); // some way of checking return value for success??

    // I 'd like to enable this only upon success, not when function is called
    document.getElementById('chart_selector').disabled = false;
}
</script>
4

1 回答 1

4

当图表完成绘制时，使用图表的“就绪”事件处理程序来启用您的元素。如果您需要在图表绘制失败时执行某些操作，您也可以挂钩“错误”事件。

var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
google.visualization.events.addListener(chart, 'ready', function () {
    // do stuff when the chart is done drawing
    document.getElementById('chart_selector').disabled = false;
});
google.visualization.events.addListener(chart, 'error', function () {
    // do stuff when the chart fails to draw
});
chart.draw(data, options);

如果需要处理 DataTable 构造函数失败的情况，可以将构造函数调用包装在 try-catch 块中：

try {
    var data = new google.visualization.DataTable();
    // ...
}
catch (e) {
    alert('DataTable construction failed');
}
于 2013-07-23T21:06:23.740 回答